Jump to content

Changer taille image produits phares home


Alice P
 Share

Recommended Posts

Bonjour,

je me décide enfin à écrire un post après de nombreuses heures de recherche pour trouver une solution. J'améliore au fur et à mesure mon site en apprenant seule mais je dois avouer qu'il y a des fois je bloque un peu.

 

Je souhaiterais modifier la taille de la miniature de mes produits qui se trouve dans le bloc des produits phares sous mon slider.

 

En explorant la page sous chrome, j'ai bien trouvé qu'elles sont configurées pour faire 129px sur 129 px. Mais je ne trouve pas dans mon écriture CSS où je peux modifier les données pour agrandir cette miniature.

 

Voici mon site pour illustrer mes propos : www.coffretplaysir.com

 

Merci d'avance pour votre aide

Share this post


Link to post
Share on other sites

Dans le BO tu vas dans préférences => images et tu voix les différentes tailles d'images disponibles (small, medium, thumbs...)

 

Crées une nouvelle que tu appelles phares. Pour les dimensions, tu lui donnes celle que tu veux mettre (par exemple disons 250x250).

Ensuite, tu mets oui pour produits (cette image sera appliquée...)

 

Tu viens donc de créer une nouvelle dimension. Maintenant on va l'appliquer aux images du module produits phares.

 

Tu ouvres le fichier: modules/homefeatured/homefeatered.tpl (attention regardes si il y a une surcharge dans quel cas le fichier à changer est themes/mon_theme/modules/homfeatured/homefeaured.tpl).

 

A un moment tu dois avoir un code pour l'image qui doit ressembler à ça:

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home')}" height="{$homeSize.height}" width="{$homeSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

 

Le code ici est tiré d'une version 1.5 de prestashop, ça peut être légèrement différent. En fait, tu vois dans ce code les attributs 'home' et {$homeSize.height} et {$homeSize.width}.

Si tu as compris, tu comprends que tu changes simplement le home par phares et tu mets donc:

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')}" height="{$pharesSize.height}" width="{$pharesSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

 

Attention à deux choses:

1. Que dans préférences=> performances le cache soit désactivé et la compilation forcée (le temps des changements).

2. Dans préférences, images, sur le bas il faudra certainement faire une "régénération" des miniatures produit.

 

Normalement, ça doit fonctionner et c'est "propre" car tu as généré des miniatures uniquement pour tes produits phares et ainsi tu es sûr de ne pas interférer avec d'autres endroits dans la boutique.

  • Like 1

Share this post


Link to post
Share on other sites

Merci pour cette réponse si rapide.

 

Bon alors j'ai suivi méthodiquement votre tuto mais je comprends pas elles sont toujours en 129x129.

 

J'ai bien fait attention aux performances et j'ai régénéré les miniatures.

 

J'ai du louper un truc mais j'ai beau vérifier dans themes/mon_theme/modules/homfeatured/homefeaured.tpl j ai écris correctement.

 

<_<

Edited by Alice P (see edit history)

Share this post


Link to post
Share on other sites

C'est bizarre je viens de tester ça fonctionne. En mettant ce code là dans la TPL ça ne fonctionne pas ?

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')}"  alt="{$product.name|escape:html:'UTF-8'}" />

 

C'est bien le module produits phares en page d'accueil ? Tu as bien régénéré les images "produits" ? Quand tu as créé le nouveau format, tu as bien mit "oui" pour les produits ? forcer la compilation est sur oui et cache sur non ? Tu as modifié quel fichier TPL: celui dans ton thème (si il y en a un) ou celui dans le répertoire modules/homefeatured ?

 

Quelle version de Prestashop ?

Share this post


Link to post
Share on other sites

oui, c'est bien les produits phares en page d'accueil.

oui, j'ai régénéré les images produits;

Oui, j'ai bien configuré le format que j'ai d'ailleurs mis en 160x160

toujours ok pour la compil' et le cache.

