Comment ajouter une image personnalisée à une liste de Collection - thème DAWN 12

Bonjour,
Je cherche à modifier la section de la page d’accueil “collection-list.liquid” pour y ajouter une partie “image personnalisée” à chaque collection choisie.

Par défaut, l’image affichée de chaque collection dans une section “liste de collection” est l’image de la collection.
Mais je souhaiterais pouvoir charger une image perso, pour chaque collection, qui s’affichera dans la “card” de la collection, à la place de l’image par défaut de ma collection (que je ne veux pas modifier)

A priori, cela n’est pas très compliqué, mais il faut modifier plusieurs fichiers liquid et je bloque :confused:

Merci pour toute aide :slightly_smiling_face:

Rebonjour @Univers-d-Ange ,

Merci pour le compliment sur notre discussion prédécente et de m’avoir signaler votre situation ici. J’ai pu trouver votre demande sur le forum anglophone qui avait une image attachée :

J’ai quelques questions avant d’arriver à la bonne solution.

  • Ce sont-ils les bonnes collections associées à chaque bloc ?
  • Est-ce que vous planifiez de changer les images fréquemment et vous désirez le faire depuis l’éditeur de thème au lieu de la page de collection dans le tableau de bord ?
  • Est-ce que les images représentées actuellement sont les images par défaut de vos collections ? Par exemple:

Ensuite, cette image sera celle affichée sur le bloc:

Me faire part.

1 Like

Merci Océanne de votre réponse. Je suis conscient que c’est pas simple à expliquer et que j’ai pas vraiment réussi à le faire clairement ^^

Pour vous répondre :

  • Ce sont-ils les bonnes collections associées à chaque bloc ?

Oui, chaque image qui apparait dans ma home est l’image par défaut de chaque collection, et chaque collection est linké à chaque bloc de cette “collection-list”

  • Est-ce que vous planifiez de changer les images fréquemment et vous désirez le faire depuis l’éditeur de thème au lieu de la page de collection dans le tableau de bord ?

A priori, je ne changerai pas d’images fréquemment.
Je souhaite juste garder l’image par défaut de chaque collection pour la SERP de google, mais avoir une image custom dans ma section “collection-list” → celle qui apparait sur la home

  • Est-ce que les images représentées actuellement sont les images par défaut de vos collections ?

Oui, actuellement les images à l’écran sont les images par défaut de chaque collection, car j’utilise la section “collection-list”.
Et c’est ça qui me gêne, car ce sont ces images que va présenter google dans les SERPs.
Donc il me faudrait un moyen pour pouvoir laisser de vraies images par défaut de mes collections, et mettre des images custom (les bleues que vous voyez) dans la section collection-list"

Le soucis c’est que je ne peux pas utiliser des colonnes ou autre html custom et y mettre des images, car j’ai besoin d’utiliser les cards des collections puisqu’elles ont des fonctions que je souhaites garder (le zoom, l’ombre etc.)

Est-ce plus clair pour vous ?
Merci.

Rebonjour @Univers-d-Ange ,

Si je comprends mieux, vous souhaitez modifier l’image de vos collections pour votre site, mais veulez que les images par défaut des collections (images bleues) soient celles qui apparaissent dans les SERP, c’est bien ça ?

En général, Google randomise le contenu des SERP en fonction des algorithmes de l’utilisateur final. Je n’ai pas trouvé de moyen pour demander à Google de modifier le contenu de la vitrine afin d’afficher des images SEO personnalisées, mais je sais qu’il est possible de spécifiez l’image de la collection choisie à partir du métafield dans le fichier collection.liquid avec un peu de code liquide :

{% assign seo_image = collection.metafields.custom.custom_image | default : collection.image %}

La logique est donc la suivante :

  • Créer des métafichiers d’image
  • Spécifier l*'image* à l’aide d’un code logique dans le fichier liquid des collections
  • Utiliser les balises méta dans le fichier liquid pour assigner les métafichiers Images qui seront extraits par le Google Crawl.

Cependant, je note que ceci ne fait pas portée de notre soutien. Donc je pense que la meilleure chose à faire ici serait de demander l’avis d’un développeur pour savoir si c’est réalisable, car la question de savoir si c’est une bonne idée pour les performances globales de la boutique en matière de référencement et d’indicateurs clés de performance sur Google est important à évaluer.

Applications et metafields

Il est possible d’utiliser les métafields pour ajouter un champ d’image personnalisé à chaque collection avec une application comme Custom Fields ou Metafields Guru et un peu de codage avec un expert.

Embaucher un Expert

Notre répertoire d’experts est un endroit idéal pour rechercher le travail personnalisé que vous recherchez. Plus vous mettez de détails dans votre message, plus un expert est en mesure de déterminer avec précision si le travail relève de sa portée, ce qui vous fait gagner du temps à tous les deux!

Ce sont des partenaires qui fournissent des services additionnels à nos marchands pour les aider, que ce soit au niveau de la configuration de leur boutique, du design, de modifications au code du thème, des stratégies et outils marketing, etc. Vous pouvez engager pour accomplir une vaste gamme de tâches pour votre boutique Shopify et votre entreprise en général.

Outils

Dans l’avenir, veuillez sauvegarder le SERP Checker - c’est un outil permettant de vérifier la position du site dans les moteurs de recherche en fonction des mots clés.

Je vous souhaite bon courage.

1 Like

Bonjour Océanne,

houlala non, ce n’est pas du tout ce genre de chose que je veux faire :slightly_smiling_face:
Ma demande est mille fois plus simple, je vais résumer :

Je veux juste avoir la possibilité de charger une image personnalisée sur une section de “liste de collection” dans la home.

Donc , je veux garder mon image de collection intacte (celle que je choisis dans la partie des collections), MAIS JUSTE avoir la possibilité de charger une autre image UNIQUEMENT dans la section “liste de collection”

