Supported Versions
The details shared here apply to the most recent version of Turbo. To keep your theme up to date, check out this helpful document.
In This Article
Using the Featured Collection Section
Your homepage is the perfect place to showcase the products your excited about and promote the items that you want your customers to see. These could be your 'Best Selling' products, 'New Arrivals' or products that you're just obsessed with! Adding the 'Featured Collection' section to your homepage is a great way to organize these items together.
The 'Featured Collection' section allows you to choose between a traditional 'grid-based layout' or a more modern 'slider layout' to display the products. In order to set up a Featured Collection, click into Customize (your Theme Editor) > Sections > Add Section > Featured Collection.
You can choose to have the product title and price visible below the product thumbnail image, or you can choose to have it only display when the customer hovers over the product thumbnail image (Theme Settings > Product Grid > 'Show product information on hover').
Enabling the 'Quick Shop' option will also display a button when a customer hovers over the product thumbnail image; when clicked, this opens a modal window with a partial product description and an Add to Cart button. This is a quick way to let your customers get a bit more detail about a product or even purchase it without having to go through the full product page. Clicking the actual product image, meanwhile, takes the shopper to the full product detail page.
The 'Quick Shop' can be enabled by heading into Customize > Theme Settings > Quick Shop.
Any 'New' or 'Sale' products you have will display their banners as well on the product thumbnail images in the Featured Collection.
Featured Collection Settings
Section Settings
The section settings determine the look and layout of this section!
Heading, Description, Collection
First thing's first! Choose a 'Collection' that you'd like to display as your 'Featured Collection' by clicking the 'Select collection' button. Shopify has full documentation about how to create 'Collections' here.Once you've done that, you can create a 'Heading' and also choose whether or not you'd like to display the Collection's description with the 'Show collection description' setting.
Collection Layout
In the 'Collection Layout' setting, you can either choose to display your 'Featured Collection' as a grid, or slider.
Products per Row
Here you can choose how many products you'd like to show per row. You can choose between 2 - 7.
Limit Products
Here you can limit the number of products you'd like to show. You can choose between 2 - 50.
Demo Shop Examples
Here's how we set up the 'Featured Collection' homepage section in each of our demo shops for Turbo!
-
Portland
Section Settings
Collection layout - Slider
Products per row - 4
Limit Products - 12
Section Settings
Heading - 'Featured Mat Bags'
Collection layout - Grid
Products per row - 3
Limit products - 6
-
Seoul
Section Settings
Heading - 'The Speaker Collection'
Collection layout - Slider
Products per row - 5
Limit products - 8
-
Florence
Section Settings
Collection layout - Grid
Products per row - 4
Limit products - 8
-
Chicago
Section Settings
Heading - 'Curated style & Accessories'
Collection layout - Slider
Products per row - 5
Limit products - 8
-
Dubai
Section Settings
Heading - 'Featured Collection'
Collection layout - Grid
Products per row - 3
Limit products - 6
Mobile Layout
When viewed on a mobile device, if the 'collection layout' is set to 'slider', it will still remain a slider! You can swipe through the images or click the left/right arrows:
If the 'collection slider' is set to 'grid', the 'featured collection' will remain as a grid layout on mobile as well. You can select to either have 1 or 2 products per row by adjusting the 'Products per row on mobile' setting found in Customize > Theme Settings > Product Grid:
