Tagging the Product Details Page (PDP) on Shopify

🚚 Moving to Dev Docs

Our technical documentation is now hosted in our Developer Documentation. This article has already been migrated; check it out there. The Knowledge Center version will be retired on April 29th, 2024.

For Ordergroove's subscription offer to appear on your site, your product details page (PDP) needs to be tagged with an Ordergroove code snippet. If our app could not automatically tag your product details page (PDP), you can do it manually by following these steps.

Ordergroove's offer may not appear correctly if there are code snippets from other subscription programs present. To prevent this issue, please ensure before installation that your theme is clean of other code snippets.

Note: If your store uses an Online Store 2.0 theme, please refer to this article for help.

  1. Open the theme code editor on Shopify.

  2. Find the file that contains the "add to cart" button. This file is usually a file with "product" in the name. The most common files are product-template.liquid or product-form.liquid, but it may be a different file depending on your theme. You can find the "add to cart" button within the file by hitting CTRL+F and searching for "add" in the search bar. 

  3. Once you find the appropriate file, paste this code snippet above the "add to cart" button.
    {%- render 'ordergroove_offer' product: product.selected_or_first_available_variant location: 'pdp' -%}

    Here is an example in the Debut theme:

    e207d25-changed_to_current_variant.png



  4. Click save to save your changes.

 

Now that you've tagged the PDP properly, check it out on your site! If your subscription program is live, you can navigate to a product that is eligible for subscription and you should see the subscription options appear on the page.

Need further assistance? Email shopifyhelp@ordergroove.com and someone from our team can help you with properly tagging your PDP.