Installing Your Widget

Finalizing the setup of your customer loyalty program involves deploying your interactive widget across your customer-facing digital platforms. This lesson covers where to locate your unique deployment script and how to prepare it for integration into standard e-commerce hosts or custom-coded web architectures.

Key Takeaways

• Accessing the Installation Menu: To locate your deployment data, navigate to your dashboard and select Settings > Apps. Click on your active widget profile from your list and choose View. Within the left-hand navigation menu of the widget workspace, click Installation.

• The Unified Code Fragment: The platform provides a unique, standardized script block called a code fragment. This raw section of code acts as the universal bridge between the platform's backend loyalty database and your public digital channels.

• Platform-Agnostic Deployment: The installation process relies entirely on copying this specific code fragment and pasting it into the designated integration or custom code fields within your external web host.

• Supported Environments: The code fragment is highly adaptable and can be deployed smoothly across a wide range of web environments:

  • E-Commerce Ecosystems: Integrates natively into standard commerce platforms such as Shopify, Wix, and Lightspeed.

  • Custom Web Development: Works interchangeably within custom-coded, proprietary websites and independently developed landing pages.

• Accessing Specific Platform Guides: While the primary script-copying method remains identical across the platform, the exact input screen locations vary by website provider. Detailed, platform-specific copy-paste documentation for the most common content management systems is provided in the reference article immediately following this module.

Installation Instructions per Platform

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!