Setting Up Constructor Product Recommendations with Reactiv

 Written by Reactiv App

Prerequisites

Before enabling Constructor in Reactiv, make sure the following are complete:

1. Constructor Account
   Your business must have an active Constructor account.

2. Install Constructor’s Shopify Connector

   • Install the Constructor Connect app from the Shopify App Store.

   • The Constructor team will configure the app so your Shopify products are ingested into your Constructor index and available to Reactiv.

3. Enable the __shopify_id Field

   • In your Constructor dashboard, make sure the __shopify_id field is set to Displayable: true under Searchability and Displayability settings.

   • See Constructor’s documentation for more guidance.

Step 1: Enter Constructor Credentials

No matter which feature you plan to use, you’ll first need to enter your Constructor credentials:

1. In the Reactiv Dashboard, go to Integrations from the left-hand navigation.

2. Enter the values provided by Constructor:

   • Index Key: Found in your Constructor dashboard under index listings (e.g., key_abc123).

   • Security Token: Provided by the Constructor team and unique to your Reactiv integration.

   • Service URL: Provided by the Constructor team.

3. Click Save.

Product Recommendations

Constructor Product Recommendations allow you to add curated carousels into your app.

Step 2: Set Constructor as Provider

1. In the Reactiv Dashboard, click your store logo to open App Settings in the App Studio.

2. Navigate to Integrations.

3. Under Product Recommendations, select Constructor as your provider.

4. Click Save.

Step 3: Add and Configure Carousels

1. In the App Builder, drag a Product Recommendation carousel onto the screen you want (currently supported on Product Detail Page (PDP) and Cart screens).

2. Add a title to the carousel section, and select the maximum amount of products you would like to show.

3. Configure each carousel by entering the correct podId from your Constructor account.

   • Supported pod types:

     • Alternative

     • Abandoned Cart

     • Best Sellers

     • Bundles

     • Complimentary

     • Recently Viewed

     • User Featured

   • Not supported: Query Recommendations or Filtered pods.

4. Click Save before starting your next build.

Your recommendation carousels will now display in your app.

Troubleshooting Product Recommendations

If your product recommendation carousels aren’t appearing or showing the wrong products:

1. Check Constructor Credentials: Make sure the Index Key, Security Token, and Service URL were entered correctly in Integrations.

2. Verify Pod Configuration: Confirm that each carousel is linked to the correct podId and uses a supported pod type.

3. Confirm Carousel Placement: Carousels only work on PDP and Cart screens.

4. Check for Product Data in Constructor: Ensure your pods have products available. For example, “Recently Viewed” won’t display until customers browse items.

5. Save and Rebuild: Make sure changes are saved before starting your next app build.

Next Steps

Once setup is complete, you’re all set to:

• Test your recommendations in the preview app.

• Adjust carousel placement or pod type as needed in the App Builder.

• Work with Constructor’s team if you need new pods or support.