During Magento customization, many of our clients request to extend the default functionality of Magento 2 categories. Recently one of them asked to add custom image attribute in category of Magento 2. To fulfill the requirement, I develop below code which I would like to share with you.
You need to add custom image attribute in the following files:
app/code/Vendor/Categoryattribute/Setup/ UpgradeData.php
First of all we need to add the attribute with proper parameters. Use code below:
|
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 |
<!--?php namespace Vendor\Categoryattribute\Setup; use Magento\Framework\Setup\UpgradeDataInterface; use Magento\Eav\Setup\EavSetupFactory; use Magento\Framework\Setup\ModuleDataSetupInterface; use Magento\Framework\Setup\ModuleContextInterface; class UpgradeData implements UpgradeDataInterface { public function __construct(\Magento\Eav\Setup\EavSetupFactory $eavSetupFactory) { $this->eavSetupFactory = $eavSetupFactory; } public function upgrade(ModuleDataSetupInterface $setup, ModuleContextInterface $context) { $setup->startSetup(); $eavSetup = $this->eavSetupFactory->create(['setup' => $setup]); $eavSetup->addAttribute( \Magento\Catalog\Model\Category::ENTITY, 'image_thumb', [ 'type' => 'varchar', 'label' => 'Image - Thumb', 'input' => 'image', 'required' => false, 'sort_order' => 6, 'backend' => 'Vendor\Categoryattribute\Model\Category\Attribute\Backend\Thumb', 'global' => \Magento\Eav\Model\Entity\Attribute\ScopedAttributeInterface::SCOPE_STORE, 'group' => 'General Information', ] ); $setup->endSetup(); } } ?--> |
If you have properly followed the code, image attribute would have been added to category in Magento 2 category.
Now once we have created the attribute, we need to save it in backend. Use following code:
|
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 |
<!--?php namespace Vendor\Categoryattribute\Model\Category\Attribute\Backend; class Thumb extends \Magento\Eav\Model\Entity\Attribute\Backend\AbstractBackend { protected $_uploaderFactory; protected $_filesystem; protected $_fileUploaderFactory; protected $_logger; private $imageUploader; public function __construct( \Psr\Log\LoggerInterface $logger, \Magento\Framework\Filesystem $filesystem, \Magento\MediaStorage\Model\File\UploaderFactory $fileUploaderFactory ) { $this->_filesystem = $filesystem; $this->_fileUploaderFactory = $fileUploaderFactory; $this->_logger = $logger; } private function getImageUploader() { if ($this->imageUploader === NULL) { $this->imageUploader = \Magento\Framework\App\ObjectManager::getInstance()->get( 'Vendor\Categoryattribute\CategoryThumbUpload' ); } return $this->imageUploader; } public function beforeSave($object) { $attrCode = $this->getAttribute()->getAttributeCode(); if (!$object->hasData($attrCode)) { $object->setData($attrCode, NULL); } else { $values = $object->getData($attrCode); if (is_array($values)) { if (!empty($values['delete'])) { $object->setData($attrCode, NULL); } else { if (isset($values[0]['name']) && isset($values[0]['tmp_name'])) { $object->setData($attrCode, $values[0]['name']); } else { // don't update } } } } return $this; } public function afterSave($object) { $image = $object->getData($this->getAttribute()->getName(), NULL); if ($image !== NULL) { try { $this->getImageUploader()->moveFileFromTmp($image); } catch (\Exception $e) { $this->_logger->critical($e); } } return $this; } } ?--> |
Hope you followed the code properly and could create custom image attribute. If you are stuck between somewhere, I’m always there to provide you with solution. Comment your queries and suggestions.
Enjoy Coding!
Hello
Where we can add “Vendor\Categoryattribute\CategoryThumbUpload” and can you please give me the example that file
Replace that thing with your actual third-party extension path.
I can not find where the field is added, what “general” section do you mean? I can not see a section with that name
Thanks
It’s the first tab in the category.
I disappointed. Why did you post code that doesn’t work?
I see new attribute in eav_attribute table but I doesn’t see in admin panel.
Can you send us the code which you have tried, in case you have modified above code.
Send code on our email support@magecomp.com
Hi,
There is no General information tab is available in Magento 2 Categories section?
So where added category attribute shown by using above code?
General Section means default first section when you open a category in admin.
hello attribute not showing in admin section
Can you please share the code which you have tried.
Field not showing on backed. Where it will appear ?
The attribute should be available in “General” section, if you followed all the steps and executed it successfully.
Hello,
Can you please tell me where we can add below code. Please give me file location.
<?php
namespace Vendor\Categoryattribute\Model\Category\Attribute\Backend;
………….
You need to create file at following location
app/code/Vendor\Categoryattribute\Model\Category\Attribute\Backend\Thumb.php and put the given code there.
Hi!
Thanks for a great article!
Is it possible to modify the code a bit in order to add custom file upload attribute to Products in Magento2? I want to be able to upload product sheets to products in Magento2.
Thanks in advance!
This tutorial is about adding custom image attribute in categories and not in products. To get the solution for adding image attribute in products, Contact us and we will be happy to help you further.