Jump to content

[PrestaTIPS] - LOGO DE MARQUE

ludo

By ludo
in Modules et thèmes gratuits

 Share

Recommended Posts

ludo Newbie

ludo

Posted
Posted

Voici comment pour ajouter le logo de la marque d’un article et rendre ainsi la fiche produit plus professionnelle. Nous partons du principe que nous gérons les marques avec la notion de fabricant (manufacturer).

 

logo_marque.jpg

  • Like 4
Link to comment
Share on other sites
Maury Girard Newbie

Maury Girard

Posted
Posted

Bonjour Ludo

Désolé de polluer ton thread en prépa, si je peux me le permettre

Je suis en train de voir pour afficher les logo fabricants

de la manière indiquer dans ce screen

mais soit effectivement depuis la création d'un module modifier en B.o

Mais je préfère en dur, ce qui empêche malheureusement la possibilité de revenir à tous moment au menu d'origine natif.

 

D'ailleurs je trouve dommage que cette fonction ne soit pas implanté depuis des lustre dans

les versions de Prestashop.

post-14717-0-41799100-1319017742_thumb.jpg

Link to comment
Share on other sites
ludo Newbie

ludo

Posted
  • Author
Posted

pas de soucis Maury !

par contre je vais abandonner l'idée de mettre le fichier en téléchargement sur le forum directement... on a droit a 2Mo en tout et pour tout ! Dommage de plus avoir le compteur de téléchargement mais c'est vraiment trop limite...

 

Je vais donc mettre les liens vers mon serveur directement (libre de tout quota :))

  • Like 1
Link to comment
Share on other sites
  • 2 weeks later...
maxhome Newbie

maxhome

Posted
Posted

Merci à toi Ludo, même sur ma "vieille" 1.2.5, c'est tout simplement parfait et...pratique

Thanks ;)

 

Oups p'tit edit: si l'image n'existe pas, j'ai un beau carré croix rouge sur IE et sur Firefox le titre seulement (exemple: produit ref 155, l'image 155.jpg n'existe pas et pourtant sous IE il cherche la 155.jpg)

Il est tard, j'ai loupé quelque chose?? merci

Link to comment
Share on other sites
maxhome Newbie

maxhome

Posted
Posted

Bon je me réponds mais surtout que les pros me corrigent...

J'ai donc un problème avec cette modif si l'image n'existe pas; j'ai donc à cette ligne:

<img src="{$img_manu_dir}{$product_manufacturer->id}-logo.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" />

 

ajouter l'évenement onerror ainsi

 

<img src="{$img_manu_dir}{$product_manufacturer->id}-small.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" onerror="this.src='{$img_manu_dir}fr-default-small.jpg';"/>

 

De ce fait si l'image n'existe pas, cela renvoie sur onerror et une image par défaut est chargée...

Cela fonctionne mais qu'en pensez-vous-> propre ou pas?

 

Par contre pendant un petit instant la croix rouge sous IE apparait, le temps que l'image se charge.

Y'a plus simple, certainement mais je m'y perds.

J'ai bien vue des modifs à faire dans le php qui appele le tpl avec smarty mais là je tourne en rond...

 

Merci à vous

Link to comment
Share on other sites
ludo Newbie

ludo

Posted
  • Author
Posted

salut max

oui ton test est bon mais pourquoi tu n'aurais pas d'image ?

Si tu crées une marque, tu lui associes immédiatement son logo et finalement tu trouveras jamais dans ce cas...

Dans l'absolu t'as raison mais dans la pratique ca n'arrivera pas.

Link to comment
Share on other sites
maxhome Newbie

maxhome

Posted
Posted

Bonsoir, une petite modif pour ceux et celles que ça interesse pour compléter l'astuce de Ludo...

Encore une fois dans le cas ou vous avez des marques sans logo et que l'astuce précité (image par défaut quand il n'y a pas d'image associée) ne vous satisfait pas

à la place du code de ludo original

<!-- logo manufacturer -->
{if $product_manufacturer->id}
<a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}">
<img src="{$img_manu_dir}{$product_manufacturer->id}-logo.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" />
</a>
{/if}

