I need to display a category description ABOVE + BELOW the product listing.
The description above is supposed to be a short, but the description below is a long description for SEO purposes. I don't want to display a long description on top, as it'll push products too far down.
Is there any known way to achieve this in Magento 2?
Example: https://marketplace.magento.com/magetoday-module-secondcatdescription.html Unfortunately, this module appears broken and doesn't work the way it should.
I've been working with WooCommerce (WordPress) for many years and easily achieved this through explode() on those websites. I split the category description into two pieces, whereof the first was displayed above and the second below the product listing. This was very efficient, because I wouldn't have to struggle with new input fields, database changes and so on. I have no idea how to do this in Magento though.
Firstly, you need to create a category attribute then you can pull the contents in the product listing page.
Create a basic module and add the following files in your module.
1. Create a category attribute.
Create the bottom_description attribute in the database.
app/code/MilanDev/BottomDescription/Setup/InstallData.php
<?php
namespace MilanDev\BottomDescription\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',
]
);
}
}
Show the attribute in the backend (under Description field for any category).
app/code/MilanDev/BottomDescription/view/adminhtml/ui_component/category_form.xml
<?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>
2. Pull contents in the product listing page.
Get the contents in template file.
app/code/MilanDev/BottomDescription/view/frontend/templates/product/list/bottom_description.phtml
<?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; ?>
Show the contents to bottom in the product listing page.
app/code/MilanDev/BottomDescription/view/frontend/layout/catalog_category_view.xml
<?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="MilanDev_BottomDescription::product/list/bottom_description.phtml" after="-"/>
</referenceContainer>
</body>
</page>
This should work or you can check the details here.