[Catégorie Prestashop] Jusqu'à 10 liens vers le même produit

[qbonte]

Bonjour à tous,

Quelque chose m'a sauté aux yeux ce matin.

Je n'avais pas réalisé mais il y a jusqu'à 10 liens vers la fiche produit d'un même article dans mes pages catégories :

- L'image
- "Voir"
- Le nom du produit
- Et plusieurs liens en dessous du nom vers une couleur spécifique

Qu'en pensez-vous ? Ca me semble nuisible pour le référencement nom ? Imaginez insérer 10 liens identiques dans un texte de 20 mots...

Merci d'avance à ceux qui donneront leur avis.

 

[cedric_g]

Bonjour

C'est un peu le problème de beaucoup de templates de boutiques (qu'ils soient développés "maison" ou non d'ailleurs) ; une solution est de faire comme... par exemple CD!scount, qui n'utilise qu'un seul lien vers ses produits et crée à la volée les autres en Javascript :twisted:

Perso je n'ai pas encore bidouillé les boutiques que je gère pour le mettre en oeuvre, mais c'est dans ma check-list !

 

[UsagiYojimbo]

Pour solutionner le souci au niveau des blocs produits dans les pages de listing, il y a en effet la solution de n'avoir qu'un seul lien dans le code source du blog, sur le libellé du produit, et de rendre la box entière cliquable en JS.

Krys.com fait également ça sur la page d'accueil.

 

[cedric_g]

À ce propos, si quelqu'un a un script sympa et facile à intégrer, je suis preneur :mrgreen:

J'ai tenté par mal de trucs, mais à chaque fois c'est un peu foireux. Le problème est que sur mes templates je ne peux pas faire un lien sur tout le bloc, il faut donc "distribuer" le lien sur divers composants.

 

[François]

Bonjour à tous,

Peut-être faut-il utiliser l'attribut "data".

Html:

<montag class="product-link" data-product="/lien-vers-produit">le contenu</montag>

js:

(function ($) {
  $(document).ready(function () {
    $('.product-link').on('click', function(e) {
      e.preventDefault();
      var link = $(this).data('product');
      $(location).attr('href',link);
    });
  }
})(jQuery);

Non testé, mais à un détail ou deux ca doit être bon

A+

 

[qbonte]

Merci pour vos réponses.

Je vois qu'on est tous confrontés au même problème et c'est vrai que ça ne concerne pas que Prestashop.

Je vais essayer de régler ce problème rapidement avec du js.

Quentin

 

[qbonte]

Bonjour à tous,

Peut-être faut-il utiliser l'attribut "data".

Html:

<montag class="product-link" data-product="/lien-vers-produit">le contenu</montag>

js:

(function ($) {
  $(document).ready(function () {
    $('.product-link').on('click', function(e) {
      e.preventDefault();
      var link = $(this).data('product');
      $(location).attr('href',link);
    });
  }
})(jQuery);

Non testé, mais à un détail ou deux ca doit être bon

A+

Excellent François.

Il y aurait juste une amélioration à y apporter :

Faire en sorte qu'il soit perçu comme un vrai lien. Je m'explique, la "main" n'est pas présente au survol mais quand on clique ça fonctionne parfaitement.

Je vais essayer de creuser.

Merci

 

[maniT4c]

la "main" n'est pas présente au survol mais quand on clique ça fonctionne parfaitement.

en css tu rajoute cursorointer pour avoir la main au survol

 

[qbonte]

Oui, merci !

Du coup j'ai réussi à mettre en oeuvre ce système sur Prestashop.

Plus qu'un seul lien placé sur le nom du produit.

 

[UsagiYojimbo]

Le problème est que sur mes templates je ne peux pas faire un lien sur tout le bloc, il faut donc "distribuer" le lien sur divers composants.

Du coup tu dois définir un listener sur chaque classe CSS associé à un élément qui doit être cliquable. Le tout en récupérant le lien depuis l'élément html parent.

 

[qbonte]

Pour solutionner le souci au niveau des blocs produits dans les pages de listing, il y a en effet la solution de n'avoir qu'un seul lien dans le code source du blog, sur le libellé du produit, et de rendre la box entière cliquable en JS.

Krys.com fait également ça sur la page d'accueil.

Je ne suis pas un fin connaisseur mais à force de chercher, j'ai trouvé le moyen pour ne pas être obligé de rendre tout le bloc cliquable.

J'ai ajouté "jshref" à mes class déjà existantes et ça fonctionne parfaitement.

Exemple <div class="responsive img jshref"....</div>

 

[Jlweb]

Bonjour,
Cette optimisation semble en effet très intéressante.
J'ai tenté d'apporter les modifications mon thème mais cela ne fonctionne pas.

Dans product-list.tpl j'ai ajouté le code suivant :

<div class="product-link" data-product="{$product.link|escape:'html':'UTF-8'}">{l s='Voir'}</div>

Puis dans footer.tpl, juste avant le </body> j'ai inséré :

{literal}
<script type="text/javascript">
(function ($) {
  $(document).ready(function () {
    $('.product-link').on('click', function(e) {
      e.preventDefault();
      var link = $(this).data('product');
      $(location).attr('href',link);
    });
  }
})(jQuery);
</script>
{/literal}

Le problème est qu'aucun lien n'est "généré".
Comment faire ?

 

[François]

Qu'entends-tu par : 'aucun lien n'est généré' ?

 

[cedric_g]

J'ai intégré cette modif sur les trois boutiques Prestashop que je gère (ainsi que dans pas mal de modules tant qu'à faire), ça fonctionne très bien

Et du coup, de colère, je suis en train de l'intégrer dans pas mal d'autres sites afin d'optimiser le maillage interne :mrgreen: MERCI François !

Jlweb, as-tu ajouté la règle CSS pour afficher le pointeur adéquat avec la souris ?...

 

[François]

Bah, de rien, c'est pas grand chose...

 

[Jlweb]

Qu'entends-tu par : 'aucun lien n'est généré' ?

Je ne peux pas cliquer.

Je n'ai pas mis de class afin d'avoir la "main" au survol mais cela ne change rien au fait que je ne peux pas cliquer...

 

[François]

Un problème d'intégration du code js sans doute, ou une faute d'orthographe...

Tu peux me donner le lien?

 

[UsagiYojimbo]

Une erreur particulière sur la console ?

 

[qbonte]

Bonjour,
Cette optimisation semble en effet très intéressante.
J'ai tenté d'apporter les modifications mon thème mais cela ne fonctionne pas.

Dans product-list.tpl j'ai ajouté le code suivant :

<div class="product-link" data-product="{$product.link|escape:'html':'UTF-8'}">{l s='Voir'}</div>

Puis dans footer.tpl, juste avant le </body> j'ai inséré :
{literal}
<script type="text/javascript">
(function ($) {
$(document).ready(function () {
$('.product-link').on('click', function(e) {
e.preventDefault();
var link = $(this).data('product');
$(location).attr('href',link);
});
})
})(jQuery);
</script>
{/literal}

Le problème est qu'aucun lien n'est "généré".
Comment faire ?

Tu peux essayer de rajouter la parenthèse en rouge. Ca devrait fonctionner.

 

[François]

Ahh oui, autant pour moi, j'étais sûr qu'il y aurait un petit truc qui cloche...