Branded collection

Brand loyalty is a big thing among consumers, especially in the tools and hardware section where many professionals tend to only shop by brand. The branded collections page will help you create inventory listings for each brand separately to make the shopping experience easier for customers shopping by brand.

Using the template

To use the Branded collection template navigate to Collections under Products in your Shopify Admin, pick a collection and set to it the brand template from the Theme template drop down on the right hand side of the screen below the Collection’s image.

Template contents

The template is similar to the default Collection template, but differs in the appearance of the Collection banner section, as it’s better suited to display brand information.

Collection banner

Section Settings

This section displays a banner above the product list. In order for all the necessary information to show up you will need to set a Title, a Description and a Collection image for your Collection. You can do that from the Collections menu under Products in your Shopify Admin.

Show collection description: Toggles the visibility of the collection description.

Description size: Select one of the three font sizes (Small, Normal, Large) for the collection’s description.

Show collection image: Toggles the visibility of the collection image.

Mask collection image: When this setting is enabled, the collection’s image will have a diagonal mask applied to it.

Collection image height on mobile: Choose the height (Small, Medium, or Large) of the collection image on mobile devices.

Make description fullwidth: When enabled, the collection’s description will span the full width of the banner. By default, the description will be limited to half the available width.

Subcollections – Show number of products in collection title: This area will display the collection’s sub-collections, if any. If this setting is turned on, the product number of each sub-collection will also be visible next to its title. Learn how to set up sub-collections.

Colors

Color scheme: Select one of the predefined color schemes as defined in Theme settings > Colors. For more information regarding the color schemes please refer to our article about creating your own color scheme.

Product grid

Products per page: The number of visible products per page (6-48).

Product card type: There are two card types. With “Normal” you can create a typical grid layout of products, and “Row” which displays each product card in a separate row.

Enable product card type switch: Displays a product card type switcher for your customers.

Number of columns on desktop: Sets the number of columns (3-5). This option only applies on the “Normal” product card type layout.

Enable filtering: Toggles the visibility of filters section on the sidebar.

Show product count: Toggles the visibility of the total number of collection’s products on the top of the product grid.

Enable sorting: Toggles the visibility of the product sorting option on the top right of the product grid.

Hide empty filters: Enable this setting if you’d like to hide the filters that contain no products instead of disabling them.

Show vendor: Whether to show the vendor in each product card above the product title.

Show stock status: Whether to show the stock status of each product.

Show excerpt: Show the products’ custom excerpt on the product cards, if it exists. Learn more about custom product excerpts here.

Show product rating: Whether to show the product’s rating. Please note you will need a rating app for this to work. Learn more about product ratings here.

Side menu

Selecting a menu in the “Menu” setting will display that menu above the product filters on the sidebar. It is helpful when you have a lot of collections and you wish to display a list to filter them easily from the sidebar.

Heading: Set a title for this section (optional).

Menu: Choose the menu to be displayed on the sidebar. You can create and modify menus via the Online Store > Navigation page.

Section spacing

The section spacing settings give you the option to adjust the top & bottom section spacing values.

Collection inline banner block

You can create banners that will appear inbetween rows of products. They can be useful for display helpful tips or links to your customers, or even up-sell higher-end products.

Row position: The banner will appear after the specified row number. First and Last will make the banner always appear before and after the products, respectively. For numbered positions, there must be at least that many rows of products, plus one more, for the banner to appear. For example, in a 3-column layout, a banner with row position of “1” needs 4 products in order to appear. This is to avoid having a numbered banner appear immediately before a Last banner.

Hide banner when the collection is filtered: Toggles the visibility of the banner when there are active filters on the collection.

Background image: Set an image for the particular banner. It will be displayed as the background image for the banner.

Overlay background: Optional gradient background or color to be used as an overlay (over the image and under the content).

Heading: The title of the banner.

Text: The text content the banner.

Link label + Link: With these settings you can create a button that will appear at the middle right area of your banner.

Color scheme: Select one of the predefined color schemes as defined in Theme settings > Colors. For more information regarding the color schemes please refer to our article about creating your own color scheme.