How to configure a loyalty widget on your website
The widget is a useful tool in the dashboard for customers to view their account information, without needing to leave your website. This can also act as a home page for loyalty as an alternative to the contacts portal. Using our Mollie integration, it can also be used to sell gift cards online.
To create the widget, follow the steps below:
Proceed to 'Apps' then ‘widget’ and then select ‘new widget’
You will then be taken to the design page of the widget. Use the ‘branding’ button in the top right corner to manage the visual outlook and design of your widget. Individual information fields and elements can be managed on the right hand side, with page navigation on the left.
Make sure you at least create an automated email with the category ‘login’ so your customers can retrieve a login code. If your register page is active, you also need a ‘registration’ email for new sign-ups.
Once created, the login email can be linked by selecting the ‘login’ page on the left hand side and then ‘select login email’ on the right.
To install the widget on your website, complete the following steps:
Go to 'Apps' and then ‘widget’ and select the widget you want to install.
Select your widget and make sure you are on the ‘installation’ page.
Locate the ‘code snippet’ and input this code in the correct section of your platform set up. The instruction for installation of the code varies per platform (see below). Contact your website manager or developer for issues with installation.
Instructions per provider:
WordPress
The easiest way to add your own code to the header (and footer) of your WordPress website is via a plugin, but you can also do it manually. However, it is faster and simpler via a plugin. Install a plugin on your WordPress that allows you to add script to your header and footer, like this one. Follow the instructions of the plugin.
Wix
To add your own code to the header of your Wix website, you need a premium Wix account. Then go to your website settings and click on Tracking Tools. Then click on Custom code. Paste your widget code under 'Enter the code snippet here:', select your domain, and make sure your code is placed on your Head. Your widget is now online!
Shopify
To add the widget code to your Shopify website, you need to edit your theme code . Go to Online Store → Theme and click Actions → Edit Code. You now enter your Code Editor. In the Code Editor, open theme.liquid. In the code, look for the </head> tag. Paste your widget code above this </head> tag. Click Save. Your widget is now online!
Lightspeed
To add your widget code to your Lightspeed website, add the widget code to Custom Javascript . In your Lightspee dashboard, click on Settings . Under Website Settings , click Web Extras . Add the widget code to Custom Javascript , set the Status to on and click Save . Your widget is now online!
Magento
To add your widget code to your Magento webshop, you will have to adjust the Configuration . In the navigation sidebar on the left, click Content , and then click Configuration under the Design heading . Click on Edit on the theme where you want to add the widget . Scroll to the HTML Header heading and click on it to expand it. Paste the widget code into Scripts and Style sheets . Save the theme and you're done!
Squarespace
From your Squarespace editor, click Settings at the bottom, and choose the Advanced heading from the next menu . Then go to Code injection and paste the widget code from your Business Dashboard in the text area under Header . Then click Save at the top left and your widget is on your website!