atwix

How to change the header of Magento CMS page

This article explains how to customize a header of any Magento CMS or Module page.

In this example we consider CMS-page “About Us”.

1. Enter to the admin and open the editor of the CMS pages:

2. Open for editing the page “About Us”:

3. Go to the tab “Design”:

4. Add the following text in the section “Layout Update XML”:

 
<font color="#000000"><b>&lt;!-- BOF added by Atwix --&gt;
&lt;reference name=&quot;header&quot;&gt;
     &lt;block type=&quot;page/header&quot; name=&quot;header&quot;&gt;
         &lt;action method=&quot;setTemplate&quot;&gt;&lt;template&gt;cms/headers/about_us.phtml&lt;/template&gt;&lt;/action&gt;
     &lt;/block&gt;
&lt;/reference&gt;
&lt;!-- EOF added by Atwix --&gt;</b></font>
&nbsp;

5. Save сhanges:

6. It should be noted that the file with new header is on the following address app/design/frontend/base/default/template/cms/headers/about_us.phtml and has the next contents:

&nbsp;
<font color="#000000"><b>&lt;h1&gt;my header&lt;/h1&gt;</b></font>
&nbsp;

* Instead of the standard theme app/design/frontend/base/default/template/cms/headers/about_us.phtml, which was used in the example you can use the theme of your store.

7. After all the new page “About Us” will be look like this:

 

1. Prepare the file (for example, header.phtml) with a new header. Content of the new header.phtml will be like this:

&nbsp;
<font color="#000000"><b>&lt;h1&gt;my header&lt;/h1&gt;</b></font>
&nbsp;

2. Copy the specified file in the folder where the files of the page Shopping Cart are, specifically in: app/design/frontend/base/default/template/checkout/cart/header/header.phtml

* Instead of the standard theme app/design/frontend/base/default/template/checkout/cart/header/header.phtml, which was used in the example you can use the theme of your store

3. Create the file local.xml in the folder app/design/frontend/base/default/layout/ (or if this file has been already existed just open it for editing). In the file local.xml add the following code:

<b>&lt;?xml version=&quot;1.0&quot;?&gt;
   &lt;layout version=&quot;0.1.0&quot;&gt;
</b>
<b>      &lt;!-- BOF added by Atwix --&gt;
      &lt;checkout_cart_index&gt;
         &lt;reference name=&quot;header&quot;&gt;
            &lt;block type=&quot;page/header&quot; name=&quot;header&quot;&gt;
                &lt;action method=&quot;setTemplate&quot;&gt;&lt;template&gt;</b>checkout/cart/header/header.phtml<b>&lt;/template&gt;&lt;/action&gt;
            &lt;/block&gt;
         &lt;/reference&gt;
      &lt;/checkout_cart_index&gt;
      &lt;!-- EOF added by Atwix --&gt;</b>
<b>&lt;/layout&gt;<br></b>

* In this example was used layout of the standard theme app/design/frontend/base/default/layout/local.xml. In your store use layout of the your store`s theme.

4. Save all your changes and update the Shopping Cart page.

As a result, we will see:



Enjoyed this post? us on Facebook and on Twitter to stay tuned.

  • http://twitter.com/pharmokan Pharmokan

    thanks for this one