Aller au contenu

Article de blog

Affiche un article de blog avec des produits liés facultatifs et des contrôles flexibles de mise en page de lecture.

Cette section affiche l’article complet et vous permet d’affiner son rendu sur la page. Pour le flux de travail plus large de l’éditeur de thème, consultez la documentation Shopify sur les sections et les blocs. Elle inclut également une fonctionnalité facultative de détecteur de produits qui repère les liens de produits dans l’article, affiche les produits correspondants dans une barre latérale et ajoute à ces liens un comportement de survol de carte produit intégré.

Utilisez les paramètres principaux pour décider si les produits liés doivent apparaître à côté de l’article. La barre latérale n’apparaît que lorsque la détection de produits est activée et que l’article contient des liens de produits correspondants.

L’en-tête de la barre latérale s’utilise mieux comme libellé contextuel plutôt que comme titre générique. Si vos articles suivent des formats précis comme des guides d’achat, des tutoriels ou des sélections cadeaux, adaptez l’en-tête pour que la barre latérale semble liée au contenu.

Ce contrôle de couleur propre à la section vous permet de remplacer la couleur du texte de la zone d’article. Il est particulièrement utile lorsque vous ajoutez un arrière-plan personnalisé ou que vous avez besoin d’un contraste différent du reste de la page.

Comme cette section est conçue pour une lecture longue, choisissez d’abord des couleurs de texte confortables. Des couleurs de marque subtiles peuvent convenir pour les accents, mais le corps du texte doit rester facile à lire sur l’ensemble de l’article.

Vérifiez le contraste du texte après avoir modifié les couleurs, surtout si vous utilisez aussi des images d’arrière-plan, des dégradés ou des superpositions.

Paramètres d’espacement contrôlent l’espace au-dessus et au-dessous du contenu de l’article. Utilisez-les pour créer une expérience de lecture plus calme ou pour resserrer la mise en page lorsque l’article se trouve entre d’autres sections importantes.

L’espacement sur ordinateur et sur mobile peut être ajusté séparément. C’est utile lorsque un espacement généreux sur ordinateur semble trop important sur des écrans plus petits.

Paramètres d’arrière-plan de section vous permettent d’ajouter une couleur, un dégradé, une image ou une vidéo derrière l’article. Ces options peuvent donner plus d’atmosphère aux pages éditoriales, mais elles doivent toujours favoriser une lecture confortable.

Les contrôles de superposition aident à préserver la lisibilité lorsque vous utilisez des arrière-plans en image ou en vidéo. Les médias d’arrière-plan spécifiques au mobile sont particulièrement utiles lorsque le visuel sur ordinateur est mal recadré ou paraît trop chargé sur les petits écrans.

Paramètres de séparateur ajoutent une ligne en haut ou en bas de la section. Utilisez-les lorsque l’article a besoin d’une séparation plus nette par rapport au contenu environnant.

Si vous ne souhaitez pas de couleur de séparateur personnalisée, la laisser transparente permet à la section de reprendre la couleur de bordure du thème. Cela maintient une séparation discrète et cohérente.

Paramètres de largeur contrôlent à la fois la largeur maximale du contenu de l’article et la largeur du conteneur de section. Pour la plupart des articles, la largeur du contenu a le plus d’impact sur la lisibilité.

Des largeurs de contenu plus étroites sont généralement plus faciles à parcourir pour les textes longs, tandis que des mises en page plus larges peuvent mieux convenir aux articles riches en images ou de style éditorial. La largeur de section compte surtout lorsque vous utilisez aussi un arrière-plan et que vous souhaitez qu’il dépasse la zone de contenu.

  1. Écrivez en pensant aux liens de produits. La barre latérale et le comportement de produit en ligne dépendent des liens de produits dans l’article, alors ajoutez-les là où ils soutiennent réellement le sujet.
  2. Attendez-vous à ce que la mise en page évolue avec les blocs. L’ajout de blocs peut modifier la part de la section pilotée par l’article lui-même par rapport au contenu des blocs, alors revérifiez l’équilibre une fois la page construite.
  3. Privilégiez des largeurs lisibles. Pour les articles riches en texte, utilisez une largeur de contenu qui garde des longueurs de ligne confortables plutôt que d’étirer l’article trop largement.
  4. Utilisez le style pour mettre l’article en valeur. La couleur de texte personnalisée, les arrière-plans et les séparateurs doivent encadrer le contenu sans lui faire concurrence.
  5. Passez en revue l’affichage mobile. Vérifiez l’espacement, le recadrage de l’arrière-plan et le contraste du texte sur les écrans plus petits afin que l’article reste facile à lire.
  6. Comparez les vues de l’éditeur et du site en ligne. Le comportement de prévisualisation peut différer de la page publiée, alors confirmez la mise en page, l’alignement et les choix de média sur la page finale avant de vous y fier.