Setting Up Multiple Collection Page Discount Blocks Per Page
If you have multiple collections displayed on a specific page (for example, multiple featured collections on your home page), then you need to perform special steps to set that up.
The objective of this process is to set up multiple collection page discount blocks per page in your theme by adding unique keys to each collection grid to enable the app to identify and display discounts correctly.
Click the thumbnail above to watch an example of this setup in the Dawn theme.
Access the theme code by clicking on the three dots and selecting "Edit Code."
Locate the template file corresponding to the page where the desired collection grids are displayed (e.g., index.json for the homepage).
Search for the featured collection block in the template file (e.g., featured-collection).
Based on the block "type" attribute, find the corresponding Liquid file in your theme. Example: featured-collection.liquid.
Identify the product grid element within the code (e.g., class="grid").
Add the HTML attribute data-regios-dopp-collection-block-key to the grid element.
Assign a unique key value to the attribute. We recommend using the collection handle (e.g., "shirts" or "all"). The collection handle appears in the collection URL. For example, in the URL mysite.com/collections/shoes, the handle is shoes.
Add a "Collection Page Discount" app block to your template in the Theme Editor, one for each collection on the page.
Make sure each "Collection Page Discount" app block has a "Collection" assigned in its settings. Make sure the "Products per page" matches as well.
Set the "Unique Key" setting on each "Collection Page Discount" to the handle of the corresponding collection.
Save the changes and preview the site to ensure discounts are displayed correctly.
- Ensure that the unique key value assigned to each grid matches the handle of the respective collection.
- Be cautious while editing the theme code to prevent any unintended changes that may affect the overall functionality of the website.
- If unfamiliar with HTML or coding, consider consulting a developer for assistance.
- Use the collection handle as the unique key for simplicity and clarity.
- Verify the changes by previewing the site and checking the HTML code to confirm the attribute values.
- Reach out to our support team for any further questions or concerns regarding the setup process.
We want to hear about your experience with our app! Leave a review on the Shopify App Store.
The objective of this process is to set up multiple collection page discount blocks per page in your theme by adding unique keys to each collection grid to enable the app to identify and display discounts correctly.
Click the thumbnail above to watch an example of this setup in the Dawn theme.
Key Steps
Access the theme code by clicking on the three dots and selecting "Edit Code."
Locate the template file corresponding to the page where the desired collection grids are displayed (e.g., index.json for the homepage).
Search for the featured collection block in the template file (e.g., featured-collection).
Based on the block "type" attribute, find the corresponding Liquid file in your theme. Example: featured-collection.liquid.
Identify the product grid element within the code (e.g., class="grid").
Add the HTML attribute data-regios-dopp-collection-block-key to the grid element.
Assign a unique key value to the attribute. We recommend using the collection handle (e.g., "shirts" or "all"). The collection handle appears in the collection URL. For example, in the URL mysite.com/collections/shoes, the handle is shoes.
Add a "Collection Page Discount" app block to your template in the Theme Editor, one for each collection on the page.
Make sure each "Collection Page Discount" app block has a "Collection" assigned in its settings. Make sure the "Products per page" matches as well.
Set the "Unique Key" setting on each "Collection Page Discount" to the handle of the corresponding collection.
Save the changes and preview the site to ensure discounts are displayed correctly.
Cautionary Notes
- Ensure that the unique key value assigned to each grid matches the handle of the respective collection.
- Be cautious while editing the theme code to prevent any unintended changes that may affect the overall functionality of the website.
- If unfamiliar with HTML or coding, consider consulting a developer for assistance.
Tips for Efficiency
- Use the collection handle as the unique key for simplicity and clarity.
- Verify the changes by previewing the site and checking the HTML code to confirm the attribute values.
- Reach out to our support team for any further questions or concerns regarding the setup process.
Have any feedback for us?
We want to hear about your experience with our app! Leave a review on the Shopify App Store.
Updated on: 17/06/2024
Thank you!