This article explains the process of adding code to your Shopify store that will then enable the Configurator functionality for your personalisable products.


Note that this guide refers to the configuration of storefronts utilizing the Shopify Online Store 2.0 themes.  For themes using Shopify Themes v1.0, please contact one of our representatives who will be able to configure this for you.


Step 1: Obtain the Snippet Name

We will generate a snippet file in the Shopify code and then provide you with the name.  When run, this snippet file will modify the product page to show the personalise button that will launch the Configurator.


Step 2: Add the Snippet to the Store

Log into the admin section of your Shopify store and follow these instructions:

  • In the search bar at the top, type in theme, and click on the Shopify Admin -> Themes option.

  • Click the Customize button.

  • Your shop storefront should load in an editable window.  Click on one of the products in your shop to show the item screen.  Scroll to the section with the 'Add to cart' and 'Buy it now' buttons. (the placement and styling will differ depending on the theme used)
  • Hover over the lower part of the buttons until the 'Add Block' option appears.
  • Click Add block and select Custom Liquid from the options.

  • A text box will appear on the right side of the screen.  

  • Enter the following code into the box, replacing snippet with the name of the Snippet file:

{% render 'snippet' %}

  • If everything is correct, a 'Custom Liquid' box should appear underneath the buttons.  If a 'Liquid error' appears inside the custom box, please check the spelling of the liquid file.  (it does not require the .liquid file extension).
  • Click the Save button at the top right to save the changes to your store.
  • Your store should now be configured to work with the configurator.  To check, visit the store outside of the store editor and view a personalisable product.  There should be a Customise button present, and the Buy it now button should have been removed.