Magento 2 Shop by Brand

Table of Contents

Extension Installation

For Magento Marketplace Customers
- Find the Composer name and version of the extension in the extension’s composer.json file.
- Login to your SSH and run:
  - composer require meetanshi/magento-2-shop-by-brand
- Enter your authentication keys. Your public key is your username; your private key is your password.
- Wait for Composer to finish updating your project dependencies and make sure there aren’t any errors.
- To verify that the extension installed properly, run the command:
  - php bin/magento module:status Meetanshi_ShopbyBrand
- By default, the extension is probably disabled.
- Enable the extension and clear static view files:
  - php bin/magento module:enable Meetanshi_ShopbyBrand --clear-static-content
  - php bin/magento setup:upgrade
  - For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
  - For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
  - php bin/magento cache:flush

For Meetanshi Customers
- Extract the zip folder and upload our extension to the root of your Magento 2 directory via FTP.
- Login to your SSH and run below commands step by step:
  - php bin/magento setup:upgrade
  - For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
  - For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
  - php bin/magento cache:flush

Configuration
To configure the extension, log in to Magento 2 admin panel, move to Catalog > Shop By Brand > Configuration, where you can find various settings to configure the extension.

Shop By Brand: Enable or disable the Shop by Brand extension from here.
Brand Attribute: Select the attribute that you have already created for the brands. You can also create new brand attribute.
Brand Route: Enter the brands page URL slug here. It is set to ‘brand’ by default.
Brand Link Title: Enter the title for the brands page that you want to show to the customers in the frontend. It is set to ‘Brands’ by default.
Show Brand In: Select the sections where you want to show the brand link. You can select from the following options:
- Toplink
- Footer Link
- Category
Show Brands in Category Menu: Select if you want to show the brands in the category menu. You can choose the brand showing style from the following types:
- Drop-down type
- List Type
What to Show: Select brand’s information that you want to show in the category menu. You can choose from the following options:
- Logo
- Label
- Logo and Label
Maximum Brands to Show: Enter the maximum number of brands that you want to show under the brands in the category menu.
Show Brands Without Products on Menu: Select Yes if you want to show the brands with zero products in the category menu.
Show Brands Name on Product Listing Page: Choose whether you want to show the brands name on product listing page or not.
Show Brands Info in Product Page: Select the brand information that you want to show on the product page. You can select the applicable brand information from the following options:
- Not Show
- Brand Name
- Brand Logo
- Brand Description
Brand Logo Width in Product Page: Enter the brand logo width (in pixels) to show on the product page. You can set the logo width from 30px to 100px, it is set to 30px by default.
Brand Logo Heigh in Product Page: Enter the brand logo height (in pixels) to show on the product page. You can set the logo height from 30px to 100px, it is set to 30px by default.

All Brands Page Settings
Customize and configure the “All Brands” Page which shows all the available brands on your store.

Brand List Name: Enter the name that you want to show above the brand list.
Brand List Page Style: Select the brand list page style from the following:
- Alphabet View
- List View
Display Option: Select the Brand information that you want to show on the brand list page. You can choose from the following options:
- Label Only
- Logo Only
- Label and Logo

By default, it is set to Label and Logo.

Brand Logo Width: Enter the width (in pixels) for the brand logos in the brand list. You can set the logo width from 100px to 200px, it is set to 165px by default.
Brand Logo Height: Enter the height (in pixels) for the brand logos in the brand list. You can set the logo height from 100px to 200px, it is set to 165px by default.
Style Color of Brand Page: Choose the color style of the brand list page.
Show Brand Short Description: Select Yes if you want to show the short description of the brand on the brand list page. By default, it is set to ‘No’.
Show Brands Without Products: Select Yes if you want to show the brands without products on the brand list page.
Show Brand Product Quantity: Select Yes if you want to show the product quantity of the brand on the brand list page. By default, it is set to ‘No’.
Show Brand Quick View Popup: Select Yes if you want to enable the quick view popup on the brand list page. By default, it is set to ‘No’.
Custom CSS: Enter custom CSS code that you want to apply on the all brand page.

1. Brand Filter Function
  You can enable the brand filter function and configure the following settings for the brand filter function for the all-brands page:
Show Brand Categories Filter: Select Yes if you want to filter the brands by categories on the all brands page.
Show Brand Alphabet Filter: Select Yes if you want to filter the brands by letters on the all brands page.
Brand Alphabet: Enter the letters to filter the brands by letters. A-Z alphabet series is set by default.

