Out of the box Magento comes with support for multiple currencies to be allowed, even within the same store. If you need this there is a helpful little module that provides a dropdown for your sites sidebar to switch between them and although this is very functional it looks nicer, and I suspect users prefer it, to have currencies selected using icons – and to find them in the header somewhere. This is just a quick explanation of where to find the right files, and what changes you need to make to make that happen.

The first thing to do is to enable multiple currencies in your store. This is simply done through the Magento admin panel, under system configuration. You then will want to go to the System Currency Rates menu and set a rate for your allowed currencies. Take a look at these screenshots…

Once you have completed those two stages (you may need to clear your cache) you should see a dropdown box that allows you to select your currency. This dropdown appears in the left menu of the category page, as well as several other pages, but not on the homepage by default. Next we look at changing this dropdown to a set of flag icons.

The currency dropdown is created by the directory module (anyone know why this isn’t the currency module, or similar?) and the template can be found in app/design/frontend/base/default/template/directory/currency.phtml and of course I would recommend copying that into your own theme before making any changes. The important bit of this module is a loop through the currencies creating option elements, within a select. The following code can be used to output a set of img tags instead – you simply need to find some nice flag icons and place them in your images folder with the filename that matches the currency code.

<?php if($this->getCurrencyCount()>1): ?>
    <div class="currency" style="text-align: right; position: relative; top: 26px; right: 18px;">
    <?php foreach ($this->getCurrencies() as $_code => $_name): ?>
         
        <a href="<?php echo $this->getSwitchCurrencyUrl($_code) ?>" onclick="setLocation(this.value);">
        <img src="/images/<?php echo $_code ?>.png" title="<?php echo $_name ?> - <?php echo $_code ?>"/>
        </a>
    <?php endforeach; ?>
    </div>
<?php endif; ?>

This will give you the icons in the sidebar, but the final stage would be to move them to the header or at least understand why they aren’t displayed on the homepage. For this you need to take a look at the directory layout file app/design/frontend/base/default/layout/directory.xml. You will see repeated for almost every page handle a reference to the “right” block and the inclusion of the currency template. If you simply want the template to appear on every page then you can remove all of these references and add it to the default page handle. Yo move to the header I would remove the references and place the block XML to the page layout file – inside the header block. Below is an extract from my page.xml file showing just the reference to the header inside the default handle.

<block type="page/html_header" name="header" as="header">
   <block type="directory/currency" name="currency" before="catalog.leftnav" template="directory/currency_header.phtml"/>
   <block type="core/template" name="menubar" as="menubar" template="page/html/menubar.phtml"/>
   <block type="page/template_links" name="top.links" as="topLinks"/>
   <block type="page/switch" name="store_language" as="store_language" template="page/switch/languages.phtml"/>
   <block type="page/html_wrapper" name="top.container" as="topContainer" translate="label">
      <label>Page Header</label>
      <action method="setElementClass"><value>top-container</value></action>
   </block>
   <block type="page/html_breadcrumbs" name="breadcrumbs" as="breadcrumbs"/>
</block>

So, as you can see, the currency block is now contained within the header block. To get the currency template actually inserted into the page you need to reference it in the header template, so lets take a quick look at that code.

<div class="header-container">

   <div class="header">

      <?php if ($this->getIsHomePage()):?>
         <h1 class="logo"><strong><?php echo $this->getLogoAlt() ?></strong><a href="<?php echo $this->getUrl('') ?>" title="<?php echo $this->getLogoAlt() ?>" class="logo"><img src="<?php echo $this->getLogoSrc() ?>" alt="<?php echo $this->getLogoAlt() ?>" /></a></h1>
      <?php else:?>
         <a href="<?php echo $this->getUrl('') ?>" title="<?php echo $this->getLogoAlt() ?>" class="logo"><strong><?php echo $this->getLogoAlt() ?></strong><img src="<?php echo $this->getLogoSrc() ?>" alt="<?php echo $this->getLogoAlt() ?>" /></a>
      <?php endif?>

      <img class="tagline" src="/shop/skin/frontend/swn/smokeshop/images/tagline.png" alt="Every pipe smoker's local tobacconist" />
      <div class="contactline">24 hour orderline +44 (0)1481 111111</div>

      <?php echo $this->getChildHtml('currency') ?>
      <?php echo $this->getChildHtml('store_language') ?>
      <?php echo $this->getChildHtml('topContainer'); ?>
   </div>
</div>

<div class="menubar">
   <?php echo $this->getChildHtml('menubar') ?>
   <?php echo $this->getChildHtml('topSearch') ?>
</div>


<div class="quick-access">
   <?php echo $this->getChildHtml('breadcrumbs'); ?>
   <?php echo $this->getChildHtml('topLinks') ?>
</div>

</div>

The important line being the reference to getChildHtml(‘currency’). And that about wraps it up – good luck!