How to show product-specific content on product templates

When building your Product Template in Replo, you may have content that you only want visible for certain products assigned to that template.

For example, maybe some of the products that you assigned to the template have specific variants, while some do not, or you have three types of shoes that you’re selling, but for each type you want to show a different section below talking about the designer for that shoe.

You can accomplish those tasks in Replo by using a State and the “Template Product =” state trigger in Replo.

1. Select the component you want to add a state to.

2. Find "States" at the top of the right bar of the editor.

3. Click the "+" button to the right of the “States” header.

4. Click the "Add Custom" option and add a Name for the state.

5. Under “Show If”, select “Template Product”

6. Select “equals” or “not equals”.

   1. If you select “equals”, the state will apply when the template product matches

   2. If you select “not equals”, the state will apply when the template product doesn’t match

7. Select the products that you want to hide or show that component

8. Finally, to ensure that the new state only works when the Product Template = to the ones you’ve selected, you must hide the component in the Default state. To do this, just unselect Desktop, Tablet, and Mobile underneath the Visibility header in the design bar. You may have to re-enable visibility for the newly created state.

To test that this is working, enter into preview mode in the bottom toolbar. Once in preview mode, toggle through the selected product in the upper-left of the screen. The components should hide and show as expected.