1. Brand Search Settings
  Enable the search block on the all brands page from here. Configure different settings for the search block and its functions on the all brands page from here.

Show Search Block: Select Yes to enable the search block and provide the brand search functionality on the all brands page.
Min Chars: Enter the minimum number of required characters the customers need to enter in the search field to display the results. It is set to 1 by default.
Number of Search Result: Enter the number of search results that you want to show to the customers. It is set to 10 by default.
Show Thumbnail Image: Select Yes if you want to show the brand thumbnail in the search result on the all brands page.

1. Featured Brand Settings
  Show the featured brands on the all brands page and configure various settings, and brands display style as per your convenience.

Show Featured Brands: Select Yes if you want to show the featured brands on the all brands page.
Display Featured Brands Style: Select the display style of the featured brands on the all brands page from there following:
- Slider View
- Simple View

There must be at least two featured brands to show them in the slider view.

Title: Enter a title for the featured brands on the all brands page. It is set to ‘Featured Brands’ by default.
Display Information: Enter the brand information that you want to show for the featured brands. You can choose from the following options:
- Logo Only
- Label and Logo
Embedded Code: You can use the code provided here to embed the featured brands block at any place on your Magento store. Just configure the featured brands, copy the code, and paste it anywhere where you want to show the featured brands.

1. Brand Related Products
  Enable the brand related products to show other products from the same brand on the product page. Configure the brand related products using the following settings:
Show Related Products: Select Yes if you want to show related products of the same brands on the product page.
Title: Enter the title that you want to show to the customers above the related products on the product page.
Limit: Enter the maximum number of related products that you want to show to the customer

Brand Information
Configure general settings for the brand information for the brand pages from here. Configure the following settings for the brand information:

Default Image: Select the default image that you want to show for the brands without image.
Default Block: Select the default block for the brands.
Show Brand Image On Brand Page: Select Yes if you want to show the brand Image on the brand page.
Show Brand Description On Brand Page: Select Yes if you want to show the brand description on the brand page.
Show Brand Static Block On Brand Page: Select Yes if you want to show the static block on the brand page.

Sidebar Settings
Enable the sidebar for the product category pages from here. Customize the sidebar settings and configure it at your convenience. You can show the following sections and configure their settings.

1. Featured Brand Settings
Show Featured Brands: Select Yes to show the features brands in the sidebar.
Title: Enter a custom title to for the featured brands in the sidebar. It is set to ‘Featured Brand’ by default.
Show Title: Select Yes to show the featured brands title on the sidebar.

1. Brand List Thumbnail
Show Brand Thumbnail: Select Yes to show the brand thumbnail in the sidebar.
Title: Enter the title for the brand list in the sidebar. It is set to ‘Featured Brand’ by default.
Brand’s Qty Limit: Enter the maximum number of brands that you want to show in the sidebar.

1. Category Brand
Show Category Brand: Select Yes to show the brand categories in the sidebar.
Title: Enter the title for the brand categories in the sidebar. It is set to ‘Brand Category’ by default.
Category’s Qty Limit: Enter the maximum number of brand categories that you want to display in the sidebar.
Show Brand Category Quantity: Select Yes to show the number of brands in the specific brand category in the sidebar.

SEO Settings
Enable the SEO settings for the shop by brand pages on you Magento store from here.

NoIndex to Pagination Pages: Select Yes to hide the pagination pages from the search engine crawlers by setting them to NoIndex.

Import Brands
Import your brands’ data by uploading the CSV file in the supported format. You can also download the sample CSV file for reference.

Import Brands CSV: Choose the CSV file of the brands data that you want to import.

Manage Brands
Go to Catalog > Shop By Brand > Manage Brands to manage the brands on your store, add new brands, configure their labels for multiple stores, and edit information.
1. Attribute Properties
  Under the Attribute information, click on Properties to configure the attribute properties for the shop by brands attributes. Configure the following settings for the attribute properties.

Default Label: Enter the default label for the Shop by Brands attribute to show in the product edit page.
Catalog Input Type for Store Owner: Choose the catalog input type for the store owner from the following options:
- Dropdown
- Visual Swatch
- Text Swatch
Values Required: Select Yes if you want to set the Shop by Brand attribute value required.

Manage Options (Values of Your Attribute)

Manage brand labels for the Admin users and multiple store views from this section. You can also choose the default brand for the products on your store. Manage the brands on your Magento store from here.

Is Default: Select any one of the brands to set it as the default.
Admin: Enter the brand label for the admin users.
Default Store View: Enter the brand label for the default store view.

