Can logo.gif be changed to logo2.gif when someone hovers over a menu?

[jewelia]

Hi there,

 

I am using the default PrestaShop theme (for now) - but it's important to me that when someone hovers over the navigation menu, logo2.gif is displayed instead of the default logo.gif.

 

Can this be done? If so, is there a not horribly complicated way to do it?

 

Thank you!

Julia

[orwell]

In order to do that, you should dive into the template files and add this functionnality yourself.

 

Are you familiar with CSS and/or JavaScript ?

[jewelia]

Thank you for replying. Do you know which one of the template files I would modify? I'm happy to experiment with it I just want to know where to look.

[orwell]

If you're using Prestashop's default theme, your logo is called in the header.tpl file.

 

<a id="header_logo" href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
 <img class="logo" src="{$img_ps_dir}logo.jpg?{$img_update_time}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
   </a>

 

To change the logo you could use two different techniques:

- change your image tag via javascript when the user hovers the logo

- change the image when users overs the logo via CSS and using a sprite.

 

I suggest you use the second technique, as it is much lighter (no javascript, just one image to load).

[jewelia]

Thank you! Very helpful.