By default, Magento 2 provides the feature to show only one description in the above of category page, but many times store owners need to display more information related to the category on the product listing page for a better understanding of categories that’s why In this blog, we are going to explain to you how to add an extra description Below On Product Listing Page In Magento 2. It will be helpful for SEO purposes. If you want to add an additional category description on the category page in Magento 2, follow the below steps.
Contents
hide
Step 1: First we need to create the module.xml file app/code/Webiators/CatAttr/etc/module.xml
1 2 3 4 5 6 7 8 9 | <?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../lib/internal/Magento/Framework/Module/etc/module.xsd"> <module name="Webiators_CatAttr" setup_version="1.0.0"> <sequence> <module name="Magento_Catalog"/> </sequence> </module> </config> |
Step 2: We need to Create the InstallData.php file
app/code/Webiators/CatAttr/Setup/InstallData.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | <?php namespace Webiators\CatAttr\Setup; use Magento\Framework\Setup\InstallDataInterface; use Magento\Framework\Setup\ModuleContextInterface; use Magento\Framework\Setup\ModuleDataSetupInterface; use Magento\Eav\Setup\EavSetup; use Magento\Eav\Setup\EavSetupFactory; use Magento\Eav\Model\Entity\Attribute\ScopedAttributeInterface; class InstallData implements InstallDataInterface { private $eavSetupFactory; /** * Constructor * * @param \Magento\Eav\Setup\EavSetupFactory $eavSetupFactory */ public function __construct(EavSetupFactory $eavSetupFactory) { $this->eavSetupFactory = $eavSetupFactory; } /** * {@inheritdoc} */ public function install( ModuleDataSetupInterface $setup, ModuleContextInterface $context ) { $eavSetup = $this->eavSetupFactory->create(['setup' => $setup]); $eavSetup->addAttribute( \Magento\Catalog\Model\Category::ENTITY, 'bottom_description', [ 'type' => 'text', 'label' => 'Description', 'input' => 'textarea', 'required' => false, 'sort_order' => 4, 'global' => ScopedAttributeInterface::SCOPE_STORE, 'wysiwyg_enabled' => true, 'is_html_allowed_on_front' => true, 'group' => 'General Information', ] ); } } |
Step 3: In this step, we need to create the category_form.xml file to show the attribute in the backend
app/code/Webiators/CatAttr/view/adminhtml/ui_component/category_form.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | <?xml version="1.0" ?> <form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Ui:etc/ui_configuration.xsd"> <fieldset name="content"> <field name="bottom_description" template="ui/form/field" sortOrder="60" formElement="wysiwyg"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="wysiwygConfigData" xsi:type="array"> <item name="height" xsi:type="string">100px</item> <item name="add_variables" xsi:type="boolean">false</item> <item name="add_widgets" xsi:type="boolean">false</item> <item name="add_images" xsi:type="boolean">true</item> <item name="add_directives" xsi:type="boolean">true</item> </item> <item name="source" xsi:type="string">category</item> </item> </argument> <settings> <label translate="true">Bottom Description</label> <dataScope>bottom_description</dataScope> </settings> <formElements> <wysiwyg class="Magento\Catalog\Ui\Component\Category\Form\Element\Wysiwyg"> <settings> <rows>8</rows> <wysiwyg>true</wysiwyg> </settings> </wysiwyg> </formElements> </field> </fieldset> </form> |
Step 4: After that, we need to create bottom_description.phtml file
app/code/Webiators/CatAttr/view/frontend/templates/product/list/bottom_description.phtml
1 2 3 4 5 6 | <?php if ($_bottomDescription = $block->getCurrentCategory()->getBottomDescription()): ?> <div class="category-bottom-description"> <?= /* @escapeNotVerified */ $this->helper('Magento\Catalog\Helper\Output')->categoryAttribute($block->getCurrentCategory(), $_bottomDescription, 'bottom_description') ?> </div> <?php endif; ?> |
Step 5: In the last step, we need to create catalog_category_view.xml at the following path
app/code/Webiators/CatAttr/view/frontend/layout/catalog_category_view.xml
1 2 3 4 5 6 7 8 9 | <?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceContainer name="content"> <block class="Magento\Catalog\Block\Category\View" name="bottom.description" template="Webiators_CatAttr::product/list/bottom_description.phtml" after="-"/> </referenceContainer> </body> </page> |
Run the following commands and check the result:
1 2 3 4 5 6 7 | php bin/magento setup:upgrade php bin/magento setup:di:compile php bin/magento setup:static-content:deploy -f en_US php bin/magento cache:flush php bin/magento cache:clean php bin/magento indexer:reindex |
Thank You!
Hit 5 Stars if you find this post helpful
0 (based on 0 Reviews)
