Setup a sign customiser on a legacy theme
By following these instructions, you can install the app in your legacy theme, an older theme introduced in mid-2021.
1. Go to your Shopify admin, Click on Sales Channels and select Online Store
2. On the list of links for Online Store, you will find a navigation link called Themes
On the theme, you wish to edit click on the three dots ... to expand the list and then click on Edit Code
3. You can create a page template or a product template and use it to assign to a product or page. In this demonstration, I am using a product. In the Templates section, 'Add a new template'.
- Select Product in the dropdown menu of Select a template to create.
- In Template type, select Liquid.
- Add Neon Product Customizer in File Name.
- Click Done/Create Template.
4. Using the code editor in the following.
- Copy the code example below and paste it near the top of the page or where you would like for it to display.
- Change the ENTER YOUR CUSTOMIZER_ID text to the ID of the customizer you wish to you. Please follow these instructions to get it https://sign-customizer.helpscoutdocs.com/article/94-find-your-sign-customizer-id
- Hit Save
<div id="neon-customiser-app" data-customiserid="ENTER_YOUR_CUSTOMIZER_ID"></div>
You should have something like this
5 Refer back to the Theme in which we added the new template and click Customize:
6. Once the Shopify theme editor is open on the left-hand side you will see sidebar with three icons, click on the one highlighted in this image
7. Click Theme Settings on the bottom left corner and enable the App embed and click Save to enable the app:
8. Go back into your Shopify admin, click on Products and click on the product you want to modify:
9. Scroll down to the Online Store on the right side and choose neon-product-customiser and click Save:
You are all done!
Note: If the above template was created as a page, you can follow the same instructions. Refer to the Pages section from your Shopify admin, create a new page, change the theme template under Online Store to the newly created template and click Save. You can also refer to the Navigation and can link it with the page or product.