Magento Tutorial practical use of the footer template

If the same information on your Magento website is repeated over and over, like contact information, internal / external SEO links or a copyright block, it might be a good idea to put these in the footer template. Within the magento frontend template this file can be found at:

\app\design\frontend\default\default\template\page\html\footer.phtml

In my case, again on my equestrian project website http://www.paardcare.nl the idea was to edit the footer and add a nice trusted logo, the copyright line and some information regarding the company, FAQ, sitemap, etc, etc. This is how it turned out:

Pretty neat! But what? And how? Let's check it out:

1. A block containing all brands from this website.
2. Remove Newsletter box from Side Box to Footer
3. Add footer links on the right
4. Add footer links on the left
5. Add an image on the right
6. Expand the copyright line

A block containing all brands from this website

A block containing all brands from the website has its use for either usability and SEO, while you don't have maintain the block as every link is generated automatically.

Within the <div class="footer-container"> - the outer DIV container - I have placed another DIV container:

<div class="footer-container">
    <div class="footer-brand">
        <?php echo $this->getChildHtml('footer_brand_callout') ?> <!-- cms > static page-->
    </div>

As you can see in the above code, it just echoes the content from the CMS Static Block "footer_brand_callout" (identifier), made in Magento Admin. This is the code from the CMS Static Block:

{{block type="catalog/product" template="catalog/product/brand.phtml"}}

I have decided to place this code in a Static Block because I now have control in what Shop View this code will be shown.
Ok, all the real coding happens in file (create file if it does not exist):

\app\design\frontend\default\default\template\catalog\product\brand.html

Copy and paste the code:


<?php
    $product = Mage::getModel('catalog/product');
    $attributes = Mage::getResourceModel('eav/entity_attribute_collection')
->setEntityTypeFilter($product->getResource()->getTypeId())
->addFieldToFilter('attribute_code', 'manufacturer');
    $attribute = $attributes->getFirstItem()->setEntity($product->getResource());
    $manufacturers = $attribute->getSource()->getAllOptions(false);

   $array_size = count($manufacturers);
?>

<div>
    <div>
        <h4><span><?php echo $this->__('Our Brands:') ?></span></h4>
    </div>
    <div style="padding-left:8px;">
        <ul id="manufacturer_list">
    <?php for ($i = 0; $i < $array_size; ++$i): ?>
            <li <?php if($i == ($array_size-1)){ print "class=\"last\""; }?>>
                <a href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB)?>catalogsearch/advanced/result/?manufacturer[]=<?php echo $manufacturers[$i]['value']; ?>">
<?php echo $manufacturers[$i]['label'] ?></a>
            </li>
<?php endfor; ?>
    </ul>
</div>
<div>
</div></div>

NOTE: not all of the above code is ours. Please contact me for credits if you care.

Remove Newsletter box from Side Box to Footer

This step is pretty basic. After removing the Newsletter from the Side Box, or disabling the Side Box, just put the following code in a DIV block:

<?php echo $this->getChildHtml('footer.newsletter') ?>

Add footer links on the right 
Get default Magento Footer links:

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

Get contents from a Static CMS Block:

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

The above snippet refers to a Static CMS Block called by its identifier "footer_links". The contents of this block:

<ul>
    <li><a href="{{store direct_url="over-paardcare"}}">Over Paardcare.nl</a></li>
    <li><a href="{{store direct_url="klantenservice"}}">Klantenservice</a></li>
</ul>

As you can see. All ahrefs refer to their CMS Page and are called by default HTML code where "store direct_url" will print the Website Domain with a slash (/).

Add footer links on the left
For diversity sakes, instead of a Static CMS Block I will show you how to code this in the footer.phtml directly:

<div class="footer-voorwaarden">
    <a href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);?>klantenservice/algemene-voorwaarden/">Algemene Voorwaarden</a>&nbsp|&nbsp
    <a href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);?>disclaimer/">Disclaimer</a>&nbsp|&nbsp
    <a href="<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);?>privacy-verklaring/">Privacy Verklaring</a>
</div>

 To get the Website Domain I have used the built in Magento Core snippet.:

Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_WEB);

Add an image on the right

Again, hardcoded only in the footer.phtml:

<div class="standards">
    <img src="<?php echo $this->getSkinUrl('images/exad-trading-geotrust-ssl.png'); ?>" />
</div>

The function $this->getSkinUrl retrieves the first part of the URL (Website Domain & Path to configured skin package): http://DOMAIN/skin/frontend/default/default/ and concatenates the patch given as variable in the function.

Expand the copyright line

The Copyright message was a bit on the light side so we decided to expand the line with additional information. To make the code reusable for other Shop Views, it is necessary to generate the Shop Name instead of putting the Shop Name as a static. This can be done by the following snippet:

<?php echo  Mage::app()->getStore()->getGroup()->getName(); ?>

With this I conclude the tutorial. If you feel this was helpful, click on a banner or +1 to spread the word.