Ensuite, j'ai modifié le fichier TPL de mon thème /themes/SA_plume-1-5/modules/homefeatured

 

j'ai donc ceci dans le TPL :

 

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')}" height="{$pharesSize.height}" width="{$pharesSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

 

Enfin, c'est la version 1.4.7.0

Share this post


Link to post
Share on other sites

  • 5 months later...

Dans le BO tu vas dans préférences => images et tu voix les différentes tailles d'images disponibles (small, medium, thumbs...)

 

Crées une nouvelle que tu appelles phares. Pour les dimensions, tu lui donnes celle que tu veux mettre (par exemple disons 250x250).

Ensuite, tu mets oui pour produits (cette image sera appliquée...)

 

Tu viens donc de créer une nouvelle dimension. Maintenant on va l'appliquer aux images du module produits phares.

 

Tu ouvres le fichier: modules/homefeatured/homefeatered.tpl (attention regardes si il y a une surcharge dans quel cas le fichier à changer est themes/mon_theme/modules/homfeatured/homefeaured.tpl).

 

A un moment tu dois avoir un code pour l'image qui doit ressembler à ça:

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home')}" height="{$homeSize.height}" width="{$homeSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

 

Le code ici est tiré d'une version 1.5 de prestashop, ça peut être légèrement différent. En fait, tu vois dans ce code les attributs 'home' et {$homeSize.height} et {$homeSize.width}.

Si tu as compris, tu comprends que tu changes simplement le home par phares et tu mets donc:

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')}" height="{$pharesSize.height}" width="{$pharesSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

 

Attention à deux choses:

1. Que dans préférences=> performances le cache soit désactivé et la compilation forcée (le temps des changements).

2. Dans préférences, images, sur le bas il faudra certainement faire une "régénération" des miniatures produit.

 

Normalement, ça doit fonctionner et c'est "propre" car tu as généré des miniatures uniquement pour tes produits phares et ainsi tu es sûr de ne pas interférer avec d'autres endroits dans la boutique.

 

Merci Franckm1000, ça marche impeccable.

Share this post


Link to post
Share on other sites

  • 2 months later...
  • 1 month later...

Bonjour,

Est-ce que qqn aurait une idée sur le sujet,

après avoir agrandi mes images phares, elles ne s'affichent que de 15px sur 36px au lieu de 200px/200px mais seulement sous Internet Explorer ?

Share this post


Link to post
Share on other sites

  • 1 month later...

Bonjour,

 

Je suis sur la version 1.5.5.

 

J'ai essayé de faire votre solution, j'ai bien créer une nouvel image (phares) dans (préférence > image) j'ai mis une dimension de 150*150, et j'ai bien coché le la rubrique Produit.
 

Coté Code, dans le fichier : Thème > Montheme > modules > homefeatured > homefeatured.tpl

 

J'ai bien changé la ligne, comme vous avez dit : 

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')|escape:'html'}" height="{$pharesSize.height}" width="{$pharesSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />

Et quand je renouvelle ma page, les images disparaissent, on a le petit icone d'image brisé...

 

Merci d'avance pour votre aide 

Share this post


Link to post
Share on other sites

A mon avis ( il y à beaucoup plus expert que moi ici ) c'est un problème de lien vers ton image. En modifiant ton code, tu as du althèrer la partie link :

"{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')|escape:'html'}"

Share this post


Link to post
Share on other sites

Voici ma ligne :

<img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'phares')}" height="124" width="124"

pour finir j'ai même forcé height et width car j'avais un bug avec certains navigateurs

Share this post


Link to post
Share on other sites

Bonjour,

Voici ci-dessous ma fiche mémoire pour agrandir les Produits Phares à partir du thème par défault selon les infos que j'ai trouvé sur ce forum entre autres :

 

1 : AGRANDISSEMENT :

 

Dans le BO, tu vas dans préférences => images et tu voix les différentes tailles d'images disponibles (small, medium, thumbs...)

