Different ways to integrate the product guide into your website and to customize the integration will be described in the following.
Integration Code
The Integration Code view allows you to generate a code snippet that you can use to integrate your Product Guide into a website.
Choose the correct environment (see Stage versus Live Environment) and the language ant theme (and any additional parameters that might've been added for your guide specifically) the Product Guide should be displayed with. Use the "Copy Code" button to copy the generated cody snippet.
Your Code will look something like this:
<!-- begin excentos integration code --> <script src="//stage.excentos.com/CompanyName/DE/app_ApplicationName/locale/loadadvisor?theme=default"> </script> <!-- end excentos integration code // start content area where Product Guide is displayed --> <div id="xc_application"> <div id="xc_application_pane"></div> <div id="xc_loader"></div> </div> <!-- end excentos content area -->
Simple JavaScript integration
The easiest way to integrate the guide is to paste the entire copied code to the exact place in your website's HTML where you want the Product Guide to be displayed.
Integration via GoogleTagManager (GTM)
Using GTM might also make it easier to change parameters (e.g. the theme that should be used) because you don't have to actually change your website code. First, you need to split the integration code into two separate parts: The Script and the HTML. First, add the HTML part to your website's html at the exact position where the Product Guide should be displayed. To load the script code via GTM, log in to the google tag manager dashboard and create a new tag. Select the tag type "Custom HTML", add the Script code and configure the trigger to fire on the page where you added the HTML code.
As a more flexible alternative, you may use the Google Tag Manager to integrate a Product Guide into your website. You should only consider this option if you are already using GTM in your website. <script
src="//stage.excentos.com/CompanyName/DE/app_ApplicationName/locale/loadadvisor?theme=default">
</script>
<!-- end excentos integration code // start content area where Product Guide is displayed -->
<div id="xc_application">
<div id="xc_application_pane"></div>
<div id="xc_loader"></div>
</div>
<!-- end excentos content area -->
Additional parameters
TODO preset values, add consent, ...