User Guide

Search limit to:






Product picker

1. What is Product picker?

The Product picker section allows you to showcase multiple product collections in a single section and let customers search and filter products within each collection.

This section is ideal for stores with large catalogs or multiple product categories, making product discovery faster and more intuitive.

2. Section Components

Section

Show multiple collections and help customers quickly filter products.

Available blocks

 

Add a separate collection with its filtering options.

3. Location & Setup

  1. Go to "Online Store" > "Themes" > "Customize"
  2. Select where you want to place it
  3. Click "Add section"
  4. Search for Product picker.
  5. Click on it to add.

4. Highlight Features

  • Up to 3 filters per collection for faster product discovery.
  • Flexible layout and styling to match your store design.

5. Common Use Cases

🤔 How to set up the Product picker section?

Want to set up the section? Here's how:

STEP 1: Add the section

Add the Product picker section.

STEP 2: Add the blocks and set up the collection

Under Product picker section, add Collection blocks and click on it to open its settings panel:

  • Choose the product Collection you want customers to browse.
  • (Optional) Enter a custom display name for the collection.

STEP 3: Filter settings

You can add multiple filters to help customers narrow down their search. Still at Collection block:

  • Locate to Filter 1 group settings > Filter name field, enter the exact label of a filter created in your Shopify filter app.

  • Customize the Title of the filter name to be more user-friendly.
  • Choose how the dropdown options display.

Repeat these steps with Filter 2 and Filter 3. 

STEP 4: Click "Save".

 

🤔 How to customize the Product picker section’s look?

Want to make the section more visually attractive? Here’s how:

STEP 1:

Click on the Product picker to open its settings panel.

STEP 2: Add section heading, description text, and image

  • Enter the Heading and Text.
  • Upload Image to use as the section background and adjust its Overlay opacity. 

STEP 3: Customize the navigation panel display 

At the Navigation panel settings group: 

  • Choose the layout of the navigation panel (on large screens):
 Horizontal Vertical
  • Enter the text for Collection select placeholder.
  • For price filtering, choose how customers set the price: 
 Range slider Input Rabge slider and input

STEP 4: Click "Save" when done.

 

🤔 What customization options can you give your Product picker?

For the whole Product picker section:

✨ Change color scheme

Click on the Product picker section, and choose the overall scheme you want to use in both light and dark mode in the Color scheme.

✨ Change the heading size

Click on the Product picker section, and choose the Heading size to be Small, Medium, or Large.

✨ Change the Heading tag (for SEO purposes)

Click on the Product picker section, find and choose the Heading tag from the list.

✨ Change the text alignment

Click on the Product picker section, and choose the Text alignment to be Left, Right, or Center.

✨ Change the section width, add padding, or add a divider

Click on the Product picker section, scroll down to the Section layout group, and you will be able to change those settings.

Need help? Contact our support team at Omni Themes Support.