Crées une nouvelle que tu appelles Phares. Pour les dimensions, tu lui donnes celle que tu veux mettre (par exemple disons 200x200).
Ensuite, tu mets oui pour produits (cette image sera appliquée...)

Tu viens donc de créer une nouvelle dimension. Maintenant on va l'appliquer aux images du module produits phares.

Tu ouvres le fichier: themes/default/modules/homfeatured/homefeaured.tpl).

A un moment tu dois avoir un code pour l'image qui doit ressembler à ça:

 

($product.link_rewrite, $product.id_image, 'home_default')}" height="{$homeSize.height}" width="{$homeSize.width}"

 

Le code ici est tiré d'une version 1.5 de prestashop. En fait, tu vois dans ce code les attributs 'home' et {$homeSize.height} et {$homeSize.width}et $product.id_image, 'home_default')

 

Si tu as compris, tu comprends que tu changes simplement le home_default par Phares et tu mets donc:

($product.link_rewrite, $product.id_image, 'Phares')}" height="{$PharesSize.height}" width="{$PharesSize.width}"

 

Attention à deux choses:

1. Que dans préférences=> performances le cache soit désactivé et la compilation forcée (le temps des changements).
2. Dans préférences, images, sur le bas il faudra certainement faire une "régénération" des miniatures produit.

 

DONC mettre le fichier homefeatured.tpl dans prestashop-themes-default-modules-homefeatured via FileZilla.

 

2 : CENTRER :

 

Changer dans prestashop-modules-homefeatured le fichier homefeatured.css :

 

#featured-products_block_center li {

margin-right:10px;

padding:10px 0;

width:126px;

height:240px

 

par ça :

 

#featured-products_block_center li {

margin-right:15px;

padding:10px 0;

padding-left:35px;

 

