How do I customize the look and feel of the product recommendation carousels?

How do I customize the look and feel of the product recommendation carousels?

Use the new product card feature by AiTrillion to easily configure the look and feel of the carousels on the front end of your store.

Step 1:- Login to AiTrillion and head over to Product Recommendations > Layout Settings


Step 2:-  Here you can set up the product card settings. These settings govern how the product blocks look in the carousel displays, how the images appear and if the display does or does not adapt to changes in products and their images.

Important points to remember here are:

1. Image Ratio: This feature helps you adjust the image appearance so that the entire carousel blends in with the rest of your site. You can choose from adapt to image, portrait and square image settings.  Remember the Square / Potrait options may crop your image, so try all and choose what works best for you.

In a Square format the carousels look like this : 

The portrait will look more like this:

And last but not least, 'Adapt to Image' will take on the image sizing. So if your images are rectangles, that's how they will appear. For e.g. 

2. Number of Columns on mobile: This feature from AiTrillion, helps you adjust how many columns you want in the carousels when viewed on a smaller screen device like a mobile or a handheld phone.  Images in the carousel will take on the image ratio as illustrated above, based on your selection. 

3. Space Between product blocks: Use these configuration options to set the padding between product blocks and on the top and bottom of the carousel as well. 

So with the settings of :

The carousel looks like this:

But with the settings of:

The carousel look changes to:

Step 3:- Once done, you can also choose to customize the recommendation section width, include or exclude out-of-stock products in the recommendations and you can also choose to hide products with a certain tag, from the recommendations system. 


When you have finished making your choices, click Save / Update. 

    • Related Articles

    • How to customize Layout Setting of Product Recommendations

      This is a step-by-step guide to fine-tune your product recommendations layout and display and make the system blend seamlessly with your Shopify store. Step 1:- Login to AiTrillion and head over to Product Recommendations > Layout Settings . Step 2:- ...
    • Customize Site & Product Review Button On Store

      Introduction You can easily customize the Review Button on your Shopify Store. Sample Button shared below: Steps to customize: Follow the below steps to customize the site review button: Step 1. Login to AiTrillion. Step 2. Go to Product Reviews > ...
    • Create Product Recommendation SmartPopups

      Use AiTrillion to create a smart popup that can recommend new, trending and recently viewed products to customers in the form of AiTrillion Smart Popups. Step 1: Log in to AiTrillion and head over to the product popups section under smart popups. ...
    • Customize Ai Box

      Ai Box is a quick popup on the stores which provides access to all active modules & offers to customers from one place only. Use this guide to learn how to customize the look and feel of the Ai Box, to match your store theme and provide a seamless ...
    • Customize The Existing Newsletter Sign Up Popup

      Use this blog to learn how you can customize an existing AiTrillion Newsletter Popup and change its look, feel, content and behavior. Step 1. Login to AiTrillion Step 2. From the navigation bar go to Smart Popups > Create New > Newsletter Popup Step ...