remplacer par

<!-- logo manufacturer -->
{capture assign='t_file'}img/m/{$product_manufacturer->id}-logo.jpg{/capture}
{if $t_file|file_exists}
 {if $product_manufacturer->id}<a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}">
 <img src="{$img_manu_dir}{$product_manufacturer->id}-small.jpg" class="logo_manufacturer" title="{l s='Les autres produits de la marque '}{$product_manufacturer->name}" alt="{$product_manufacturer->name}" onerror="this.src='{$img_manu_dir}fr-default-small.jpg';"/>
 </a>
 {/if}
{else}
{/if}

 

Explication: on teste la présence du fichier

Si existe-> on affiche l'image

Si inexistant-> on fait rien

 

C'est une bidouille et j'espère ne pas heurter les pros du dev ;)

Link to comment
Share on other sites
ludo Newbie

ludo

Posted
  • Author
Posted

Oui c'est bien .. sauf qu'il faut tester avant si le produit a un fabricant (marque) car s'il n'en a pas ca sert a rien de faire tout le reste.

 

<!-- logo manufacturer -->
{if $product_manufacturer->id}
{capture assign='t_file'}img/m/{$product_manufacturer->id}-logo.jpg{/capture}
{if $t_file|file_exists}
 <a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}">
 <img src="{$img_manu_dir}{$product_manufacturer->id}-logo.jpg" class="logo_manufacturer" title="{l s='Les autres produits de la marque '}{$product_manufacturer->name}" alt="{$product_manufacturer->name}" onerror="this.src='{$img_manu_dir}fr-default-logo.jpg';"/>
 </a>
 {/if}
{/if}

Link to comment
Share on other sites
maxhome Newbie

maxhome

Posted
Posted

Bonjour le-cathare,

J'ai installé une 1.4.5.1 comme toi pour tester...

Es-tu sûr d'avoir bien placé ton code au sein du product.tpl et d'avoir alimenter ton product.css?

Pour moi dans le product.tpl à la ligne 155 juste après le

  <img src="{$img_prod_dir}{$lang_iso}-default-large.jpg" id="bigpic" alt="" title="{$cover.legend|escape:'htmlall':'UTF-8'}" width="{$largeSize.width}" height="{$largeSize.height}" />
 {/if}
 </div>

j'ai mis ce code (je fais appel non à l'image logo mais à l'image small existante par défaut, histoire de faire un test...

<!-- logo manufacturer -->

{if $product_manufacturer->id}
  {capture assign='t_file'}img/m/{$product_manufacturer->id}-small.jpg{/capture}
  {if $t_file|file_exists}
<a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}">
<img src="{$img_manu_dir}{$product_manufacturer->id}-small.jpg" class="logo_manufacturer" title="{l s='Les autres produits de la marque '}{$product_manufacturer->name}" alt="{$product_manufacturer->name}"/>
</a>
  {/if}
{/if}
<!-- fin logo manufacturer -->

Dans le product.css, à la fin j'ajoute

/* logo manufacturer */
.logo_manufacturer {
background:white;
padding:5px;
margin-top: -30px;
margin-left: 10px;
}

Je vide le cache et normalement c'est bon... Sorry je ne peux rien faire de plus :unsure:

A la fin j'obtiens cela...

Sans titre.bmp

Link to comment
Share on other sites
maxhome Newbie

maxhome

Posted
Posted