(padding-left:35px; étant la distance entre l'image de gauche et le bord gauche afin que les images soient centrées)

 

et

 

#featured-products_block_center .s_title_block, #featured-products_block_center h5 {

padding-top:5px;

height:30px;

font-size:12px;

color:#222;

padding-bottom: 0;

font-weight:bold;

 

par ça :

 

#featured-products_block_center .s_title_block, #featured-products_block_center h5 {

padding-top:5px;

height:15px;

font-size:12px;

color:#222;

padding-bottom: 0;

font-weight:bold;

 

(height:15px; étant la distance entre le nom du produit et "plus d'infos")

 

 

DONC mettre le fichier homefeatured.css dans prestashop-modules-homefeatured via FileZilla.

 

3 : MARGE DU BAS :

 

Remplacer dans prestashop-themes-default-css le fichier global.css :

 

/* BLOCK .block ******************************************************************************** */

.block {margin-bottom:20px}

 

par ça :

 

/* BLOCK .block ******************************************************************************** */

.block {margin-bottom:0px}

 

( margin-bottom:0px étant la distance entre le block produit phares et le header)

 

DONC mettre le fichier global.css dans prestashop-themes-default-css via FileZilla

 

FIN

 

Evidemment, à chacun de l'adapter à ses dimensions.

En ce qui concerne le pb d'affichage sous IE des images produits phares modifiées, je joins un module qui résoud le pb à partir des dernières versions d'IE (10).

imagefix.zip

Edited by Qaswa (see edit history)

Share this post


Link to post
Share on other sites

  • 4 weeks later...

Bonjour,

 

Je viens d'essayer cette technique, les images aparaissent bien sous leur nouveaux format mais j'ai maintenant une erreur sous chaque image (erreur affiché avec le mode dev activé) et le nom du produits, le prix etc.... n'apparaissent plus: 

( ! ) Notice: Undefined index: home_featuredSize in C:\wamp\www\prestashop156\cache\smarty\compile\20\15\cb\2015cbe3ac457e2b329e1251728ef40cdc1768aa.file.homefeatured.tpl.cache.php on line 83 Call Stack #TimeMemoryFunctionLocation 10.000632444384{main}( )..\index.php:0 20.112341747328DispatcherCore->dispatch( )..\index.php:28 30.119642637408ControllerCore->run( )..\Dispatcher.php:348 40.186148292024IndexControllerCore->initContent( )..\Controller.php:167 52.601165772208HookCore::exec( )..\IndexController.php:39 62.785266043912HomeFeatured->hookDisplayHome( )..\Hook.php:457 73.141666709736ModuleCore->display( )..\homefeatured.php:133 83.141866722816Smarty_Internal_TemplateBase->fetch( )..\Module.php:1662 93.397266995704content_52726cfd2347f5_96171589( )..\smarty_internal_templatebase.php:180
( ! ) Notice: Trying to get property of non-object in C:\wamp\www\prestashop156\cache\smarty\compile\20\15\cb\2015cbe3ac457e2b329e1251728ef40cdc1768aa.file.homefeatured.tpl.cache.php on line 83
Call Stack
#    Time    Memory    Function    Location
1    0.0006    32444384    {main}( )    ..\index.php:0
2    0.1123    41747328    DispatcherCore->dispatch( )    ..\index.php:28
3    0.1196    42637408    ControllerCore->run( )    ..\Dispatcher.php:348
4    0.1861    48292024    IndexControllerCore->initContent( )    ..\Controller.php:167
5    2.6011    65772208    HookCore::exec( )    ..\IndexController.php:39
6    2.7852    66043912    HomeFeatured->hookDisplayHome( )    ..\Hook.php:457
7    3.1416    66709736    ModuleCore->display( )    ..\homefeatured.php:133
8    3.1418    66722816    Smarty_Internal_TemplateBase->fetch( )    ..\Module.php:1662
9    3.3972    66995704    content_52726cfd2347f5_96171589( )    ..\smarty_internal_templatebase.php:180
" width="
( ! ) Notice: Undefined index: home_featuredSize in C:\wamp\www\prestashop156\cache\smarty\compile\20\15\cb\2015cbe3ac457e2b329e1251728ef40cdc1768aa.file.homefeatured.tpl.cache.php on line 84
Call Stack
#    Time    Memory    Function    Location
1    0.0006    32444384    {main}( )    ..\index.php:0
2    0.1123    41747328    DispatcherCore->dispatch( )    ..\index.php:28
3    0.1196    42637408    ControllerCore->run( )    ..\Dispatcher.php:348
4    0.1861    48292024    IndexControllerCore->initContent( )    ..\Controller.php:167
5    2.6011    65772208    HookCore::exec( )    ..\IndexController.php:39
6    2.7852    66043912    HomeFeatured->hookDisplayHome( )    ..\Hook.php:457
7    3.1416    66709736    ModuleCore->display( )    ..\homefeatured.php:133
8    3.1418    66722816    Smarty_Internal_TemplateBase->fetch( )    ..\Module.php:1662
9    3.3972    66995704    content_52726cfd2347f5_96171589( )    ..\smarty_internal_templatebase.php:180

Selon le rapport d'erreur, l'erreur à l'air de venir de ces 2 lignes, mais je ne vois pas le problème :

" height="<?php echo $_smarty_tpl->tpl_vars['home_featuredSize']->value['height'];?>
" width="<?php echo $_smarty_tpl->tpl_vars['home_featuredSize']->value['width'];?>
Edited by Nekoid (see edit history)

Share this post


Link to post
Share on other sites

  • 2 weeks later...
  • 2 months later...

Bonjour, je m'excuse je suis peut-etre un peu dure à la comprenette, mais je souhaite savoir comment redimensionner les vignettes de mes fiches produits...J'ai lu ce topic mais je ne trouve pas la réponse qui me concerne, enfin je crois.

 

J'ai été dans image, j'ai essayer différente solutions mais sans succes.

 

Dans l'image ci dessous, ou dois-je modifier la taille de me vignettes produit et aprés est t'il necessaire de faire une regeneration ???

 

Merci de votre aide.

 

mini_416242Sanstitre1.jpg

Share this post


Link to post
Share on other sites

  • 1 month later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More