Upsell and Cross-sell with the Related Products element

 

This article will help you understand what related products are and how to use the Related Products element in GemPages.

 

 

What is the Related Products element?


Related products are recommendations to the main product that a shopper is currently viewing. They can be products that are similar, go well, or add value to the main product. When done right, related products can be very valuable in increasing your order value and conversion rate.


In GemPages, the function is represented by the Related Products element, and we’ll go over all the settings to make the most use out of it in the sections below.

 

Add the Related Products element to your page


Step 1: In the GemPages Dashboard, select your page and enter the Editor via the “Edit” button.


Step 2: Search for the Related Products element, then drag & drop one onto your page.

Once finished, all configurations of the element are displayed on the left sidebar.

 

 

Configure the Settings tab

 

The Related Products element works by fetching data from the Shopify Admin. Products displayed in this element are from the same collection as the main product.

 

The Settings tab is where you will find all the necessary parameters to set up the Related Products element.

 

Select Product


By default, the Related Products element will display products from the same collection as the main product display on the page's Product module. If there isn't a Product module, it will display your most recently added product in the Shopify inventory.


Under this section, click the “Pick a Product” button to pick the Main product from your Shopify inventory. After that, its related products will be selected for display.


 

Dynamic switch


On a page with both the Product module and the Related Product elements, please make sure to turn on the Dynamic feature for both. This ensures that the correct related products will appear for any chosen product.


When toggled on, the Related Products element will turn purple, indicating the function has been enabled.



Products per Row


Set the number of products displayed per row from 1 to 6 in the drop-down menu.


 

Number of Products


Set the total number of related products you want to display using the slider or the input box. The maximum is 20.

 


 

Exclusions


To exclude products from a specific collection, input the collection’s URL handle here. If you have more than one collection to exclude, separate their handles using a comma.


E.g.: best-sellings, new-arrivals, high-end

 

 

Here are the steps to get your collection handles:

 

Step 1: Head to Shopify Admin > Products > Collections and select one of your collections.

 

Step 2: Scroll all the way down and click "Edit website SEO"

 

 

Step 3: Copy the handle in the URL and handle field

 

 

Extra Class


If you would like to further customize the element with coding, use this field to add a class name and then refer to it later on in the CSS file.


 

Configure the Design tab


Before you hit “Save” and “Publish” on your page, don’t forget to fine-tune the design of your Related Products element using the Design tab!


 


Feel free to explore our articles for more guides and tutorials on how to use GemPages like a pro. Should you need any further assistance, please contact our GemPages Support Team any time via email or live chat.

 


Was this helpful?