Overview

The installation of the Guidde agent is made up of two pieces, the snippet and the initialization:

The snippet is a short Javascript function that adds the guidde.js file to the window. guidde.js. It establishes all resources required for initialization and injects the widget in the background.
The initialization identifies the user and account metadata and makes the widget visible.

Both pieces of the installation must be present on all pages of your website you wish the widget to run in. If you have a single-page application you only need to initialize once per session. Multi-page apps or apps that have hard refresh after some actions(e.g. login) should initialize on every page.

Only initialize Guidde without a user ID if you are deliberately trying to track anonymous users.

Guidde Snippet

The snippet code block loads Guidde as a library that will make our functions available at the window-level. The script also passes through the application key. API key identifies specific widget configuration.

Snippet can be found in Guidde under:

Integrations -> Broadcast -> <Your sdk widget> - Edit Widget -> View code

The Guidde snippet should be pasted in the <head> section:

<script>
(function(k)
{const u="https://"+k+".broadcast.app.guidde.com/"
window.guidde={_apiKey:k,u,init:(p)=>{window.guidde._i=(p||{})}}
const s=document.createElement("script")
const h=document.querySelector("head")
if(h){s.src=u+"guidde.js";h.appendChild(s)}})
("YOUR_API_KEY")
</script>

Initializing Guidde

The Guidde agent must be initialized in order to provide user data and start delivering content recommendations. The initialization is where you pass user data and additional metadata that you provide Guidde. Each time initialization is called with an existing userId and new information, the user data is updated.

To start and initialize the Guidde agent, perform the following call in code:

<script>

   guidde.init()

</script>

or

<script>

   guidde.init({ ...user_info_here... })

</script>

or

<script>

   window.guidde.init({ ...user_info_here... })

</script>

Below you may find an example of the initialization code block. Your team must determine the appropriate values to pass as the user and account ID and additional metadata.

var initOptions = {

   // recommended (optional) user properties

   "userId": "1234567890", // unique

   "userEmail": "[email protected]",

   "userName": "John Doe",

   // recommended (optional) account properties

   "accountId": "987654321", // unique

   "accountName": "Acme Corp",

  

   // additional suggestions, you can add any additional key-values here,

   // as long as it's not one of the above reserved names.

   "userRole": "Admin",

   "version": "2.0",

   "languages": ["Spanish"],

   "accountIsPaying": "true",

   "accountType": "OEM",

   "accountPlan": "Basic"

}

guidde.init(initOptions)

JSON.stringify(initOptions).length cannot exceed 512 bytes.

Properties Restrictions

The property name can only contain letters, digits or underscore '_'
The property name first character must be a letter
The property name is up to 20 characters long
The property value type is restricted to string or array of strings

Configuration Properties

By default, the widget is shown in open state immediately after the guidde.init() call.

You may override this behavior by using the disableWidgetAutoFire flag. This mode is useful if you are intending to use customer buttons in your own application in order to control the open and close behavior of the widget.

guidde.init({disableWidgetAutoFire=false|true})

In case the flag for disableWidgetAutoFire is set to true, the widget is initialized in the background and not visible on the page.
In order to open the widget if the flag is set to true, you will need to call the the open API function.

Broadcast API