Est-ce plus clair ?
Il faut surement juste rajouter quelques lignes au fichier collection-list.liquid pour avoir la possibilité de charger une image différente de l’image d’origine des collections ?

Merci.

Rebonjour @Univers-d-Ange ,

D’accord, je vois. Dans ce cas-ci les solutions offertes dans ma réponse précédente s’appliquent:

  1. L’ajustement de metafield dans le fichier collection.liquid. Ajoutez la ligne de code partagée, en suivant la logique.
  2. Applications et metafields
  3. Consultez avec un développeur ou un expert pour assurer que c’est une bonne marche à suivre, car ceci ne fait pas partie de notre portée de soutien.

Je vous souhaite bon courage.

1 Like

Bonjour Océanne,

Bon, je n’ai pas compris grand chose sur l’ajustement des metafields…etc. :sweat_smile:
Sauf que cela semble très compliqué d’ajouter une image personnalisée dans une des sections, alors qu’il me semblait qu’il fallait juste ajouter un champ, dans la collection-list, pour permettre de charger une autre image que celle de la collection de base.

Ou alors j’ai très mal expliqué mon soucis :thinking:
Mais merci pour tout le temps que vous y avez passé.

Bonjour @Univers-d-Ange ,

Selon ma compréhension de votre demande, il n’est pas possible - de manière simple - à ajouter une image personalisée à vos collections ailleurs de celle de défaut.

Il est possible, comme mentionné d’y accomplir à l’aide d’images metafields; cependant cela requiert du codage (voici un exemple) et c’est à ce point-ci qu’un expert pourrait vous aider.

Je suis navrée si ce n’est toujours pas ce que vous souhaitez, mais pour ce genre d’envie vous pouvez embaucher un expert.

Je vous souhaite bon courage et bon succès !

1 Like

Merci Océanne,
Si la solution du metafield fonctionne, pour avoir 2 images de collection, cela pourrait remplir le rôle dont j’ai besoin.

Mais ensuite, comment assigner l’image 2 (celle du metafield) à la collection list de ma home ?

Je vais regarder plus en détail le lien que vous m’avez donné, car au premier regard cela avait l’air d’être une piste très intéressante.

Le code ne me fait pas peur quand je comprends un peu ce qu’il y a à faire, et qu’il y a des exemples. :slightly_smiling_face:

Rebonjour @Univers-d-Ange ,

Il faut allé dans la collection à laquelle vous voulez ajouter une image personnalisée et fait défiler la page jusqu’à la section Metafields (si elle n’est pas visible, vous devrez l’activer à l’aide d’une application Shopify ou d’un développement personnalisé).
Créez un nouveau méta-champ pour l’image personnalisée :

  • Namespace :

    custom​
    
  • Clé :

    heroimage​
    
  • Type :

    image
    

Dans collection.liquid ou similaire en fonction du thème, mettez à jour le modèle pour vérifier la présence du métafield personnalisé et l’utiliser s’il existe. Voici un exemple de la façon d’assigner le méta-champ et l’image par défaut :

{% assign heroimage = collection.metafields.custom.heroimage %} 
{% assign cimage = collection.image %} 
{% if heroimage %} 
 {% assign cimage = heroimage %} 
{% endif %}

Voici comment utiliser l’image Metafield dans le Frontend :

 
 

 

Pour que l’image du champ méta soit utilisée par Google et d’autres moteurs de recherche, mettez à jour les balises méta dans la section du fichier theme.liquid :

 
 
 
 
 
 

 
 
 
 

Ce code devrait définir les balises méta og:image et twitter:image de manière à ce qu’elles puissent utiliser l’image du métafield personnalisé s’il existe, sinon l’image de la collection sera utilisée par défaut.

Nous faire part!

1 Like

Merci Oceanne,
C’est très intéressant et j’ai tout compris grâce aux détails que vous avez pris le temps de donner :folded_hands:
Et c’est là que je me suis rendu compte qu’on s’était très très éloigné de ma demande originale.

Je voulais simplement changer les images / mettre des images personnalisées, dans la section “collection-list” de ma home, pas avoir plusieurs images de collection et rajouter du code pour les intégrer aux différents moteurs de recherche.
Là on est parti beaucoup, beaucoup, trop loin :sweat_smile:

J’avais un thème qui faisait ça tout simplement avant d’utiliser DAWN. → un bouton “télécharger image” dans l’éditeur (comme j’ai mis sur la photo du début), et hop l’image de ma collection-list était différent de la collection, mais uniquement sur la home. (jamais je n’ai touché aux images de référence de la collection)
Mais si c’est tellement compliqué avec DAWN (ou alors j’explique mal mon besoin et on ne se comprend pas) je dois faire différemment.

Dans tous les cas, je vous remercie grandement pour votre aide ! :blush:

Bonjour @Univers-d-Ange !

Puisque vous utilisez l’un des thèmes Shopify, votre meilleure option est, si ce n’est déjà fait, de contacter notre assistance afin de leur faire part de votre demande de personnalisation. En effet, si vous utilisez le forfait Basic ou supérieur, vous avez droit à un total de 60 minutes de temps de conception avec notre équipe spécialisée aux thèmes. Contacter notre équipe d’assistance par email permettra ainsi de faire vérifier votre compte et d’étudier votre requête afin de décider si cette personnalisation serait éventuellement envisageable par notre équipe.

Dans le cas où cette requête ne ferait pas partie de la liste de modifications offertes par notre équipe, ou si vous n’êtes pas éligible au temps de conception, il faudra plutôt que vous fassiez appel à un Expert Shopify comme suggéré plus haut par ma collègue Océanne.

En espérant que vous pourrez trouver une solution !