How do I add additional images in the header of the Simply Kerrin template?


In the default installation of the Simply Kerrin template, the logo is displayed on the left hand side.

Zen Cart Template - Simply Kerrin

However, there may be times when you wish to display additional image(s) in the header, for example to include a free shipping icon.  There are two options – add the reference to the image in the tpl_header.php file or add the reference to the image to the stylesheet.css file.

In this example we will include a free shipping image in the header:

  1. Upload the required image to the /images folder located in the /includes/templates/simply_kerrin directory.
  2. Next, open the tpl_header.php file located in the /includes/templates/simply_kerrin/common/ directory.
  3. Find this section of code:
    <div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?></div>
    </div>
  4. and modify to also include the additional image:
    <div id="logo"><?php echo '<a href="' . HTTP_SERVER . DIR_WS_CATALOG . '">' . zen_image($template->get_template_dir(HEADER_LOGO_IMAGE, DIR_WS_TEMPLATE, $current_page_base,'images'). '/' . HEADER_LOGO_IMAGE, HEADER_ALT_TEXT) . '</a>'; ?></div>
    </div><div><img src="includes/templates/simply_kerrin/images/freeshipping.jpg" /></div>
  5. Save the modified tpl_header.php file.

Simply Kerrin - Zen Cart Free Template

More Zen Cart:

  1. Add links to the NavMain Menu in Zen Cart
  2. Free Zen Cart Template – Simply Kerrin – Now Available
  3. Change the Search Header in Zen Cart
  4. Zen Cart Template – Step-by-Step Install Guide
  5. Change the default for Product Notification to Unchecked
  1. No comments yet.
(will not be published)