Overview
AdvocateAnywhere allows users to seamlessly integrate and personalize embedded challenges into their websites. The article provides a step-by-step guide on customizing the appearance of AdvocateAnywhere, integrating the necessary code into your website's HTML, using a custom domain, and setting up and embedding challenges on specific webpages to enhance the user experience.
Information
1. Personalize your AdvocateAnywhere
You can configure your AdvocateAnywhere look and feel from Settings -> Embeddables -> AdvocateAnywhere . There are 3 options you can set up for customizing your embedded challenges:
- Tab Size & Logo - The tab logo will be used to indicate to advocates that there's an embedded challenge available to them. It should be a square image, and will be automatically resized to the correct dimensions for you.
- Color Scheme - Choose the color you want to use for your embedded challenges. You can use the color scheme you use for your hub, or enter a hex color code if you want precise control over your color scheme.
- Messaging - The "Thank-You" message is what is shown to advocates after they have completed all the challenges available to them.
2. Integrate the AdvocateAnywhere code
Paste the following code on any page where you want to enable AdvocateAnywhere. Nothing will be shown on these pages until you select which challenges you wish to embed from your Challenge list. You can place this code anywhere on your site, but we recommend placing it before your closing
</body>
tag to keep your pages loading quickly.
<script src="https://YOURHUB.influitive.com/embed.js" data-infl-hub="YOURHUB"></script><br>
If you are using a custom domain, please use the following code:
<script src="https://CUSTOM_DOMAIN.COM/embed.js" data-infl-hub="YOURHUB" data-infl-custom-domain="CUSTOM_DOMAIN.COM"></script>
We recommend adding this code to as many pages as possible (generally through a shared theme or template file that is included in all pages on your site), so that if you want to embed challenges on more pages on your site, you don't need to go through this step again.
If you have information about the people visiting your site (through login to an application, or other analytics tracking you might be using), sharing this information with AdvocateAnywhere will make the advocate experience better. Read our guide on identifying advocates and include this code.
3. Embed a Challenge
Once AdvocateAnywhere is set up, embedding challenges is easy! Just the use the AdvocateAnywhere Challenge Creator to create challenges, publishing them like a regular challenge
To embed challenges on a particular site, specify a URL to embed your challenges under Embed on my webpages that match the URL(s) listed below: and click Add . Once this is done, anyone visiting your site will see the embedded challenge callout, and will be able to complete challenges. This can be used to target different parts of your app or website with different challenges depending on the content!
FAQ
How do I personalize the appearance of AdvocateAnywhere on my website?
You can personalize the appearance by adjusting the tab size and logo, selecting a color scheme, and customizing the "Thank-You" message through the settings under Settings > Embeddables > AdvocateAnywhere.
Where should I insert the AdvocateAnywhere script in my website's HTML?
It is best practice to insert the script just before the closing tag to optimize page load speed.
Can I use AdvocateAnywhere with a custom domain?
Yes, if your site uses a custom domain, you should replace the standard script with the custom domain script provided in the guide.
How do I embed challenges on my website using AdvocateAnywhere?
To embed challenges, specify the URL where you want the challenges to appear in the AdvocateAnywhere Challenge Creator, then add the URL under the section "Embed on my webpages that match the URL(s) listed below" and click "Add".
Can I personalize the user experience by incorporating user data into AdvocateAnywhere?
Yes, if your site captures user data, you can personalize the experience by incorporating this data. Consult the guide on identifying advocates for instructions on including this additional code.