Homefeatured / Produit phare : modification page

[thecat22]

Hello,

Voilà, j'utilise le thème black & white sur le site www.pullipshop.be. J'aimerais modifier le nombre de produits par ligne qui s'affichent. J'ai modifié le code dans le fichier homefeatured.tpl, mais il affiche toujours 6 produits par ligne (j'aimerais en avoir 4 avec des images plus grandes)
Pour le moment 2 lignes de 6, j'aimerais 3 lignes de 4 produits.

Voici le code du fichier .tpl.

><!-- MODULE Home Featured Products -->




{l s='featured products' mod='homefeatured'}

{if isset($products) AND $products}



    {assign var='liHeight' value=360}

    {assign var='nbItemsPerLine' value=4}

    {assign var='nbLi' value=$products|@count}

    {assign var='nbLines' value=$nbLi/$nbItemsPerLine|ceil}

    {assign var='ulHeight' value=$nbLines*$liHeight}



       {foreach from=$products item=product name=homeFeaturedProducts}

       {assign var='productLink' value=$link->getProductLink($product.id_product, $product.link_rewrite, $product.category)}
















{$product.name|escape:htmlall:'UTF-8'|truncate:30}




{$product.description_short|strip_tags|truncate:100:'...'}




{displayWtPrice p=$product.price}

{l s='View' mod='homefeatured'}

{l s='Cart' mod='homefeatured'}

{if ($product.quantity > 0 OR $product.allow_oosp) AND $product.customizable != 2}



            {else}

{l s='Add to cart' mod='homefeatured'}

           {/if}





        {/foreach}





   {else}


{l s='No featured products' mod='homefeatured'}

{/if}



</pre>
<ul>

</ul>
<a rel=""></a><br>href="http://www.pullipshop.be/product.php?id_product=86"><br>style="border: 0px solid ; width: 901px; height: 385px;" alt=""<br><br>src="http://www.pullipshop.be/img/bannierenahhato.gif"><br><br><br><br><br><br><!-- /MODULE Home Featured Products --><br

J'ai également cherché dans le global.css, mais je n'y ai rien trouvé de bien intéressant à mon goût... ;-) !

Merci pour votre aide !


André

[thecat22]

Allo ???
Y a quelqu'un ???

[Divine]

Bonjour,

Il faut que tu mettes les pattes dans ton fichier global.css pour cela.
Un indice: commences par changer le "width" de tes blocs produits...

[thecat22]

Merci pour ta réponse.

J'ai modifié cette ligne...

#center_column div.products_block a.product_image {display: block; background-color: transparent; width: 210px; height: 210px; margin-left:2px;}

Au départ c'était 129px, j'ai changé en 210px.
Mais rien n'y fait. En fait, j'ai choisi cette ligne parce que le developer tools de Chrome m'indiquait que les images faisaient 129 x 129.
Donc voilà !

J'ai cherché un block homefeatured dans le global.css mais je n'ai rien trouvé... J'ai cherché aussi dans le prod.css du module editorial, rien non plus.

J'hésite à modifier d'autres lignes de code, je n'ai pas envie d'avoir des erreurs sur d'autres pages...
J'aimerais que les produits phares s'affichent comme sur cette page (meilleures ventes )
pullipshop

Si vous pouvez m'aiguiller, ca serait cool !

Merci !

[Divine]

C'est le width de l'image que tu as modifié. Il faut d'abord que tu modifies le width du bloc qui contient l'image:

#center_column .products_block ul li

[yza_change]

Slt à tous !

Ptet que ca peut t'aider d'utiliser Firebug de Firefox ?!

Jdonne une piste mais Divine à l'air de mieux s'y connaitre.

a++

[thecat22]

Oki doki !
En effet, maintenant, c'est bien ok, 4 produits par ligne.
Merci beaucoup Divine. J'avoue ne pas être grand fan des css, et je n'étais pas si loin hein...!!

Petite question complémentaire : comment puis-je faire pour que le texte apparaisse en bas de la photo au lieu de à droite ? En fait, les photos font toujours 129x129, et vu qu'il y a le texte à droite, la dimension d'image de 210x210 est probablement bloquée par le script...
Vraiment, j'aimerais faire un copier-coller du module best sellers sur le module homefeatured, mais évidemment avec les données produits homefeatured. J'ai comparé les deux fichiers, mais j'avoue que je ne trouve pas du tout la ligne à modifier. (peut être $product.description_short ??)

J'ai changé le nom de classe de h3 au lieu de h5, et çà a tout modifié... Rien à voir ! Snif snif ! J'aime pas les codes !
En tout cas merci encore !


@ yza_change : merci aussi pour l'info, je regarde de temps en temps le code avec firebug mais je n'ai pas toujours les outils partout où je suis. De toute façon, on ne sait pas faire les modifs directement via firebug je pense...

[Divine]

Pour que ton texte apparaisse en bas de ta photo il te suffit de le déplacer dans ton fichier tpl puis d'adapter ton css pour que le tout rende bien

[thecat22]

Ca y est, c'est officiel, je suis largué !
Sorry, mais je ne sais vraiment pas faire tout çà...!