How to Images for buttons

[neeno]

Hello everyone.

 

I'm using prestashop 1.4.5.1 with "new prestashoo theme" and i'm encountering the following problem. I would like to keep all the buttons as they are, except on the product page i wish to use images instead of text generic buttons for "add to cart" and "add to wishlist" buttons. These would be simple image of a cart and simple logo image representing wishlist.

Any good ideas on how to do this ? I imagine i would have to define new button style in global.css and then change template file ?

[CartExpert.net]

Hello!

 

Yes, you need to change the template files and add new style definitions to global.css

[neeno]

Any aditional hint on the template files part ?

[Evona]

Download Firebug, add to Mozilla and you will see in witch line you must change

[CartExpert.net]

Firebug will not show you which template file you need to edit.

 

If you want to change only the product page, you need to edit 'product.tpl'.

[neeno]

Thank you both for effort. I came that far even before i posted the question.

Sofar i think solution lies somewhere in this part of code:

 

<p{if (!$allow_oosp && $product->quantity <= 0) OR !$product->available_for_order OR (isset($restricted_country_mode) AND $restricted_country_mode) OR $PS_CATALOG_MODE} style="display: none;"{/if} id="add_to_cart" class="buttons_bottom_block"><span></span><input type="submit" name="Submit" value="{l s='Add to cart'}" class="exclusive" /></p>

 

Now if i could somehow remove the text and plant in the image.... This is where i get stuck....

[CartExpert.net]

In that code part you need to change the class names to something different. Then add the style rules for the new classes to global.css

[neeno]

Ok sofar i have this:

1. <p{if (!$allow_oosp && $product->quantity <= 0) OR !$product->available_for_order OR (isset($restricted_country_mode) AND $restricted_country_mode) OR $PS_CATALOG_MODE} style="display: none;"{/if} id="add_to_cart" class="buttons_bottom_block"><span></span><input type="submit" name="Submit" value="{l s='Add to cart'}" class="special" /></p>

2.
a.special_mini, a.special_small, a.special, a.special_large,
span.button_mini, span.button_small, span.button, span.button_large,
span.special_mini, span.special_small, span.special, span.special_large, span.special_large_disabled{

display: inline-block;
background-color: blue;

}
/

 

I made change to blue for now just to notice the change.... But still no result.

I noticed there is few more definitions of "exclusive" in product.tpl maybe i should change anything else ?

[CartExpert.net]

Also do not forget to recompile the template.

 

If you would post here your site's link it would be easier to help.