Magento 2 Subcategory Grid/List Extension

Installation and User Guide for Magento 2 Subcategory Extension

Table of Contents

1. Installation

   • Installation via app/code

   • Installation via Composer

2. Configuration Settings for Subcategory Extension

   • General Settings

   • Subcategories Widget

   • Display Mode Selection Drop-down “Subcategories Only”

   • Sub-categories Settings Dropdown

3. Front-end Screenshots

   • Subcategories Grid View on the Front- end

   • Subcategories List View on the Front- end

Installation

• Installation via app/code: Upload the content of the module to your root folder. This will not overwrite the existing Magento folder or files, only the new contents will be added. After the successful upload of the package, run below commands on Magento 2 root directory.

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy

• Installation via Composer: Please follow the guide provided in the below link to complete the installation via composer.

Installation Via Composer

Configuration Settings for Subcategory Extension

Go to Admin > Stores > Configuration > Scommerce Configuration > SubCategory

General Settings

• Enabled - Select “Yes” or “No” to enable or disable the module.

• License Key - Please add the license for the extension which is provided in the order confirmation email. Please note license keys are site URL specific. If you require license keys for dev/staging sites then please email us at [e-mail].

• Subcategories Background Color – Please select the Subcategories background colour.

• Thumbnail Placeholder – Please choose the file of Thumbnail placeholder

• Thumbnail width – Please add the Thumbnail width.

• Thumbnail height – Please add the Thumbnail height.

Subcategories Widget

Subcategories widget will allow you to display subcategories in a Grid/list view on any page. Navigate to Content > Pages, edit the page that where you want to display the subcategories. Go into Content and then simply click on insert widget and you will have options such as widget type where you have to select the widget named “Subcategories List” then select the category and the number of columns you want to display the subcategories in. Then Lastly click on insert widget.

Display Mode Selection Drop-down “Subcategories Only”

Go to any of the categories page where you want to display subcategories on by navigating to Catalog > Categories. Next go to display settings where you can select the display mode as “subcategories only” so that the page can display subcategories instead of products

Sub-categories Settings Dropdown

Go to any of the categories pages where you can select the settings by going into

Sub-categories settings dropdown. You can change the following settings: -

• Thumbnail Category Image – Here you can upload a thumbnail image for the category.

• Sub-category Short Description – You can add a short description here.

• Number of columns – Select the number of columns you want to display your subcategories in.

Front-end Screenshots

Subcategories Grid View on the Front- end

After successfully enabling subcategories you can see them listed in a Grid view on the frontend. You can select the number of columns depending upon that the frontend will review the Grid view. To select the columns Navigate to Catalog > Categories and then select the category. Scroll down to Sub-Categories Settings. Here you will have the option to upload the thumbnail image, short description and number of columns. Please refer to the image below. Each of the subcategories will be listed with a description, background and image as defined by you.

Subcategories List View on the Front- end

Navigate to Catalog > Categories, select the category, and then scroll down to Sub-Categories settings. You can select the number of columns here. Similarly display the subcategories in a list view by selecting the number of columns as “1”. See the image below for reference.

If you have a question related to this extension please check out our FAQ Section first. If you can't find the answer you are looking for then please contact [e-mail].