In case of multiple store views, multiple columns for different store views are shown for setting different brand attributes values store-wise.

Configure / Add New Brand

You can configure the existing brands or add new brand by clicking on the respective buttons present under the Manage options section. You can add the brand information and meta information from here.

Brand Information

You can configure the following properties about the brand information:

Page Title: Enter the page title for the specific brand to show on the brand page. The option label by the respective store will be used by default.
URL Key: Enter the URL key for the brand page of the respective brand here.
Brand Image: Upload the brand image of the respective brand here.
Featured: Select Yes to set the brand as a featured brand to show it under the featured brands.
Short Description: Enter the short description of the brand.
Description: Enter the brand description.
CMS Block: Select the CMS block for the brand page from here.

Meta Information

Enter the meta information of the brand page from here. Configure the following meta information for the brands:

Meta Title: Enter the meta title of the brand page.
Meta Keywords: Enter the meta keywords of the brand page.
Meta Description: Enter the meta description for the brand page.

Advanced Attribute Properties

Configure advanced attribute properties for the shop by brands from here. Configure the following advanced properties:

Attribute Code: Enter the attribute code without any spaces for internal purposes.
Scope: Set the scope for the attribute from here. You can select the scope from the following options:
- Website
- Store View
- Global
Unique Value: Select Yes if you want to make the attribute value unique.
Input Validation for Store Owner: This option is not applicable for the Shop by Brands extension.
Add to Column Option: Select Yes to add the attribute to column options in the product grid.
Use in Filter Options: Select Yes to use this attribute to filter the products in the product grid.

1. Manage Labels
  Set the attribute labels for multiple store view from here. In case of multiple store view, multiple columns will be shown to set the attribute label for different store views.

1. Storefront Properties
  Manage the storefront properties of the attribute from here. The admin can configure the following storefront properties:

Use in Search: Select Yes to use the attribute in search.
Search Weight: Enter the search weight of the attribute.
Visible in Advanced Search: Select Yes to make the attribute visible in the advanced search.
Comparable in Storefront: Select Yes to make the attribute comparable in the storefront.
Use in Layered Navigation: Select Yes if you want to make the brand attribute filterable with or without results.
Use in Search Results Layered Navigation: Select Yes if you want to use the attribute in the search results layered navigation.
Position: Enter the position of the attribute in the layered navigation block.
Use for Promo Rule Condition: Select Yes if you want to use the attributed for promo rule conditions.
Allow HTML Tags on Storefront: Select Yes if you want to allow the HTMLS tags of the attribute on the storefront.
Visible on Catalog Pages on Storefront: Select Yes if you want to show the attribute on the product catalog pages in the frontend.
Used in Product Listing: Select Yes if you want to use the attribute in the product listing page.
Used for Sorting in Product Listing: Select Yes if you want to use the attributes for sorting the products on the product listing page.

Select Brand on Product Edit Page
Once you have created the brand attributes, and configured them, you can easily assign the brands to the products under the product edit page. Go to Catalog > Products, and click on any of the products to go to product edit page.

Now, you will get Shop by Brands option, where you can select the product brand from the brands that you have configured in the Manage Brands section.

Categories
Go to Catalog > Shop by Brand > Categories to manage the brand categories. Here you’ll find the list of all the brand categories along with other information in a single grid.

1. Add New Category
  Click on Add New Category button on the top right corner to add new brand category.

Category
You can configure the brand category using the following options:

Name: Enter the name of the brand category.
URL Key: Enter the URL key of the brand category.
Store Views: Select the applicable store views for the brand category.
Status: Enable or Disable the brand category from here.
Meta Title: Enter the meta title for the brand category page here.
Meta Keywords: Enter the meta keywords for the brand category page here.
Meta Description: Enter the meta description for the brand category page here.
Meta Robots: Select the Meta robots for the brand category page from here. You can choose from the following options:
- INDEX, FOLLOW
- NOINDEX, NOFOLLOW
- NOINDEX, FOLLOW
- INDEX, NOFOLLOW

Brands
Manage the brands for the category from here. Assign brands to the category and select the applicable store views.

Shop By Brand Widget

The Shop By Brand extension provides different widgets to show the brands on various pages in Magento. Go to Content à Widgets to get the list of the active widgets in your store.

Click on ‘Add Widget’ button on the top right corner of the widget grid and select the following:

Type: Select the Widget that you want to enable on your store. The extension adds three new widgets to the list, you can choose any from the following:

