Articles associés

Liens en vedette

1. Documentation Shopify sur les sections et les blocs
2. Documentation Company XYZ sur les paramètres des commandes du diaporama
3. Documentation Company XYZ sur les paramètres des en-têtes
4. Documentation Company XYZ sur les paramètres des cartes
5. Documentation Company XYZ sur les paramètres d’espacement de section
6. Documentation Company XYZ sur les paramètres d’arrière-plan de section
7. Documentation Company XYZ sur les paramètres des séparateurs
8. Documentation Company XYZ sur les paramètres de visibilité
9. Documentation Company XYZ sur les paramètres de largeur de mise en page

Vidéos utiles

Vidéo Shopify Academy : personnaliser votre boutique

Vidéo Shopify Academy : personnaliser votre boutique

Afficher davantage d’articles du même blog à la fin d’un article pour inciter les lecteurs à poursuivre leur lecture. Cette section récupère automatiquement les publications récentes à partir du blog de l’article actuel, elle est donc idéale lorsque vous souhaitez afficher du contenu associé sans sélectionner manuellement chaque élément. Pour un aperçu plus large du fonctionnement de ces paramètres de section dans l’éditeur de thème, consultez documentation Shopify sur les sections et les blocs

Note

Si vous devez choisir des articles spécifiques au lieu d’afficher automatiquement les plus récents, utilisez plutôt une section Articles de blog.

Paramètres principaux

Le principal contrôle de contenu est le nombre d’éléments à afficher. Utilisez un nombre plus faible lorsque vous souhaitez une fin d’article soignée, ou augmentez-le lorsque votre blog contient du contenu complémentaire solide et que vous souhaitez encourager une consultation plus approfondie.

Définir le nombre sur 0 affiche tous les éléments disponibles jusqu’à la limite de la section. Cela peut très bien fonctionner pour les petits blogs, mais sur les blogs plus volumineux, cela peut allonger la section et réduire l’impact de chaque carte.

Paramètres de mise en page

Utilisez ces paramètres pour contrôler le nombre d’articles associés affichés par ligne et si chaque appareil utilise une grille ou un diaporama. C’est ici que vous pouvez principalement façonner la facilité avec laquelle la section se parcourt sur ordinateur, tablette et mobile.

Un nombre plus élevé de colonnes peut afficher davantage d’articles à l’écran, mais cela fonctionne généralement mieux lorsque les cartes sont visuellement simples. Si les titres ou extraits de vos articles sont longs, moins de colonnes créent généralement une mise en page plus nette et plus lisible.

La tablette peut hériter du nombre de colonnes du bureau lorsqu’elle est laissée sur 0. Cela est utile lorsque vous souhaitez moins d’ajustements spécifiques aux appareils, mais il reste pertinent de vérifier les tailles d’écran moyennes si vos cartes contiennent beaucoup de texte.

Astuce

Pour des cartes d’articles riches en texte, moins de colonnes améliorent généralement la lisibilité et facilitent la lecture rapide des titres.

Paramètres du diaporama

Lorsqu’un appareil est réglé sur le diaporama, ces contrôles gèrent l’animation, la lecture automatique, la boucle, la navigation, la pagination et les aperçus des diapositives. Consultez documentation Company XYZ sur les contrôles du diaporama.

L’animation par défaut est le choix le plus flexible lorsque vous souhaitez une expérience de carrousel typique. Le fondu crée une présentation plus ciblée, mais il simplifie la mise en page et supprime certaines options de l’interface.

La lecture automatique peut ajouter du mouvement, mais elle fonctionne mieux lorsque les articles associés sont une fonctionnalité secondaire plutôt que l’appel à l’action principal. Si les lecteurs sont susceptibles de comparer les titres avant de cliquer, une lecture automatique plus lente ou une navigation manuelle est généralement plus simple à utiliser.

La navigation et la pagination sont surtout utiles lorsque vous affichez plusieurs éléments en mode diaporama et que vous souhaitez indiquer aux lecteurs qu’un autre contenu est disponible. Les aperçus des diapositives peuvent également encourager l’interaction, surtout sur mobile, mais ils ne s’appliquent pas avec l’animation par fondu.

L’animation par fondu impose une mise en page à une seule diapositive et n’affiche ni pagination ni aperçus des diapositives suivantes.

Paramètres de couleur

Ces paramètres vous permettent de remplacer les couleurs de l’icône, du texte et du sous-titre de la section sans modifier les styles globaux du thème. Ils sont particulièrement utiles lorsque cette section se trouve sur un arrière-plan personnalisé ou a besoin d’un contraste plus fort que la page d’article environnante.

Conservez une zone de titre visuellement distincte des cartes d’articles situées en dessous. Si vous modifiez aussi les couleurs des cartes ou ajoutez un arrière-plan de section, vérifiez que chaque élément de texte reste facile à lire.

Paramètres standard de section

Paramètres d’en-tête

Utilisez les paramètres d’en-tête partagés pour ajouter un titre, une légende, un sous-titre, une icône et un bouton facultatif à cette section. Consultez documentation Company XYZ sur les paramètres d’en-tête.

Cet en-tête est utile lorsque les articles associés apparaissent bien en dessous du corps de l’article et ont besoin d’une introduction plus claire. Un titre court et un bref texte d’accompagnement suffisent généralement, tandis que le bouton facultatif convient bien pour créer un lien vers le blog complet.

