Modifier css produits

[ccilou31]

Bonjour,

 

Peut-être que je m'aventure un peu trop mais bon...

 

J'aimerais modifier le CSS qui concerne les produits. Mon but : passer en H2 le résumé de mon produit en gardant une taille de police normale et un interligne normal.

 

Je ne sais pas quel est le fichier à modifier car lorsque j'ouvre le dossier CSS, il s'affiche un certain nombre de fichiers et d'autre part, je suppose qu'il y a un endroit bien précis dans ce CSS qui concerne le résumé produit.

 

 

Qui peut me dire quel fichier je dois prendre et où je dois faire la modif ? Avec des mots très simples car je suis néophyte

 

Merci beaucoup.

[MayMo design]

avant de changer le css, il faut modifier le fichier product.tpl pour mettre la description en h2, ensuite donner un id="" ou class="" et enfin introduire ça dans le css ( /css/product.css )

 

Ps : par défaut, la description est en <div id="short_description_content">

[ccilou31]

Ouh là, là, merci beaucoup pour l'explication mais je suis déjà perdue à la deuxième ligne. Que dois-je entendre par : donner un id="" ou class="" ?

 

Si je mets en H2, il va me grossir la police et agrandir l'interligne or je veux du h2 qui apparaisse comme du texte normal (c'est pour le référencement uniquement) où faut-il que je modifie (ou rajoute) la taille et l'interligne ? dans le fichier product ?

 

Je vais aller voir comment ça se présente et si je peux me lancer dans l'aventure... ou non...

[MayMo design]

ok, regarde :

par défaut : à la ligne 192 : le block de la description courte est :

{if $product->description_short}
<div id="short_description_content" class="rte align_justify">{$product->description_short}</div>
  {/if}

 

 

on modifie ce block en :

 

{if $product->description_short}
<h2 id="short_description_h2" class="rte align_justify">{$product->description_short}</h2>
  {/if}

et dans product.css on créé ce nouveau h2 avec l'id : short_description_h2

 

h2#short_description_h2 {font: 12px Arial,Helvetica,Sans-Serif;}

 

bon là, tu modifie à ta guise.

j’espère que c'est clair maintenant.

[flo-imajean]

salut

pour savoir quel fichier css est a modifier, installes firebug dans mozilla firefox.

une fois dans la page que tu veut modifier, cliques sur la bestiole en haut droite de ton écran afin de lancer firebug et en bas une page en html va s'afficher avec le code lu par le navigateur. si tu clique sur une div ou autre dans ce-dit code html, tu verras les propriétés css sur la droite ainsi que le nom du fichier qui lui applique ces valeurs.

très très pratique !

[ccilou31]

Merci à vous deux.

 

@flo : J'ai téléchargé firebug, c'est assez bluffant en effet et ça doit être génial pour un développeur même que ça pourra peut-être me servir à l'occasion

@Maymo : merci pour l'explication simplifiée mais j'ai peur de mettre le bazar dans mes fichiers et de le regretter. (je garde ton site en favoris d'ailleurs, ça pourrait servir)

 

Pour le moment, je pense que je vais me contenter des outils SEO mis à disposition par Prestashop et rester dans les modifications de mon niveau