In this tutorial I will explain how to add a custom text attribute to the category page.
Let us now see together how to proceed!
Ah! If you don't have time to follow the whole guide you can download the source files, you just need to share the tutorial via the social buttons below!
[sociallocker]
Download the Free Pack!
[/sociallocker]
How to create the form to add a category attribute
To add a custom attribute we must first create a form. We will call our form Magentiamo AttributeCategory.
Step 1. Form creation
First, we create the xml file that will allow Magento to recognize the new Module.
We then create the file Magentiamo_AttributeCategory.xml in the app/etc/modules/ caret and place the following code inside:
[xml]
<?xml version="1.0"?>
<config>
<modules>
<Magentiamo_AttributoCategoria>
<active>true</active>
<codePool>community</codePool>
</Magentiamo_AttributoCategoria>
</modules>
</config>
[/xml]
Step 2. Configuring the script
We create the module configuration file in app/code/local/Magentiamo/AttributeCategory/etc/
I remind you that the module pathway is composed as follows:
app/code/<code pool>/<name space>/<module name>/etc
<code pool> può essere
- core (contains Magento core files that should never be touched except to document)
- local (contains module developed by third party)
- community (contains modules developed by the community)
<name space> è il nome del fornitore del modulo
<module name> è il nome del fornitore del modulo
In our case we will put the module in local, so the path to our module will be: app/code/community/Magentiamo/AttributeCategory/
So, we were saying... let's create the module config .xml file in app/code/community/Magent/AttributeCategory/etc/config.xml and put the following code inside:
[xml]
<?xml version="1.0"?>
<config>
<!– Qui definiamo il la versione del modulo –>
<modules>
<Magentiamo_AttributoCategoria>
<version>0.0.1</version>
</Magentiamo_AttributoCategoria>
</modules>
<global>
<!– Qui definiamo le risorse per l’installazione dello script che aggiungerà gli attributi –>
<resources>
<aggiungi_attributo>
<setup>
<module>Magentiamo_AttributoCategoria</module>
<class>Mage_Catalog_Model_Resource_Setup</class>
</setup>
<connection>
<use>core_setup</use>
</connection>
</aggiungi_attributo>
<aggiungi_attributo_write>
<connection>
<use>core_write</use>
</connection>
</aggiungi_attributo_write>
<aggiungi_attributo_read>
<connection>
<use>core_read</use>
</connection>
</aggiungi_attributo_read>
</resources>
</global>
</config>
[/xml]
[Tweet "How to add attributes to categories in Magento - Guide + Codes + free module #magento"]
As you can see, the configuration file is not large, there are only two nodes: module version and script installation resources that will create a new attribute.
In the node we defined the class for our installation script that will be used for the extension.
Working with the methods of this class will help us help create, update and remove the attribute.
This node tells Magento that the mysql script must be in the folder with the same name (in our path it will be app/code/community/Magentiamo/AttributeCategory/sql/add_attribute/).
Step 3. Create the attribute installation script.
To create the attribute, we need to create the installation file in the newly created 'add_category_attribute' folder. The name of the file will be mysql4-install-X.X.X.php where X.X.X is the version of the module defined in the config.xml file
[xml]
…
<Magentiamo_AttributoCategoria>
<version>0.0.1</version>
</Magentiamo_AttributoCategoria>
…
[/xml]
So the file name will be mysql-install-0.0.1.php in app/code/community/Magentiamo/AttributeCategory/sql/add_attribute/
Within this file we will insert the code to create the attribute that will be saved in the database and displayed on the category page in the backend. In this specific case, we will make a custom Tab where we are going to insert the attribute to keep it separate from the rest of the default tabs
[php]
<?php
$this->startSetup();
$this->addAttribute(
Mage_Catalog_Model_Category::ENTITY, ‘attributo_personalizzato’,
array(
// Qui definiamo il tab personalizzato
‘group’ => ‘Tab Personalizzata’,
‘input’ => ‘textarea’,
‘type’ => ‘text’,
‘label’ => ‘Attributo Personalizzato’,
‘backend’ => ”,
‘visible’ => true,
‘required’ => false,
‘visible_on_front’ => false,
‘global’ => Mage_Catalog_Model_Resource_Eav_Attribute::SCOPE_GLOBAL
)
);
$this->endSetup();
[/php]
Step 4. We refresh the cache and check the result
Now that we have created the form to install a new attribute on the category page, we need to Empty the Magento cache.
Then go to Category Management and and everything went right, we will find the Custom Attribute in the new tab "Custom Tab" as you can see from the screenshot below:
Step 5. Display the attribute in the front-end
Ora che abbiamo fatto i passaggi principali, non ci resta altro che mostrare l’attributo nel frontend. Apriamo quindi il file app/design/frontend/<package> /<theme>/template/catalog/category/view.phtml e inseriamo il codice che segue, il quale genererà l’attributo.
[php]
…
<?php if($_customAttribute = $this->getCurrentCategory()->getAttributoPersonalizzato()): ?>
<?php echo $_helper->categoryAttribute($_category, $_customAttribute, ‘attributo_personalizzato’) ?>
<?php endif; ?>
…
[/php]
Once again, if all goes well, we update the category page in the frontend et voila! The attribute appears!
Obviously you have to enter a value in the admin within a specific category for it to be displayed.
Step 6. How to update the attribute and the form
Let's say now that we want to change the attribute type from text to textarea and also insert the WYSIWYG editor into it. To do this we need to create a file like the install file created in step 3, but one that updates the previous attribute.
This is possible because of the ability to be able to upgrade the version of the module and the sripts in it. the file we need to create will be called mysql4-upgrade-0.0.1-0.0.2.php, where 0.0.1 is the previous version of the module, and 0.0.2 is the version we will upgrade.
We then create the file mysql4-upgrade-0.0.1-0.0.2.php in app/code/community/Magentiamo/AttributeCategory/sql/add_attribute/ with the following code:
[php]
<?php
$this->startSetup();
$this->addAttribute(
Mage_Catalog_Model_Category::ENTITY, ‘attributo_personalizzato’,
array(
‘group’ => ‘Tab Personalizzata’,
‘input’ => ‘textarea’,
‘type’ => ‘text’,
‘label’ => ‘Attributo Personalizzato’,
‘backend’ => ”,
‘visible’ => true,
‘required’ => false,
‘wysiwyg_enabled’ => true,
‘visible_on_front’ => true,
‘is_html_allowed_on_front’ => true,
‘global’ => Mage_Catalog_Model_Resource_Eav_Attribute::SCOPE_GLOBAL,
));
$this->endSetup();
[/php]
As you can see we have changed
[php].
...
// DA
'type' => 'text',
// A
‘type’ => ‘textarea’,
…
[/php]
And we added
[php].
...
'wysiwyg_enabled' => true,
...
[/php]
which will show the visual editor in the textarea.
Now, we change the version of the module in the file config.xml so that Magento knows that it has been updated and needs to run the update script.
[xml][/xml]
… <modules> <modules> <Magentiamo_AttributoCategoria> <version>0.0.2</version> </Magentiamo_AttributoCategoria> </modules> …
[xml][/xml]
We then refresh the cache and return to Category Management.
Now if we click on Custom Tab, we will see the attribute transformation with the addition of the WYSIWYG editor: as you can see from the following image:
We then try to insert an image:
And opening the page in the frontend we will see the inserted image:
Download the form
To make it easier for you, I have also created the ready-to-download form, just ask you to share the article and the download will be enabled.
[sociallocker]
Download the Free Pack!
[/sociallocker]
Conclusions
It is not super easy to extend the potential of Magento categories, but in this way we can customize according to the needs of customers the categori e page by inserting new custom attributes.
Thank you for reading this tutorial, I hope it can be helpful to you!