Ludo dans son pdf explique comment créer une nouvelle taille de vignette.(dans son exemple il l'appelle logo.jpg). Sinon tu peux utiliser les standards existants à savoir -medium.jpg si tu trouves que le -small.jpg est trop petit... (Il faut bien sûr changer le nom du jpg dans le code)...

va voir dans ta boutique\img\m pour voir les différents formats existants.

Sinon pour la position, tout se déroule dans le product.css

Link to comment
Share on other sites
  • 1 month later...
  • 5 months later...
  • 2 weeks later...
  • 4 weeks later...
Rom75 Newbie

Rom75

Posted
Posted (edited)

Voici comment pour ajouter le logo de la marque d’un article et rendre ainsi la fiche produit plus professionnelle. Nous partons du principe que nous gérons les marques avec la notion de fabricant (manufacturer).

 

logo_marque.jpg

 

 

 

Bonjour Ludovic, très bon topic, juste une question Je souhaiterai que mon logo de marque s'affiche comme dans ton exemple, c'est à dire à droite de la photo, sous le bloc contenant panier etc... je n'arrive pas à le placer correctement ?

 

Où dois je intégrer les codes dans le product.tpl et product.css.

 

Merci de ta réponse !

Edited by Rom75 (see edit history)
Link to comment
Share on other sites
  • 1 month later...
Cateye Rookie

Cateye

Posted
Posted

Bonjour,

 

j'ai installé moi les logos via un module car je n'y arrivai pas avec le code.

 

En revanche est-il possible d'avoir les logos des fabricants dans le panier? existe t il un code ou un module pour cela?

Quel est le nom de ce module STP?

Link to comment
Share on other sites
Prestapascher Newbie

Prestapascher

Posted
Posted

Pourtant c'est écrit très clairement dans le .PDF... et rien de compliqué... :/

 

Oui tout est clair, en fait c'est avec mon thème perso, pour l'agence web cela était plus simple et si il y a une mise à jour, on à juste à appliquer la mise à jour du module.

 

En revanche votre solution est top tout comme vos autres modifs ;-)

 

Après pour mettre cela dans le panier, la modif est elle la même?

Link to comment
Share on other sites
Prestapascher Newbie

Prestapascher

Posted
Posted

LooL

Je ne suis pas l'auteur de ces PrestaTips...

 

Concernant votre idée de vouloir ajouté le logo dans le panier ajax... je pense que ce n'est pas recommandé... ceci rendrait lourd le panier suivi d'un chargement plus long de vos pages (quand vous remplissez votre panier)

 

En fait ce n'est pas dans le panier ajax mais dans le récapitulatif mon panier, je pense que les logos rassurent les clients dans mon domaine qui est le high tech. Cdiscount le fait par exemple.

Link to comment
Share on other sites
Vinc3nzo Newbie

Vinc3nzo

Posted
Posted

En fait ce n'est pas dans le panier ajax mais dans le récapitulatif mon panier, je pense que les logos rassurent les clients dans mon domaine qui est le high tech. Cdiscount le fait par exemple.

 

il suffit juste de jeter un oeil avec firebug chez CDiscount, vous aurez droit à des bout de code html je pense :)

 

ne restera plus q'a coller dans un .tpl approprier :)

Link to comment
Share on other sites
Prestapascher Newbie

Prestapascher

Posted
Posted

il suffit juste de jeter un oeil avec firebug chez CDiscount, vous aurez droit à des bout de code html je pense :)

 

ne restera plus q'a coller dans un .tpl approprier :)

 

Il faut que je vois cela car sur certains sites le codage est vraiment spécifique, par exemple je voulais m'inspirer du plan de site de LDLC que je trouve top mais une fois collé dans un bloc html rien ne fonctionnait.

 

Mais merci pour l'info en tout cas.

Link to comment
Share on other sites
  • 3 months later...
logs00 Newbie

logs00

Posted
Posted

Je ne sais pas si l'astuce a été donné pour les versions 1.5.x de PS mais pour afficher le visuel de marque j'ai réussi avec ce bout de code :

 

 <img src="{$img_manu_dir}{$product_manufacturer->id}.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" />

  • Like 1
Link to comment
Share on other sites
  • 3 months later...
  • 2 weeks later...
lordbdp Newbie

lordbdp

Posted
Posted (edited)

Avec les différentes modifications que vous avez apporté j'ai saisi le code suivant dans product.tpl :

<!-- logo manufacturer -->
{if $product_manufacturer->id}
{capture assign='t_file'}img/m/{$product_manufacturer->id}-logo.jpg{/capture}
{if $t_file|file_exists}
 <a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}"><img src="{$img_manu_dir}{$product_manufacturer->id}.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" />
 </a>
 {/if}
{/if}

 

