Explication des blocs de données dynamiques de Blocksy 2 dans les boucles

existentBlocksy 2Les blocs de données dynamiques sont une fonctionnalité puissante qui offre une plus grande flexibilité lorsqu'elle est combinée à des mises en page circulaires. Qu'il s'agisse de blocs d'articles avancés, de blocs de taxonomie avancés ou de blocs deWooCommercedu bloc de collection de produits, les blocs de données dynamiques sont capables de rendre le contenu de la page plus vivant et plus riche. Dans cet article, nous expliquerons en détail comment les blocs de données dynamiques sont utilisés dans les boucles afin d'aider les concepteurs de sites web à exploiter pleinement le potentiel de Blocksy.

Image[1]-Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes

Application des blocs de données dynamiques dans les blocs d'articles avancés

L'utilisation des blocs de données dynamiques dans Advanced Post Block est très intuitive. Ouvrez la fenêtreGutenbergDans la vue en liste de l'éditeur, vous pouvez voir que chaque article se compose de plusieurs blocs de données dynamiques, qui affichent l'image vedette, le titre de l'article, la date de publication, etc., et sont encapsulés dans le bloc de modèle d'article (Post Template Block).

Image [2]-Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes

Le bloc Module article est chargé de générer une liste d'articles mise à jour dynamiquement sur la page. Les données de chaque article sont automatiquement extraites et complétées pour créer une présentation continue. En n'ajoutant le bloc de données dynamiques qu'une seule fois dans le modèle, tous les articles sont présentés de manière uniforme, ce qui améliore grandement l'efficacité. De nouvelles données peuvent également être ajoutées à tout moment lorsque des ajustements doivent être effectués, par exemple en ajoutant la date de publication sous chaque article.

Image [3]-Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes
Image [4] - Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes

Cette mise en page présente une structure et une relation claires entre les modules de contenu, ce qui permet de répondre à divers besoins en matière de conception de pages.

Création d'une mise en page couverte

Dans les Paramètres des blocs de données dynamiques, après avoir défini la source de données sur Image en vedette, vous pouvez passer au mode Affichage de la couverture. Lorsque l'affichage de la couverture est activé, vous pouvez superposer d'autres informations à l'image en vedette, telles que le titre, la date et les termes de classification.

Le processus d'exploitation comprend

  • Sélectionnez le bloc d'images dynamiques
  • Activer le mode d'affichage de la couverture
Image [5]-Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes
  • Glisser et déposer des blocs de données dynamiques tels que des titres, des dates, etc. dans la zone de couverture.
Image [6] - Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes
  • Adaptation du style typographique pour harmoniser la présentation générale

Cette mise en page de style couverture est parfaite pour les pages d'accueil de blogs, les pages de listes d'articles, les pages de présentation de travaux et d'autres scénarios dans lesquels vous devez mettre en évidence des éléments visuels pour rendre la page plus attrayante.

Applications de blocs de données dynamiques dans des blocs circulaires tiers

afin deWooCommercePar exemple, le bloc de collection Produits est utilisé par défaut.GutenbergLes blocs de base intégrés, tels que les images et les légendes, qui présentent des limites en termes de style et de fonctionnalité.

Image [7] - Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes

Le bloc de données dynamiques peut remplacer directement le bloc par défaut, qui reconnaît automatiquement l'environnement actuel et extrait les données appropriées, par exemple :

  • Photos du produit
  • Titre du produit
  • Prix du produit
  • Évaluations des produits
  • État des stocks
  • SKU No.

Après l'avoir remplacé, vous pouvez personnaliser le titre du produit de l'applicationHTMLLa structure des étiquettes, le réglage du rapport d'aspect des images vedettes et le contrôle libre de l'ordre des éléments de données permettent d'enrichir encore l'affichage de la page.

Image [8]-Blocksy 2 Dynamic Data Block Loop Guide d'application : Créer des mises en page flexibles et polyvalentes

Grâce à l'utilisation flexible des blocs de données dynamiques, vous pouvez obtenir un effet de conception plus raffiné sans augmenter la complexité et rendre la présentation du contenu du site web plus professionnelle et plus ordonnée.

résumés

Blocksy 2L'application de blocs de données dynamiques dans la structure en boucle élargit considérablement la liberté de mise en page. Qu'il s'agisse d'une liste d'articles standard ou de l'affichage d'une collection de produits complexe, les blocs de données dynamiques peuvent être facilement adaptés à différents scénarios. Grâce à la combinaison du mode couverture et des blocs circulaires tiers, le pouvoir d'expression du contenu du site web a été considérablement amélioré.

Mises à jour récentes


Contactez nous
Vous n'arrivez pas à lire le tutoriel ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
Service clientèle WeChat
Service clientèle WeChat
Tel : 020-2206-9892
QQ咨询:1025174874
(iii) Courriel : info@361sale.com
Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
© Déclaration de reproduction
Cet article a été écrit par : les voleurs seront des souris et des rats.
LA FIN
Si vous l'aimez, soutenez-le.
félicitations4734 partager (joies, avantages, privilèges, etc.) avec les autres
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires