A lot of times when working with Magento, you will need to create a page layout or template that is unique to a particular section based on either a specific group of products or attributes or some other business logic.
Although the Magento category manager gives you the ability to add layout updates, it might seem cumbersome to have to apply the same layout update to many categories. It makes it easier for product managers if they don’t have to remember to add this layout update whenever new categories are created.
It’s easy to update unique page layouts by utilizing Magento’s built in ability to insert additional layout handles using an Observer. Then with a bit of CSS/JS/HTML we can create a whole new view.
To accomplish this we will do three things.
1. Create an Observer to update layout handles.
2. Use the new handle(s) to modify page layouts in xml.
3. Create new template views based on our updated handles
First, we need to create the module files that will contain the observer and handle the layout updates. (This article will assume that you can set up your module.)
In your module config.xml, you will need to monitor an event to run our layout updates.
1.<config>
2.<frontend>
3. <events>
4. <controller_action_layout_load_before>
5. <observers>
6. <customhandles>
7. <class>YourModule_CustomHandles_Model_Observer</class>
8. <method>addCustomHandles</method>
9. </customhandles>
10. </observers>
11. </controller_action_layout_load_before>
12. </events>
13. </frontend>
14. </config>
The event “controller_action_layout_load_before” will attempt to run “addCustomHandles” function in the Oberserver every time the controller action is called.
Next, you will need to create your Observer.php file and add some code to update the layout handles
1./*** This observer will add custom layout handles used for Product Pages and Category Pages ***/
2. <br>
3. <br>
4. class YourModule_CustomHandles_Model_Observer
5. {
6. public function addCustomHandles($observer) {
7. $update = Mage::getSingleton('core/layout')->getUpdate();
8. // If Magento finds that the current page is a product page
9. if ($product = Mage::registry('current_product')) {
10. $update->addHandle('catalog_product_new_handle');
11. }
12. // If Magento finds that the current page is a category page
13. elseif ($category = Mage::registry('current_category')){
14. $update->addHandle('catalog_category_new_handle');
15. }
16. else {
17. return;
18. }
19. }
20. }
We can also add in a bit of configuration to make a new layout file in which we can put out custom layout handle updates.
1. <config>
2. <frontend>
3. <layout>
4. <updates>
5. <yourmodule_customhandles module="YourModule_CustomHandles">
6. <file>customhandles.xml</file>
7. </yourmodule_customhandles>
8. </updates>
9. </layout>
10. </frontend>
11. </config>
So with this layout update, you will need to create an xml file called “customhandles.xml” and put it into YourTheme/layout. Then you can use your page handles to update any page with the handles you put into your function like this:
1. <catalog_product_new_handle translate="label">
2. <label>Custom Product View Based on New Handle</label>
3. <reference name="content">
4. <block type="catalog/product_view" name="product.info" template="customhandles/NEWVIEW.phtml">
5. </block></reference>
6. </catalog_product_new_handle>
So, when Magento loads a page that meets the criteria of my function and adds the new page handle, I can control which block uses which template without affecting the core behavior of the system. Cool, huh?
Using this method, a developer can drastically affect the frontend views of Magento without diluting the core code or templates. You could also choose to add in new css or javascript if you wanted to add on additional theming properties.
1. <catalog_product_new_handle translate="label">
2. <label>Custom Product View Based on New Handle</label>
3. <reference name="head">
4. <action method="addItem"><type>skin_js</type><name>js/NEWJS.js</name></action>
5. <action method="addItem"><type>skin_css</type><name>css/NEWCSS.css</name></action>
6. </reference>
7. </catalog_product_new_handle>
As you can probably tell this is a VERY powerful method to theme a Magento store. I hope this will help you in your development.
