This is a really quick and simple tutorial to explain how to add a CMS Block to your Magento sites footer. It is a simple case of creating the block and a few lines of content added to your layout xml file, all of which I will explain below.

First thing is to create a new CMS Block from Magento’s CMS menu and to add some content, taking note of the identifier that you have entered. Now we just need to pull that content into the footer, and for those unfamiliar with Magento’s over complicated template/layout model then this is where the trouble starts. Once you understand this it really becomes simple and actually makes a lot of sense – especially to people developing plugins/modules – but to learn initially it is a little tricky. There is light at the end of the tunnel though, I promise!

Most of the footer is put together in just two files, these are the footer template and the page layout file. The layout files are made up of XML and contain definitions of where specific bits of content should go inside the page template – or bits of the templates, for example the footer. So first place to look is the page layout file which should be found in the folder app/design/frontend/YOURTEMPLATE/layout/page.xml. If there isn’t a page file here then it means your theme isn’t changing the pages structure significantly from the default and you will find the default file in app/design/frontend/base/default/layout/page.xml.

Within the page file, you should find an element called “default”; in magento terms this is a Hook. A hook defines a page, or group of pages, that share a similar structure – such as header and importantly for us the footer. Within the default element, you will find another element called block, with the attribute of name set to root. The root block is the core structure and the template attribute here defines the page template (some HTML at last!) that is used to display the page – in the case of the default hook this is used for everything that doesn’t have a specific overriding hook. Within the root block you should see blocks for several other important areas such as the head, header and the footer. The footer block will have a template attribute defining the template file that is used for rendering the template.

Load the footer template file in the text editor of your choice and you should see some basic HTML structure and some PHP. Take note of the calls to getChildHtml. Now, returning to the page.xml file you should see that the footer block actually has several blocks within it and these are the ones references in the getChildHtml calls in the template. So, what we need to do to add a CMS Block to the footer is add a block to the footer block in the page.xml file and then reference it in the footer template.

The XML to add a CMS Block is as follows…

<block type="cms/block" name="name_referenced_in_template" before="insert_before_this_block">
    <action method="setBlockId"><block_id>identifier_in_cms</block_id></action>
</block>

You then just need the reference to this new block in the template file…

<?php echo $this->getChildHtml('name_referenced_in_template') ?>

Fairly simple, and at this point you might be wondering why Magento has such a complex way of doing this. This is because the whole thing is really geared-up for plugin development. Imagine a completely functioning site and somebody wants to add some functionality that will need a few subtle changes to lots of places throughout the site – an example of this might be a wishlist (and this is indeed how the Magento wishlist works). So your site (pre-wishlist) needs some code for creating, maintaining and linking to the list and that is going to onvolve adding links to the footer, the user account management, the quick links toolbar at the top and all of the product pages. But how can that be done without making lots of changes everywhere in the site? Here, the Magento module/layout/template arrangement starts to make sense. You build a plugin, with it’s own back-end code, it’s own pages and templates and that provides all of the functionality for your wishlist – all self contained. But now you need to add all of those links that hook in to the wishlist functionality. Imagine adding a link to view your wishlist to the footer, you could edit the page.xml and insert a block (probably a block from the new wishlist plugin) and that would work. But we can do better than that, we can reference the block that is declared in page.xml from wishlist.xml and thus installing (or uninstalling) our wishlist plugin doesn’t impact the rest of our codebase!

In our original footer example, I hope you can now see that we shouldn’t be editing the page.xml footer block directly. Better is to put the xml that adds the block into the layout file for whichever module is responsible for dealing with the data. In this case that is the CMS module – and therefore the cms.xml layout file.

To reference a block that is declared elsewhere you just use a reference element and the name of the block as declared elsewhere.

<default>
        <reference name="footer">
            <block type="cms/block" name="name_referenced_in_template" before="insert_before_this_block">
                <action method="setBlockId"><block_id>identifier_in_cms</block_id></action>
            </block>
        </reference>
    </default>

This allows modules to “inject” functionality into bits of the site that they need to modify without you having to make direct changes to those areas. This can also be set in various places in the Magento admin for example of specific CMS Pages and on Products. This way you could add an additional CMS Block to the footer for just a single product. Flexible, extensible… but complicated!