Home About Blog Terms Docs Contact

Installing the PreProduct snippet


To manually install PreProduct onto your storefront, you will need to copy and paste <div id="preproduct-pledge" data-id="{{product.id}}" style="text-align:left!important;"></div> into your product page theme file (e.g. product-template.liquid), just after {{ product.description }} or wherever on the product page you would like the PreProduct widget to appear. Below is a quick guide on how to do this.


Step by step #

1. Copy the following code snippet to your clipboard:

<div id="preproduct-pledge" data-id="{{product.id}}" style="text-align:left!important;"></div>


2. Click on Online Store in your Shopify toolbar, followed by the Actions button above the preview of your store, then click Edit code from the dropdown menu.
Step 1


3. Now click on the sections folder from the list and then find your product page template e.g. ‘product-template.liquid’, ‘/templates/product.liquid’ or ‘/snippets/product-form.liquid’.

Now you can paste the code snippet anywhere you would like it to appear on the page. Placing it before the description can be carried out by hitting the command key and f or the control key and f to open the find function of your browser, then by typing in product.description (or ‘product.content’) and hitting enter. You should see something like the below example:

{{ product.description }}


4. Paste the PreProduct code snippet from step 1 directly after the above. Now save your theme.

Step 2

Any problems setting up, dont hesitate to email us at hello@preproduct.io and we will help get you up and running.



Manual uninstall



To manually uninstall PreProduct from your storefront, you will need to do the exact opposite of the above. Finding <div id="preproduct-pledge" data-id="{{product.id}}" style="text-align:left!important;" ></div> in your product page theme file, and deleting it.

Powered by BetterDocs

Leave a Reply

Your email address will not be published. Required fields are marked *