Please note: Only the Shopify and WooCommerce plugins will verify your domain for you. For all other websites please ensure you have verified your domain. See help with that here.
Shopify #
- Install the official Liffery app from the Shopify app store https://apps.shopify.com/liffery/ (currently being released)
- After installing, the app will automatically verify the domain for you. Wait for that to finish.
- After verification, click the Install button. That’s it! Nothing else to do. Please note: there can sometimes be a short delay while the sidebar is activated. If you don’t see the sidebar straight away wait a few minutes and check again.
WordPress / WooCommerce #
- Install the official Liffery plugin from the WordPress website https://wordpress.org/plugins/liffery/
- After installing and activating the Liffery plugin, head over to the plugin page via the WordPress settings. You will need to verify the installation by providing the installation code that can be found on the WooCommerce section of the Verification & Installation page in your business account.
- If the verification was a success you should be able to see the Liffery Sidebar installed onto your site.
Squarespace #
- Log into your Squarespace account and select your website.
- Open “Settings” on the left-side menu.
- Scroll the menu down a little and choose the “Advanced” settings.
- Choose the “Code Injection” console.
- Insert the following code into the “Header” section:
<!-- Liffery Sidebar --> <script async src="https://www.liffery.com/_/sidebar/p.js"></script>
That is it, your website will now be loading the Liffery Sidebar.
Magento #
Magento is a very large and powerful platform with many options and variations of how it can be installed.
Due to the large variations and complexities in Magento, it is advisable to speak to your eCommerce site web developer.
Installation of the Liffery Sidebar requires extending the correct template on the server, for example, if you were using the default theme then:
- The magento/theme-frontend-blank/Magento_Theme/layout/default_head_blocks.xml should be extended with the code snippet:
<!-- Liffery Sidebar --> <script async src="https://www.liffery.com/_/sidebar/p.js" src_type="url"></script>
- NB: Take note of the Magento specific src_type=”url” on the script tag.
Google Tag Manager #
Google Tag Manager is a great way to easily install the Liffery Sidebar. To install the Liffery Sidebar via Google Tag Manager you will need to add a custom tag.
The best way to learn how to install a Custom Tag to Google Tag Manager is to follow Google’s instructions on the topic: Google Custom Tags
Custom Tag Content:
<!-- Liffery Sidebar -->
<script async src="https://www.liffery.com/_/sidebar/p.js"></script>
Shopware 5 #
Shopware 5 does not require any special addons or similar for the Liffery Sidebar to be installed.
The default theme in Shopware 5 offers the ability to Embedding external resources without any additional libraries or Addons.
- Copy the Liffery Sidebar snippet:
<!-- Liffery Sidebar --> <script async src="https://www.liffery.com/_/sidebar/p.js"></script>
- Paste into the Embedding external resources “Additional Javascript Libraries” box.
- Press save.
That is it, your website will now be loading the Liffery Sidebar.
Shopware 6 #
The Liffery Sidebar on Shopware 6 is best installed as a custom script via the Custom JavaScript/CSS Manager for Shopware 6 extension. After installing this extension:
- Copy the Liffery Sidebar code snippet to your clipboard:
<!-- Liffery Sidebar --> <script async src="https://www.liffery.com/_/sidebar/p.js"></script>
- Paste the snippet into the box titled “Javascript” and press save.
Universal One Liner #
The manual installation of the Liffery Sidebar requires that you can add 1 script to your website.
The 1 Liner:
<!-- Liffery Sidebar -->
<script async src="https://www.liffery.com/_/sidebar/p.js"></script>
Ensure the above code snippet is added on every page you would like the sidebar to appear.
Typically this can be added to a common footer or header component of your website, but if you are unsure you can either contact the Liffery support or your web developer.