Sauf que maintenant j'ai le logo en maxi qui s'affiche, et je n'ai plus le nom de la marque qui s'affiche sous le logo. Je suis sur PS 1.5.4.

Edited by lordbdp (see edit history)
Link to comment
Share on other sites
lordbdp Newbie

lordbdp

Posted
Posted

Alors il a fallu que je modifie product.css comme suit :

/* logo manufacturer */
.logo_manufacturer {
height:100px;
background:white;
padding:5px;
margin-top: -30px;
marging-left: 10px;
}

 

Maintenant j'ai l'image en 100px de haut (la largeur étant proportionnelle si on ne met pas de weight:100px).

Link to comment
Share on other sites
lordbdp Newbie

lordbdp

Posted
Posted

Dans product.tpl du theme, remplacer l.224 :

<div id="pb-left-column">
 <h1>{$product->name|escape:'htmlall':'UTF-8'}</h1>
 <p>{$product->manufacturer_name|escape:'htmlall':'UTF-8'}</p>

par

<div id="pb-left-column">
 <h1>{$product->name|escape:'htmlall':'UTF-8'}</h1>
  <!-- logo manufacturer -->
 <p>{if $product_manufacturer->id}
  {capture assign='t_file'}img/m/{$product_manufacturer->id}-logo.jpg{/capture}
   {if $t_file|file_exists}
   <a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}"><img src="{$img_manu_dir}{$product_manufacturer->id}.jpg" class="logo_manufacturer" title="{$product_manufacturer->name}" alt="{$product_manufacturer->name}" /></a>
   {/if}
  {/if}
 </p>
 <p>{$product->manufacturer_name|escape:'htmlall':'UTF-8'}</p>

 

Au final vous obtiendrez ce visuel :

2013-04-27_2306.png

 

C'est enfin fonctionnel ! ^^

Link to comment
Share on other sites
  • 2 months later...
  • 2 weeks later...
lordbdp Newbie

lordbdp

Posted
Posted

Pour la taille de l'image comme je l'ai expliqué il suffit de modifier la valeur pour le height: ??px;

 

/* logo manufacturer */
.logo_manufacturer {
height:100px;
background:white;
padding:5px;
margin-top: -30px;
marging-left: 10px;
}

 

Maintenant j'ai l'image en 100px de haut (la largeur étant proportionnelle si on ne met pas de weight:100px).

 

Pour la position je ne sais pas mais avec Firebug tu trouveras sûrement ;)

Link to comment
Share on other sites
  • 6 months later...
amoric69 Newbie

amoric69

Posted
Posted

Oui c'est bien .. sauf qu'il faut tester avant si le produit a un fabricant (marque) car s'il n'en a pas ca sert a rien de faire tout le reste.

 

<!-- logo manufacturer -->
{if $product_manufacturer->id}
{capture assign='t_file'}img/m/{$product_manufacturer->id}-logo.jpg{/capture}
{if $t_file|file_exists}
  <a href="{$link->getmanufacturerLink($product_manufacturer->id_manufacturer, $product_manufacturer->link_rewrite)}">
  <img src="{$img_manu_dir}{$product_manufacturer->id}-logo.jpg" class="logo_manufacturer" title="{l s='Les autres produits de la marque '}{$product_manufacturer->name}" alt="{$product_manufacturer->name}" onerror="this.src='{$img_manu_dir}fr-default-logo.jpg';"/>
  </a>
  {/if}
{/if}

Bonjour,

Comment fait-on pour faire la même chose dans la page catégorie de produit ? Est-ce bien le fichier product-list.tpl qu'il faut changer ?

Link to comment
Share on other sites
  • 1 month later...
  • 1 month later...
salma24 Newbie

salma24

Posted
Posted

aidez moi svp

y'a un module deja installè sur ma boutique presta qui consiste a affichè une carrousel d'image des marques de produit au footer de ma boutique bien que les marques sont ajoutès avec succèes et le lien ca marche mais le prob c'est que pas d'image a affichè les logo de marques ne s'affichent pas dans cette carrouselle

que faire?

Link to comment
Share on other sites
Guest
This topic is now closed to further replies.
 Share
Go to topic listing
×
×
  • Create New...