Magento 2 – How to add new category attribute
Hi. In this Magento 2 tutorial, we are going to create a new category attribute and show it on backend category edit pages. We will use text input type, but the similar approach can be used for creating Dropdowns, Radio, etc. We will create a new module (you can add this functionality to existing module as well). Creating a basic module is out of scope of this tutorial.
Next we need to create a setup script for our module. Setup scripts in Magento 2 should be created in Yereone/NewCategoryAttribute/Setup/InstallData.php. The content will be the following
|
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 51 52 53 54 55 56 57 58 |
<?php namespace Yereone\CustomCategoryAttribute\Setup; use Magento\Eav\Setup\EavSetupFactory; use Magento\Framework\Setup\ModuleContextInterface; use Magento\Framework\Setup\ModuleDataSetupInterface; use Magento\Framework\Setup\InstallDataInterface; class InstallData implements InstallDataInterface { /** * @var EavSetupFactory */ private $eavSetupFactory; /** * @param EavSetupFactory $eavSetupFactory */ public function __construct(EavSetupFactory $eavSetupFactory) { $this->eavSetupFactory = $eavSetupFactory; } /** * Installs data for a module * * @param ModuleDataSetupInterface $setup * @param ModuleContextInterface $context * @return void */ public function install(ModuleDataSetupInterface $setup, ModuleContextInterface $context) { $setup->startSetup(); $eavSetup = $this->eavSetupFactory->create(['setup' => $setup]); $eavSetup->addAttribute( \Magento\Catalog\Model\Category::ENTITY, 'custom_category_attr', [ 'type' => 'varchar', 'label' => 'Yereone Custom Category Attribute', 'input' => 'text', 'sort_order' => '', 'source' => '', 'global' => \Magento\Eav\Model\Entity\Attribute\ScopedAttributeInterface::SCOPE_STORE, 'visible' => true, 'required' => false, 'user_defined' => false, 'default' => null, 'group' => '', 'backend' => '' ] ); $setup->endSetup(); } } |
Now we have the new attribute on category entity type. But if we want it to be editable on backend, we need to add it to the backend form.
The category backend form is rendered by category_form.xml UI component. The next step is to create a new xml file in
Yereone/NewCategoryAttribute/view/adminhtml/ui_component/category_form.xml with the following content
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<?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="yereone_settings"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="label" xsi:type="string" translate="true">Yereone</item> <item name="collapsible" xsi:type="boolean">true</item> <item name="sortOrder" xsi:type="number">100</item> </item> </argument> <field name="custom_category_attr"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="dataType" xsi:type="string">text</item> <item name="formElement" xsi:type="string">input</item> <item name="label" xsi:type="string" translate="true">Yereone Custom Category Attribute</item> <item name="sortOrder" xsi:type="number">150</item> <item name="scopeLabel" xsi:type="string">[STORE VIEW]</item> </item> </argument> </field> </fieldset> </form> |
Now you should already see the value in admin form. If you want the input type of the attribute to select box, you should specify it on the xml like this
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<field name="original_category"> <argument name="data" xsi:type="array"> <item name="options" xsi:type="object">Yereone\NewCategoryAttribute\Model\Attribute\Source\Category</item> <item name="config" xsi:type="array"> <item name="label" xsi:type="string" translate="true">Original Category</item> <item name="dataType" xsi:type="string">int</item> <item name="formElement" xsi:type="string">select</item> <item name="sortOrder" xsi:type="number">300</item> <item name="scopeLabel" xsi:type="string">[STORE VIEW]</item> </item> </argument> </field> |
Where “options” is the source model of the select box.
Here is the module with all files in Yereone Github Repository.
https://github.com/yereone/CustomCategoryAttribute
If you want to add new order attribute, check out our other tutorial from Magento 2 series
https://www.yereone.com/magento-2-how-to-add-new-order-attribute/