Meetanshi Brand Category ID Widget
Meetanshi Brand Option ID Widget
Meetanshi Featured Brand Widget
Design Theme: Select the Magento design theme that you want to apply.

After selecting the widget and design theme, click on continue to configure the respective widget that you have selected.

Brand Category ID Widget

The Brand Category ID widget allows showing brands by category IDs on specific Magento pages in the frontend. You can configure the widget using the following properties:

Storefront Properties

Type: Select the type of widget here.
Design Package/Theme: Select the applicable Magento theme or package for the widget.
Widget Title: Enter the widget title to show in the backend.
Assign to Store View: Select all the applicable store views where you want to enable the widget.
Sort Order: Enter sort order for the widget in case multiple widgets in same container.

Layout Updates

Display on: Select areas where you want to show the widget.

Page: Select the page for showing the widget.
Container: Select the container on the selected page to show the Shop By Brand widget.

Widget Options

Select the ‘Widget Options’ in the left panel to configure how you want the widget to display brands in the frontend. Here you can configure the following properties:

Title: Enter a custom title for brand category ID widget that you want to show on the frontend.
Show/Hide Widget Title: Select Yes to show the widget title on the frontend.
Input Category ID: Enter the category IDs of the brands (separated by comma) that you want to display under the widget. You can get the category Ids of the brands from the categories grid.

Brand Category ID Widget in Frontend

Once configured, the Brand Category ID widget shows brands of specific categories on the frontend pages.

Brand Option ID Widget

The Brand Option ID widget allows showing brands by option IDs on specific Magento pages in the frontend. You can configure the widget using the following properties:

Storefront Properties

Type: Select the type of widget here.
Design Package/Theme: Select the applicable Magento theme or package for the widget.
Widget Title: Enter the widget title to show in the backend.
Assign to Store View: Select all the applicable store views where you want to enable the widget.
Sort Order: Enter sort order for the widget in case multiple widgets in same container.

Layout Updates

Display On: Select all the pages where you want to show the brands through option IDs.
Products: Select all or specific products to show the brands by option IDs using the widget.
Container: Select the container for showing the widget.

Widget Options

Select the ‘Widget Options’ in the left side panel to configure the widget and the brands that you want to show on the front end. Here you can configure the following properties for the widget:

Title: Enter a custom title for brand option ID widget that you want to show on the frontend.
Show/Hide Widget Title: Select Yes to show the widget title on the frontend.
Input Option ID: Enter the Option IDs of the brands (separated by comma) that you want to display under the widget. You can find option ID of the brands from the Manage Options grid under the Manage Brands.

Brand Option ID Widget in Frontend
Once configured, the Brand Option ID widget shows specific brands by Option IDs on the frontend pages.

Featured Brands Widget
The Featured Brands widget allows showing the featured brands on specific Magento pages in the frontend. You can configure the featured brands widget using the following properties:

Storefront Properties

Type: Select the type of widget here.
Design Package/Theme: Select the applicable Magento theme or package for the widget.
Widget Title: Enter the widget title to show in the backend.
Assign to Store View: Select all the applicable store views where you want to show the featured brands through the widget.
Sort Order: Enter sort order for the widget in case multiple widgets in same container.

Layout Updates

Display on: Select areas where you want to show the widget.
Container: Select the container on the selected page to show the featured brands through the widget.

Widget Options

Select the ‘Widget Options’ in the left panel to configure how you want the widget to display featured brands in the frontend. Here you can configure the following properties:

Title: Enter a custom title for featured brands widget that you want to show on the frontend.
Show/Hide Widget Title: Select Yes to show the widget title on the frontend.

Featured Brand Widget in Frontend
Once configured, the widget shows featured brands on specific page in the frontend.

Shop By Brand in Frontend

The shop by brand is displayed on the frontend as per the configurations set in the backend by the admin users.

Homepage

The homepage shows the shop by brand option in the top menu and the footer.

All Brands Page
The brands page displays the featured brands along with the filter options as per the all brands page configuration in the backend.

Brands Search
The search box is displayed on the brands page and shows the results when the customer enters the minimum characters as configured in the backend. The brand information is displayed in the result as per the configuration in the search settings.

Brand in Popup View
If enabled, the customers can view the brands in a popup view from the all brands page. It displays the brand information along with the related products from the brand.

Brand Page
The brand page in the frontend shows the brand information along with the featured brands and products as per the configuration.

Magento 2 Shop by Brand

Other Articles