Store

Embed the whole store onto your site, toggle on Enable widgets in store management settings.

Whitelisted domain(s)

No domains added → The widget can be embedded and used on any domain.

Domains added → The widget can only be embedded and used on the listed domain(s).

Customisation

Use the widget preview at the bottom to track the color changes. After configuring the appearance of the widget, copy the codes provided at the bottom for each widget types.

A read-only display of all the items in the store, with a optional CTA button to be included.

Simple set up: Include the iframe code anywhere on your platform!

Example:

<iframe 
    src="https://prod-widgets.returning.ai/store-widget/NjYzMZGJkNGE5ZTQx/open-widget" id="returningAiWidgetIframe" 
    frameborder="0" 
    width="100%" 
    height="100%">
</iframe>

No Authentication: All users who visits your site will be able to see the widget.

All store items can be seen regardless of permissions.

CTA button can be linked to any URL: default URL links users to the server's store.

CTA button appears at the bottom right of the page.

Button content and URL can be set up in the settings.

Authenticate the users who sees the widget and users will be able to make purchases.

Requires more development effort:

Collection and saviong of each user's token

Example:

     fetch('https://prod-widgets.returning.ai/store-widget/NjYzMZGJkNGE5ZTQx/signin', 
     {
        method: 'POST', 
        headers: {
          'returningai-api-key': 'df09a52de262f1f802950815864',
          'email': '{email}',
          'Content-Type': 'application/json',
        }
      }).then((res) => {        
        res.json().then(data => {
          localStorage.setItem('returning-ai-widget-token', data.token)
        })
      }).catch((err) => {
        console.log(err)
      })

Add Event listerner to get the token

Example:

 <script>
    window.addEventListener('message', (event) => {
      if (event.origin === 'https://prod-widgets.returning.ai') { // Check origin for security
        const { type } = event.data;
        if (type === 'RETURNINGAI_WIDGET_TOKEN') {
            const value = localStorage.getItem('returning-ai-widget-token');
            // Send the value back to the parent window
            event.source.postMessage({ type: 'RETURNINGAI_WIDGET_TOKEN', value 
            }, event.origin);
        }
      }
    });
</script>

Add the iframe into the site's code

<iframe src="prod-widgets.returning.ai/store-widget/NjYzMZGJkNGE5ZTQx" allow="clipboard-write" id="returningAiWidgetIframe" frameborder="0" width="100%" height="100%"></iframe>

Whitelisted domain(s)

Customisation

Public widget

Authenticated widget

Store

Whitelisted domain(s)#

Customisation#

Public widget#

Authenticated widget#

Whitelisted domain(s)

Customisation

Public widget

Authenticated widget