Shopify Product Component

A very common component to use on Replo pages in your Shopify store is a box which displays information about a product. Replo can automatically integrate with your Shopify store's product listing in order to display product information anywhere in any Replo page.

Add a product component:

  1. Navigate to the page you want to add an Product component to in the editor.
  2. On the left side of the editor, click the "Components" toggle, then search for "Product".
  3. Drag the product box into the page.

Selecting a Shopify product:

  1. Select the Product Box you want to configure in the editor.
  2. On the right side of the editor, click the "Config" button.
  3. Click "Select Product" to select a product - you can choose from any product in your Shopify store's catalog.
  4. After selecting the product, the box will update with new product information.

Dynamic Data for Price, Description, and More

Product Boxes can use dynamic data to display product prices, descriptions, titles, add-to-cart buttons, and more. For more information, see Dynamic Data.

To Add an Add To Cart Button to a Product Box:

  1. Select the Product box you want to add to.
  2. On the left side of the editor, click the "Components" toggle, then search for "Button", and drag in the button.
  3. Select the button, then under "Interactions" on the left, click the "+" button next to "On Click", then select "Add Product to Cart."
  4. Click the Dynamic Data button (the four dots icon), then click "Selected Variant."
  5. Click "Add Dynamic Data" then "Save" to save the Interaction