Paramètres de carte

Utilisez les paramètres de carte partagés pour contrôler l’apparence de chaque carte d’article associé, y compris le style, le ratio d’image, l’affichage du texte, le contenu de la légende et le style de l’appel à l’action de la carte. Consultez documentation Company XYZ sur les paramètres de carte.

Ces remplacements sont utiles lorsque les cartes d’articles ont besoin d’un aspect plus éditorial que les cartes utilisées ailleurs. Les cartes de type bannière prennent en charge les choix de superposition et de position du texte, tandis que les styles de carte plus simples sont souvent plus faciles à parcourir dans des grilles plus denses.

Paramètres d’espacement

Utilisez les paramètres d’espacement partagés pour ajuster l’espace au-dessus et au-dessous de la section. Consultez documentation Company XYZ sur les paramètres d’espacement.

Davantage d’espacement aide la zone des articles associés à se sentir comme une étape suivante distincte après l’article. Un espacement plus serré la relie visuellement au contenu situé au-dessus.

Paramètres d’arrière-plan de section

Utilisez les paramètres d’arrière-plan de section partagés pour ajouter une couleur, un dégradé, une image ou une vidéo derrière la section. Consultez documentation Company XYZ sur les paramètres d’arrière-plan de section.

Un arrière-plan peut aider à distinguer les articles associés du corps de l’article, en particulier sur les pages longues. Si vous utilisez un arrière-plan média, assurez-vous que l’en-tête et les cartes d’articles ressortent toujours clairement.

Attention

Les arrière-plans marqués peuvent entrer en concurrence avec les miniatures et les titres des articles. Si la lisibilité diminue, simplifiez l’arrière-plan ou augmentez le contraste.

Paramètres de séparateur

Utilisez les paramètres de séparateur partagés pour ajouter une ligne au-dessus ou en dessous de la section. Consultez documentation Company XYZ sur les paramètres de séparateur.

Les séparateurs sont utiles lorsque cette section se trouve près des commentaires, des inscriptions à la newsletter ou d’autres zones de contenu, et que vous souhaitez une séparation visuelle plus nette. Dans la plupart des mises en page éditoriales, une simple ligne suffit.

Paramètres de visibilité

Utilisez les paramètres de visibilité partagés pour contrôler si la section apparaît sur ordinateur, mobile ou les deux. Consultez documentation Company XYZ sur les paramètres de visibilité.

C’est utile lorsque vous souhaitez une expérience de contenu associé plus riche sur les grands écrans, mais une fin d’article plus simple sur les écrans plus petits. Cela peut aussi prendre en charge d’autres mises en page mobiles dans le reste du modèle.

Paramètres de largeur

Utilisez les paramètres de largeur partagés pour contrôler la largeur du contenu et la largeur extérieure de la section. Consultez documentation Company XYZ sur les paramètres de largeur.

Des mises en page plus larges peuvent afficher confortablement plus de cartes en mode grille, tandis que des mises en page plus étroites donnent souvent une impression plus soignée et sont plus faciles à parcourir après un long article. Si vous modifiez les largeurs, prévisualisez la page en direct ainsi que l’éditeur pour juger l’espacement avec précision.

Notes d’utilisation

1. Gardez un nombre ciblé. N’affichez que le nombre d’articles que les lecteurs peuvent parcourir confortablement à la fin d’un article.
   1. Des nombres très élevés peuvent rendre la section répétitive ou excessivement longue.
   2. Des nombres plus faibles fonctionnent généralement mieux lorsque les articles associés ne sont qu’une suggestion de clôture.
2. Adaptez la mise en page au contenu. Utilisez la grille pour une comparaison rapide et le diaporama lorsque l’espace est limité ou que vous souhaitez un parcours de consultation plus guidé.
   1. Vérifiez les vues ordinateur et mobile, car les mises en page de type curseur peuvent modifier le comportement de la navigation, de la pagination, des aperçus et des points d’arrêt.
   2. Vérifiez l’alignement et la visibilité sur chaque viewport si vous mélangez différents paramètres d’appareil.
3. Choisissez le fondu volontairement. Utilisez le fondu uniquement lorsque vous souhaitez une carte mise en avant à la fois et que vous n’avez pas besoin d’aperçus ni de pagination.
4. Donnez la priorité à des cartes lisibles. Si les titres sont longs, réduisez le nombre de colonnes ou simplifiez le texte de la carte afin que chaque article soit facile à comprendre rapidement.
5. Utilisez la séparation avec précaution. Les arrière-plans, l’espacement et les séparateurs doivent aider la section à se distinguer sans éclipser l’article lui-même.
   1. Laissez les couleurs et les arrière-plans discrets lorsque vous souhaitez que la section hérite de l’apparence par défaut de la page.
   2. Utilisez des remplacements plus marqués uniquement lorsque vous devez faire ressortir la zone des articles associés du corps de l’article.
6. Vérifiez la source des articles. Les articles que vous voyez dépendent du blog actuel et des résultats associés disponibles, de sorte que les blogs peu fournis peuvent produire un ensemble d’articles plus court ou moins varié.
   1. Si vous utilisez des médias distincts selon l’appareil, vérifiez le recadrage, la lisibilité et le comportement de repli sur les deux tailles.
   2. Confirmez que toute navigation ou tout choix de source de contenu conduit bien les lecteurs vers les articles attendus.