Tutoriel Kadence : Utiliser Kadence Blocks Pro pour créer rapidement des mises en page graphiques en colonnes

Le contenu fractionné est un type de page web très courant.typographiqueForme, généralement d'un c?té des images affichées, de l'autre c?té du contenu textuel affiché, la structure de la page est claire, l'accent est mis sur l'aspect visuel.

Image [1]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées

Bien que l'option par défaut WordPress L'éditeur de blocs ne prend pas en charge cette disposition, mais l'utilisation de la fonction Kadence Blocks Pro pour obtenir rapidement cet effet.

Image [2]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées

Insérer et définir le bloc de fractionnement du contenu

  • Ouvrez la page d'édition et ajoutez Fractionnement du contenu blocs
Image [3]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Définir les principaux paramètres, notamment l'ordre des graphiques, la largeur du contenu, etc.
Image [4]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Téléchargement ou sélection d'images dans la zone d'image
Image [5]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Ajouter un titre et un corps à une zone de texte
Image [6]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
Image [7]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Définition de la couleur d'arrière-plan des images et des sections de texte
Image [8]-Tutoriel Kadence Blocks : Créer des colonnes graphiques avec la mise en page superposée
  • Ajuster l'alignement vertical du contenu dans les blocs (haut, centre, bas)
Image [9]-Tutoriel Kadence Blocks : Créer des colonnes graphiques avec une mise en page superposée
  • Définit l'alignement général de l'ensemble du bloc de contenu fractionné (gauche, centre, droite).
Image [10]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Sauvegarder et prévisualiser la page d'accueil
Image [11]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées

Réglage de l'effet de superposition (superposition graphique)

Le bloc Split Content permet de faire se chevaucher des sections graphiques et textuelles afin de créer un aspect plus dynamique.typographiqueForme.

Image [12]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées

Les étapes sont les suivantes :

  • Insérer un Disposition des lignes Conteneur, mis en page sur une seule colonne
  • Ajout d'un bloc de contenu fractionné à une ligne
Image [13]-Tutoriel Kadence Blocks : Création de colonnes graphiques et de dispositions superposées
  • Définissez la couleur d'arrière-plan de la rangée comme vous le souhaitez, ou définissez-la en pleine largeur.
Image [14]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées
  • Ajustement de la gauche et de la droite dans les paramètres de contenu divisé Marges négatives (marges négatives)Pour que la partie texte se superpose à l'image
Image [15]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées
  • Ajouter des ombres au contenu si nécessaire pour améliorer la hiérarchie visuelle
Image [16]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées
  • Ajuster l'espace occupé par le contenu en réduisant la hauteur minimale (Min Height).
Image [17]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées
  • Ajuster les marges et l'espacement dans les différentes vues de l'appareil pour assurer l'équilibre visuel
Image [18]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées

réactifParamètres d'optimisation

Le bloc "Split Content" prend en charge un style indépendant pour les téléphones mobiles et les tablettes :

  • Basculer vers le mobile en bas de l'éditeurvueDéfinition des marges intérieures et extérieures appropriées
Image [19]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions de superposition
  • Passer à l'affichage à plat pour affiner la mise en page du contenu et les espaces blancs
Image [20]-Tutoriel Kadence Blocks : création de colonnes graphiques et de dispositions superposées
  • Vérifier la présentation sur toutes les tailles d'appareils et procéder aux ajustements nécessaires

résumés

Le bloc "Split Content" vous permet de créer rapidement des dispositions de colonnes graphiques communes sans complexité.ouverture (jargon des échecs)Fonctionnement. Idéal pour présenter des produits, des équipes et du contenu promotionnel. Combiné à la disposition en rangées et aux marges négatives, il est facile d'ajouter des couches et des variations à vos pages avec des graphiques et du texte qui se chevauchent.


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élicitations6213 partager (joies, avantages, privilèges, etc.) avec les autres
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires