<\/span>Qu'est-ce qu'un bloc ?<\/span><\/h2>\n\n\n\nLes blocs Gutenberg WordPress sont des unit\u00e9s de construction du site Web. Chacun d'eux a sa propre place et son propre but. Il est tr\u00e8s important d'utiliser le bon bloc WordPress pour un certain type de contenu.<\/p>\n\n\n\n
Mais comment trouvez-vous le bloc le plus appropri\u00e9 qui correspond \u00e0 votre intention\u00a0?<\/p>\n\n\n\n
Pour vous aider \u00e0 mieux comprendre les blocs WordPress, nous avons pr\u00e9par\u00e9 cet aper\u00e7u des plus populaires.<\/p>\n\n\n\n
<\/span>Blocs de contenu textuel<\/span><\/h2>\n\n\n\nIl existe plusieurs blocs que vous pouvez utiliser pour ins\u00e9rer du contenu textuel sur votre site Web. Vous pouvez utiliser plusieurs blocs. \u00c0 partir de WordPress 5.4, il y a un nouveau param\u00e8tre, vous pouvez changer la couleur du texte.<\/p>\n\n\n\n
\n- Paragraphe<\/li>\n\n\n\n
- Titre<\/li>\n\n\n\n
- Citation<\/li>\n\n\n\n
- Liste<\/li>\n\n\n\n
- Pullquote<\/li>\n\n\n\n
- Tableau<\/li>\n\n\n\n
- Verset<\/li>\n\n\n\n
- Pr\u00e9format\u00e9<\/li>\n<\/ul>\n\n\n\n
![\"Format](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2020\/03\/Text-Color-Format-WordPress-5.4.png\")
<\/a><\/figure>\n<\/div>\n\n\nSauf cela, vous utilisez le bloc Classic qui peut \u00eatre plus pratique pour un long paragraphe.<\/p>\n\n\n\n
<\/span>Bloc de boutons<\/span><\/h2>\n\n\n\nCr\u00e9er un bouton CTA convaincant dans WordPress est devenu super facile avec le bloc de boutons. Vous n'avez pas besoin d'entrer un CSS personnalis\u00e9 ou de comprendre le HTML. Vous pouvez \u2013 mais vous n'\u00eates pas oblig\u00e9 \u2013 saisir le code hexad\u00e9cimal de votre couleur pr\u00e9f\u00e9r\u00e9e pour que le bouton soit beau et accrocheur.<\/p>\n\n\n\n
![\"Bouton](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/07\/BE-Button.jpg\")
<\/a><\/h4>\n\n\n\n<\/span>O\u00f9 utiliser le bloc de boutons\u00a0?<\/span><\/h3>\n\n\n\nUne fois que le visiteur Web arrive sur votre site Web, vous voulez l'encourager \u00e0 agir. C'est \u00e0 cela que servent les boutons CTA.<\/p>\n\n\n\n
En g\u00e9n\u00e9ral, il y a 3 endroits o\u00f9 vous devez utiliser le bloc WordPress Button :<\/p>\n\n\n\n
\n- Page d'accueil - pour effectuer une action qui vous permettra d'atteindre votre objectif, comme vous inscrire \u00e0 la newsletter, d\u00e9couvrir une offre sp\u00e9ciale ou vous inscrire pour un essai gratuit.<\/li>\n\n\n\n
- Page produit - selon la mani\u00e8re dont votre page produit est dirig\u00e9e, il peut y avoir 1 bouton CTA (ACHETER) ou plusieurs boutons, par exemple les d\u00e9tails du produit, acheter, ajouter \u00e0 la liste de souhaits, etc.<\/li>\n\n\n\n
- Blog \u2013 Les boutons CTA peuvent faire r\u00e9f\u00e9rence \u00e0 un autre article utile ou \u00e0 l'achat de votre produit\/service.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc de boutons<\/span><\/h3>\n\n\n\nDans Inspector, sur le c\u00f4t\u00e9 droit, vous pouvez facilement g\u00e9rer les param\u00e8tres de votre bouton\u00a0:<\/p>\n\n\n\n
\n- Style<\/li>\n\n\n\n
- Couleur de l'arri\u00e8re plan<\/li>\n\n\n\n
- Couleur de la police<\/li>\n\n\n\n
- Fronti\u00e8re<\/li>\n<\/ul>\n\n\n\n
Le texte \u00e9crit dans votre bouton CTA doit \u00eatre court et simple, encourageant l'action que vous souhaitez que vos visiteurs Web entreprennent.<\/p>\n\n\n\n
Nouvelles \u00e0 venir dans la prochaine version de WordPress 5.4 (sortie le 31 mars 2020)<\/strong><\/p>\n\n\n\nLe bloc de boutons va \u00eatre remplac\u00e9 par un nouveau boutons<\/strong> bloc.
Vous pouvez supposer \u00e0 partir du nouveau nom que vous pourrez cr\u00e9er plus de boutons \u00e0 c\u00f4t\u00e9 un par un dans un conteneur de blocs. Il est souvent n\u00e9cessaire de cr\u00e9er deux CTA \u00e0 la fois, par exemple\u00a0: Acheter maintenant et Lire la suite. En outre, de nouveaux param\u00e8tres de style et de couleur sont \u00e0 venir. Choisissez le style de remplissage ou de contour, puis la couleur de l'arri\u00e8re-plan. Vous pouvez choisir un arri\u00e8re-plan uni ou d\u00e9grad\u00e9. Certains pr\u00e9r\u00e9glages comme point de d\u00e9part seront disponibles pour un r\u00e9glage plus facile. La bonne nouvelle est que tous les blocs de boutons existants fonctionneront et qu'il n'est pas n\u00e9cessaire de les migrer.<\/p>\n\n\n\n![\"\"](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2020\/03\/WordPress-5.4-Buttons-block-1024x554.png\")
<\/a><\/figure>\n<\/div>\n\n\n<\/span>Bloc de colonnes<\/span><\/h2>\n\n\n\nLe bloc de colonnes est un bloc WordPress incroyable qui ouvre les portes \u00e0 de nouvelles mises en page. Il vous offre plus d'options d'agencement des \u00e9l\u00e9ments de page, ce qui se traduit par davantage d'alternatives de conception.<\/p>\n\n\n
\n![\"Bloc](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/BE-Columns.jpg\")
<\/a><\/figure>\n<\/div>\n\n\nTravailler avec le bloc Colonnes est facile\u00a0:<\/p>\n\n\n\n
\n- Aucune installation de plug-in suppl\u00e9mentaire.<\/li>\n\n\n\n
- Aucun codage requis.<\/li>\n\n\n\n
- Tout ce dont vous avez besoin est un peu de sens pour un design soign\u00e9.<\/li>\n<\/ul>\n\n\n\n
Par rapport aux tracas pr\u00e9c\u00e9dents que vous deviez traverser avant la sortie de l'\u00e9diteur de blocs WordPress, il est tr\u00e8s simple d'utiliser le bloc Colonnes WordPress.<\/p>\n\n\n\n
<\/span>Comment utiliser le bloc Colonnes\u00a0?<\/span><\/h3>\n\n\n\nComme indiqu\u00e9 ci-dessus, il existe 2 fa\u00e7ons d'utiliser le bloc Colonnes\u00a0:<\/p>\n\n\n\n
\n- Pour organiser le flux de vos textes (dans un article de blog ou sur la page habituelle).<\/li>\n\n\n\n
- Pour organiser d'autres blocs en colonnes.<\/li>\n<\/ul>\n\n\n\n
Lorsque vous organisez du texte en colonnes, par exemple dans un article de blog, vous augmentez la lisibilit\u00e9 et rendez votre site Web plus transparent et convivial.<\/p>\n\n\n\n
Cependant, lorsque vous utilisez le bloc Colonnes pour imbriquer d'autres blocs, tels que des images, des textes et des boutons, vous modifiez toute la mise en page de la page que vous avez choisie et cr\u00e9ez de nouveaux mod\u00e8les.<\/p>\n\n\n\n
<\/span>Param\u00e8tres du bloc de colonnes<\/span><\/h3>\n\n\n\nApr\u00e8s avoir ins\u00e9r\u00e9 un bloc Colonne sur la page, choisissez le nombre de colonnes que vous souhaitez. Il peut s'agir de n'importe quel montant de 2 \u00e0 6 colonnes. Ensuite, vous pouvez commencer \u00e0 taper votre texte ou \u00e0 ajouter des blocs dans chaque colonne.<\/p>\n\n\n\n
L'alignement du contenu de votre bloc de colonnes peut \u00eatre d\u00e9fini s\u00e9par\u00e9ment pour l'ensemble du bloc ainsi que pour des colonnes individuelles. Vous pouvez m\u00eame choisir la proportion de la largeur de la colonne. De cette fa\u00e7on, une colonne peut \u00eatre plus large qu'une autre.<\/p>\n\n\n\n
<\/span>Bloc de couverture<\/span><\/h2>\n\n\n\nParlons de l'en-t\u00eate de votre site Web. C'est une section qui d\u00e9finit la premi\u00e8re impression quand quelqu'un vient sur votre page d'accueil. Un peu important, n'est-ce pas ? Et saviez-vous que le bloc Couverture peut \u00eatre utilis\u00e9 comme en-t\u00eate sur n'importe laquelle de vos pages\u00a0?<\/p>\n\n\n
\n![\"Couvrir](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/09\/BE-Cover.jpg\")
<\/a><\/figure>\n<\/div>\n\n\nCover est le c\u0153ur des blocs WordPress qui vous aide \u00e0 impressionner vos visiteurs Web. Surtout lorsqu'il est utilis\u00e9 correctement, ou mieux, lorsqu'il est parfaitement int\u00e9gr\u00e9 \u00e0 votre conception Web.<\/p>\n\n\n\n
<\/span>O\u00f9 utiliser le bloc Cover ?<\/span><\/h3>\n\n\n\nComme mentionn\u00e9 ci-dessus, le bloc de couverture peut \u00eatre utilis\u00e9 sur n'importe laquelle de vos pages. De plus, il peut \u00eatre ajout\u00e9 n'importe o\u00f9 sur la page, contrairement \u00e0 l'en-t\u00eate de votre site Web qui est fix\u00e9 en haut de votre site Web.<\/p>\n\n\n\n
Le bloc de couverture peut \u00eatre utilis\u00e9 comme\u00a0:<\/p>\n\n\n\n
\n- En-t\u00eate de n'importe quelle page, y compris la page d'accueil.<\/li>\n\n\n\n
- Image ou vid\u00e9o \u00e9cras\u00e9e par le texte utilis\u00e9 sur la page du produit.<\/li>\n\n\n\n
- S\u00e9parateur de contenu dans l'article de blog.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc de couverture<\/span><\/h3>\n\n\n\nLa configuration de votre bloc de couverture est tr\u00e8s simple. Tout d'abord, choisissez une image ou une vid\u00e9o comme arri\u00e8re-plan. Vous pouvez \u00e9galement utiliser une seule couleur \u00e0 la place. Lorsque vous avez d\u00e9fini votre arri\u00e8re-plan, ajoutez un titre et un sous-titre. <\/strong><\/p>\n\n\n\nVous pouvez choisir l'alignement du bloc et, bien s\u00fbr, l'alignement du texte \u00e0 l'int\u00e9rieur.<\/p>\n\n\n\n
L'alignement du bloc de couverture offre les options suivantes\u00a0:<\/p>\n\n\n\n
\n- Alignez \u00e0 gauche<\/li>\n\n\n\n
- Aligner le centre<\/li>\n\n\n\n
- Aligner \u00e0 droite<\/li>\n\n\n\n
- Grande largeur<\/li>\n\n\n\n
- Pleine largeur<\/li>\n<\/ul>\n\n\n\n
Mon pr\u00e9f\u00e9r\u00e9 est la superposition de couleurs disponible dans l'inspecteur - l'image d'arri\u00e8re-plan du bloc de couverture peut \u00eatre teint\u00e9e de la couleur de votre choix. Avec la taille et la couleur de police personnalis\u00e9es, vous pouvez cr\u00e9er de beaux contrastes et l'aspect final de votre bloc de couverture sera \u00e9tonnant.<\/p>\n\n\n\n
\u00c0 partir de WordPress 5.4, vous pouvez choisir le fond d\u00e9grad\u00e9 au lieu d'un fond uni.<\/strong><\/p>\n\n\n\n![\"Couvrir](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2020\/03\/Cover-block-gradient-background-WordPress-5.4--1024x337.png\")
<\/a><\/figure>\n<\/div>\n\n\n<\/span>Bloc Galerie<\/span><\/h2>\n\n\n\nPr\u00e9sentez des images sur votre site Web \u00e0 l'aide du bloc Galerie. Ce bloc WordPress standard a \u00e9t\u00e9 con\u00e7u pour contenir vos images et les afficher joliment sur n'importe quelle page de votre site Web. Comme pour les autres blocs WordPress, le bloc Galerie peut \u00eatre positionn\u00e9 n'importe o\u00f9 sur le site Web ou dans l'article de blog.<\/p>\n\n\n
\n![\"Bloc](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/07\/BE-Gallery.jpg\")
<\/a><\/figure>\n<\/div>\n\n\nLe t\u00e9l\u00e9chargement de vos images peut \u00eatre effectu\u00e9 en choisissant des fichiers dans la m\u00e9diath\u00e8que, depuis votre ordinateur ou en utilisant la fonction glisser-d\u00e9poser.<\/p>\n\n\n\n
<\/span>O\u00f9 utiliser le bloc Galerie\u00a0?<\/span><\/h3>\n\n\n\nSelon le type de votre site Web, vous souhaiterez peut-\u00eatre cr\u00e9er une galerie de photos complexe ou une simple pr\u00e9sentation d'images. Vous pouvez utiliser le bloc Galerie sur\u00a0:<\/p>\n\n\n\n
\n- Votre page d'accueil<\/li>\n\n\n\n
- Sous-pages individuelles cr\u00e9\u00e9es en tant qu'albums de votre galerie de photos<\/li>\n\n\n\n
- Fiches produits<\/li>\n\n\n\n
- Article de blog<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc Galerie<\/span><\/h3>\n\n\n\nOutre les diff\u00e9rentes options d'alignement du bloc Galerie lui-m\u00eame, il existe quelques options int\u00e9ressantes dans ce bloc, telles que\u00a0:<\/p>\n\n\n\n
\n- Nombre de colonnes dans lesquelles les images sont align\u00e9es.<\/li>\n\n\n\n
- Recadrage de l'image pour correspondre \u00e0 la m\u00eame taille (de la plus petite image).<\/li>\n\n\n\n
- Lien hypertexte pour vous donner la possibilit\u00e9 de cr\u00e9er un lien vers une autre page ou un autre fichier multim\u00e9dia.<\/li>\n<\/ul>\n\n\n\n
<\/span>Bloc d'images<\/span><\/h2>\n\n\n\nLe bloc d'image n'est rien d'autre que le bloc pour afficher une image sur votre site Web.<\/p>\n\n\n
\n![\"Bloc](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/BE-Image.jpg\")
<\/a><\/figure>\n<\/div>\n\n\nC'est exact. Si vous souhaitez simplement ajouter une image \u00e0 l'une de vos pages, vous devez utiliser le bloc Image WordPress. Il peut \u00eatre similaire aux autres blocs pr\u00e9sent\u00e9s, mais il existe des diff\u00e9rences significatives qui le rendent parfait pour les images uniques.<\/p>\n\n\n\n
<\/span>Quand utiliser le bloc Image\u00a0?<\/span><\/h3>\n\n\n\nLe bloc d'image doit \u00eatre utilis\u00e9 en particulier lorsque l'objet affich\u00e9 sur l'image est particuli\u00e8rement important pour votre visiteur Web que vous souhaitez\u00a0:<\/p>\n\n\n\n
\n- Attirez l'attention du visiteur Web avec une image sp\u00e9cifique.<\/li>\n\n\n\n
- Afficher l'image avec l\u00e9gende.<\/li>\n\n\n\n
- Affichez des infographies qui aident les visiteurs \u00e0 mieux comprendre le sujet abord\u00e9.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc d'images<\/span><\/h3>\n\n\n\nL'un des plus grands avantages du bloc Image WordPress est ses options de taille d'image. Vous pouvez facilement redimensionner une image en la tirant par son coin, choisir une taille fixe en pixels ou d\u00e9finir la taille en pourcentage.<\/p>\n\n\n\n
Une autre option importante est les champs de saisie pour le texte alternatif, la l\u00e9gende et le lien. Je recommande fortement d'utiliser ces champs car ils jouent un r\u00f4le important dans le r\u00e9f\u00e9rencement sur la page.<\/p>\n\n\n\n
<\/span>M\u00e9dia et bloc de texte<\/span><\/h2>\n\n\n\nPassons \u00e0 des mises en page plus avanc\u00e9es que vous pouvez cr\u00e9er \u00e0 l'aide du bloc M\u00e9dia et texte. Ce bloc principal de WordPress vous permet de combiner des m\u00e9dias et du texte c\u00f4te \u00e0 c\u00f4te, d'une mani\u00e8re esth\u00e9tique et contextuelle.<\/p>\n\n\n
\n![\"Bloc](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/BE-MediaText.jpg\")
<\/a><\/figure>\n<\/div>\n\n\n<\/span>O\u00f9 utiliser le bloc m\u00e9dia et texte\u00a0?<\/span><\/h3>\n\n\n\nBien que le bloc M\u00e9dia et texte soit le plus appropri\u00e9 pour une utilisation dans les articles de blog, avec un peu d'imagination, vous pouvez \u00e9galement l'utiliser ailleurs. Par exemple, vous pouvez cr\u00e9er un bel aper\u00e7u du produit ou du service en utilisant une image et du texte c\u00f4te \u00e0 c\u00f4te.<\/p>\n\n\n\n
N'oubliez pas d'ajouter un bloc Bouton \u00e0 la section de texte du bloc M\u00e9dias et texte, s'il est utilis\u00e9 comme aper\u00e7u du produit\/service. De cette fa\u00e7on, vous pouvez concevoir une belle section CTA sur n'importe quelle page.<\/p>\n\n\n\n
<\/span>Avantages des m\u00e9dias et du bloc de texte<\/span><\/h3>\n\n\n\n\n- Rassembler l'image et le texte qui correspondent contextuellement les uns aux autres.<\/li>\n\n\n\n
- \u00c9viter les erreurs d'image dans le blogpost.<\/li>\n\n\n\n
- Aide \u00e0 la r\u00e9activit\u00e9 du site (utilisez la fonction "Stack on mobile").<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres des m\u00e9dias et des blocs de texte<\/span><\/h3>\n\n\n\nLorsque vous regardez le r\u00e9glage du bloc M\u00e9dia et texte, vous remarquerez plusieurs options d'alignement, certaines d'entre elles sont uniques, par rapport \u00e0 la plupart des autres blocs.<\/p>\n\n\n\n
Le r\u00e9glage int\u00e9ressant et utile de ce bloc est la couleur d'arri\u00e8re-plan. En colorant la zone autour de l'image et du texte qui s'embo\u00eetent, vous pouvez visuellement mettre en \u00e9vidence leur connexion.<\/p>\n\n\n
Il existe plusieurs blocs que vous pouvez utiliser pour ins\u00e9rer du contenu textuel sur votre site Web. Vous pouvez utiliser plusieurs blocs. \u00c0 partir de WordPress 5.4, il y a un nouveau param\u00e8tre, vous pouvez changer la couleur du texte.<\/p>\n\n\n\n
- \n
- Paragraphe<\/li>\n\n\n\n
- Titre<\/li>\n\n\n\n
- Citation<\/li>\n\n\n\n
- Liste<\/li>\n\n\n\n
- Pullquote<\/li>\n\n\n\n
- Tableau<\/li>\n\n\n\n
- Verset<\/li>\n\n\n\n
- Pr\u00e9format\u00e9<\/li>\n<\/ul>\n\n\n\n<\/a><\/figure>\n<\/div>\n\n\n
Sauf cela, vous utilisez le bloc Classic qui peut \u00eatre plus pratique pour un long paragraphe.<\/p>\n\n\n\n
<\/span>Bloc de boutons<\/span><\/h2>\n\n\n\n
Cr\u00e9er un bouton CTA convaincant dans WordPress est devenu super facile avec le bloc de boutons. Vous n'avez pas besoin d'entrer un CSS personnalis\u00e9 ou de comprendre le HTML. Vous pouvez \u2013 mais vous n'\u00eates pas oblig\u00e9 \u2013 saisir le code hexad\u00e9cimal de votre couleur pr\u00e9f\u00e9r\u00e9e pour que le bouton soit beau et accrocheur.<\/p>\n\n\n\n
<\/a><\/h4>\n\n\n\n<\/span>O\u00f9 utiliser le bloc de boutons\u00a0?<\/span><\/h3>\n\n\n\n
Une fois que le visiteur Web arrive sur votre site Web, vous voulez l'encourager \u00e0 agir. C'est \u00e0 cela que servent les boutons CTA.<\/p>\n\n\n\n
En g\u00e9n\u00e9ral, il y a 3 endroits o\u00f9 vous devez utiliser le bloc WordPress Button :<\/p>\n\n\n\n
- \n
- Page d'accueil - pour effectuer une action qui vous permettra d'atteindre votre objectif, comme vous inscrire \u00e0 la newsletter, d\u00e9couvrir une offre sp\u00e9ciale ou vous inscrire pour un essai gratuit.<\/li>\n\n\n\n
- Page produit - selon la mani\u00e8re dont votre page produit est dirig\u00e9e, il peut y avoir 1 bouton CTA (ACHETER) ou plusieurs boutons, par exemple les d\u00e9tails du produit, acheter, ajouter \u00e0 la liste de souhaits, etc.<\/li>\n\n\n\n
- Blog \u2013 Les boutons CTA peuvent faire r\u00e9f\u00e9rence \u00e0 un autre article utile ou \u00e0 l'achat de votre produit\/service.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc de boutons<\/span><\/h3>\n\n\n\n
Dans Inspector, sur le c\u00f4t\u00e9 droit, vous pouvez facilement g\u00e9rer les param\u00e8tres de votre bouton\u00a0:<\/p>\n\n\n\n
- \n
- Style<\/li>\n\n\n\n
- Couleur de l'arri\u00e8re plan<\/li>\n\n\n\n
- Couleur de la police<\/li>\n\n\n\n
- Fronti\u00e8re<\/li>\n<\/ul>\n\n\n\n
Le texte \u00e9crit dans votre bouton CTA doit \u00eatre court et simple, encourageant l'action que vous souhaitez que vos visiteurs Web entreprennent.<\/p>\n\n\n\n
Nouvelles \u00e0 venir dans la prochaine version de WordPress 5.4 (sortie le 31 mars 2020)<\/strong><\/p>\n\n\n\n
Le bloc de boutons va \u00eatre remplac\u00e9 par un nouveau boutons<\/strong> bloc.
Vous pouvez supposer \u00e0 partir du nouveau nom que vous pourrez cr\u00e9er plus de boutons \u00e0 c\u00f4t\u00e9 un par un dans un conteneur de blocs. Il est souvent n\u00e9cessaire de cr\u00e9er deux CTA \u00e0 la fois, par exemple\u00a0: Acheter maintenant et Lire la suite. En outre, de nouveaux param\u00e8tres de style et de couleur sont \u00e0 venir. Choisissez le style de remplissage ou de contour, puis la couleur de l'arri\u00e8re-plan. Vous pouvez choisir un arri\u00e8re-plan uni ou d\u00e9grad\u00e9. Certains pr\u00e9r\u00e9glages comme point de d\u00e9part seront disponibles pour un r\u00e9glage plus facile. La bonne nouvelle est que tous les blocs de boutons existants fonctionneront et qu'il n'est pas n\u00e9cessaire de les migrer.<\/p>\n\n\n\n<\/a><\/figure>\n<\/div>\n\n\n<\/span>Bloc de colonnes<\/span><\/h2>\n\n\n\n
Le bloc de colonnes est un bloc WordPress incroyable qui ouvre les portes \u00e0 de nouvelles mises en page. Il vous offre plus d'options d'agencement des \u00e9l\u00e9ments de page, ce qui se traduit par davantage d'alternatives de conception.<\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\nTravailler avec le bloc Colonnes est facile\u00a0:<\/p>\n\n\n\n
- \n
- Aucune installation de plug-in suppl\u00e9mentaire.<\/li>\n\n\n\n
- Aucun codage requis.<\/li>\n\n\n\n
- Tout ce dont vous avez besoin est un peu de sens pour un design soign\u00e9.<\/li>\n<\/ul>\n\n\n\n
Par rapport aux tracas pr\u00e9c\u00e9dents que vous deviez traverser avant la sortie de l'\u00e9diteur de blocs WordPress, il est tr\u00e8s simple d'utiliser le bloc Colonnes WordPress.<\/p>\n\n\n\n
<\/span>Comment utiliser le bloc Colonnes\u00a0?<\/span><\/h3>\n\n\n\n
Comme indiqu\u00e9 ci-dessus, il existe 2 fa\u00e7ons d'utiliser le bloc Colonnes\u00a0:<\/p>\n\n\n\n
- \n
- Pour organiser le flux de vos textes (dans un article de blog ou sur la page habituelle).<\/li>\n\n\n\n
- Pour organiser d'autres blocs en colonnes.<\/li>\n<\/ul>\n\n\n\n
Lorsque vous organisez du texte en colonnes, par exemple dans un article de blog, vous augmentez la lisibilit\u00e9 et rendez votre site Web plus transparent et convivial.<\/p>\n\n\n\n
Cependant, lorsque vous utilisez le bloc Colonnes pour imbriquer d'autres blocs, tels que des images, des textes et des boutons, vous modifiez toute la mise en page de la page que vous avez choisie et cr\u00e9ez de nouveaux mod\u00e8les.<\/p>\n\n\n\n
<\/span>Param\u00e8tres du bloc de colonnes<\/span><\/h3>\n\n\n\n
Apr\u00e8s avoir ins\u00e9r\u00e9 un bloc Colonne sur la page, choisissez le nombre de colonnes que vous souhaitez. Il peut s'agir de n'importe quel montant de 2 \u00e0 6 colonnes. Ensuite, vous pouvez commencer \u00e0 taper votre texte ou \u00e0 ajouter des blocs dans chaque colonne.<\/p>\n\n\n\n
L'alignement du contenu de votre bloc de colonnes peut \u00eatre d\u00e9fini s\u00e9par\u00e9ment pour l'ensemble du bloc ainsi que pour des colonnes individuelles. Vous pouvez m\u00eame choisir la proportion de la largeur de la colonne. De cette fa\u00e7on, une colonne peut \u00eatre plus large qu'une autre.<\/p>\n\n\n\n
<\/span>Bloc de couverture<\/span><\/h2>\n\n\n\n
Parlons de l'en-t\u00eate de votre site Web. C'est une section qui d\u00e9finit la premi\u00e8re impression quand quelqu'un vient sur votre page d'accueil. Un peu important, n'est-ce pas ? Et saviez-vous que le bloc Couverture peut \u00eatre utilis\u00e9 comme en-t\u00eate sur n'importe laquelle de vos pages\u00a0?<\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\nCover est le c\u0153ur des blocs WordPress qui vous aide \u00e0 impressionner vos visiteurs Web. Surtout lorsqu'il est utilis\u00e9 correctement, ou mieux, lorsqu'il est parfaitement int\u00e9gr\u00e9 \u00e0 votre conception Web.<\/p>\n\n\n\n
<\/span>O\u00f9 utiliser le bloc Cover ?<\/span><\/h3>\n\n\n\n
Comme mentionn\u00e9 ci-dessus, le bloc de couverture peut \u00eatre utilis\u00e9 sur n'importe laquelle de vos pages. De plus, il peut \u00eatre ajout\u00e9 n'importe o\u00f9 sur la page, contrairement \u00e0 l'en-t\u00eate de votre site Web qui est fix\u00e9 en haut de votre site Web.<\/p>\n\n\n\n
Le bloc de couverture peut \u00eatre utilis\u00e9 comme\u00a0:<\/p>\n\n\n\n
- \n
- En-t\u00eate de n'importe quelle page, y compris la page d'accueil.<\/li>\n\n\n\n
- Image ou vid\u00e9o \u00e9cras\u00e9e par le texte utilis\u00e9 sur la page du produit.<\/li>\n\n\n\n
- S\u00e9parateur de contenu dans l'article de blog.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc de couverture<\/span><\/h3>\n\n\n\n
La configuration de votre bloc de couverture est tr\u00e8s simple. Tout d'abord, choisissez une image ou une vid\u00e9o comme arri\u00e8re-plan. Vous pouvez \u00e9galement utiliser une seule couleur \u00e0 la place. Lorsque vous avez d\u00e9fini votre arri\u00e8re-plan, ajoutez un titre et un sous-titre. <\/strong><\/p>\n\n\n\n
Vous pouvez choisir l'alignement du bloc et, bien s\u00fbr, l'alignement du texte \u00e0 l'int\u00e9rieur.<\/p>\n\n\n\n
L'alignement du bloc de couverture offre les options suivantes\u00a0:<\/p>\n\n\n\n
- \n
- Alignez \u00e0 gauche<\/li>\n\n\n\n
- Aligner le centre<\/li>\n\n\n\n
- Aligner \u00e0 droite<\/li>\n\n\n\n
- Grande largeur<\/li>\n\n\n\n
- Pleine largeur<\/li>\n<\/ul>\n\n\n\n
Mon pr\u00e9f\u00e9r\u00e9 est la superposition de couleurs disponible dans l'inspecteur - l'image d'arri\u00e8re-plan du bloc de couverture peut \u00eatre teint\u00e9e de la couleur de votre choix. Avec la taille et la couleur de police personnalis\u00e9es, vous pouvez cr\u00e9er de beaux contrastes et l'aspect final de votre bloc de couverture sera \u00e9tonnant.<\/p>\n\n\n\n
\u00c0 partir de WordPress 5.4, vous pouvez choisir le fond d\u00e9grad\u00e9 au lieu d'un fond uni.<\/strong><\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\n<\/span>Bloc Galerie<\/span><\/h2>\n\n\n\n
Pr\u00e9sentez des images sur votre site Web \u00e0 l'aide du bloc Galerie. Ce bloc WordPress standard a \u00e9t\u00e9 con\u00e7u pour contenir vos images et les afficher joliment sur n'importe quelle page de votre site Web. Comme pour les autres blocs WordPress, le bloc Galerie peut \u00eatre positionn\u00e9 n'importe o\u00f9 sur le site Web ou dans l'article de blog.<\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\nLe t\u00e9l\u00e9chargement de vos images peut \u00eatre effectu\u00e9 en choisissant des fichiers dans la m\u00e9diath\u00e8que, depuis votre ordinateur ou en utilisant la fonction glisser-d\u00e9poser.<\/p>\n\n\n\n
<\/span>O\u00f9 utiliser le bloc Galerie\u00a0?<\/span><\/h3>\n\n\n\n
Selon le type de votre site Web, vous souhaiterez peut-\u00eatre cr\u00e9er une galerie de photos complexe ou une simple pr\u00e9sentation d'images. Vous pouvez utiliser le bloc Galerie sur\u00a0:<\/p>\n\n\n\n
- \n
- Votre page d'accueil<\/li>\n\n\n\n
- Sous-pages individuelles cr\u00e9\u00e9es en tant qu'albums de votre galerie de photos<\/li>\n\n\n\n
- Fiches produits<\/li>\n\n\n\n
- Article de blog<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc Galerie<\/span><\/h3>\n\n\n\n
Outre les diff\u00e9rentes options d'alignement du bloc Galerie lui-m\u00eame, il existe quelques options int\u00e9ressantes dans ce bloc, telles que\u00a0:<\/p>\n\n\n\n
- \n
- Nombre de colonnes dans lesquelles les images sont align\u00e9es.<\/li>\n\n\n\n
- Recadrage de l'image pour correspondre \u00e0 la m\u00eame taille (de la plus petite image).<\/li>\n\n\n\n
- Lien hypertexte pour vous donner la possibilit\u00e9 de cr\u00e9er un lien vers une autre page ou un autre fichier multim\u00e9dia.<\/li>\n<\/ul>\n\n\n\n
<\/span>Bloc d'images<\/span><\/h2>\n\n\n\n
Le bloc d'image n'est rien d'autre que le bloc pour afficher une image sur votre site Web.<\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\nC'est exact. Si vous souhaitez simplement ajouter une image \u00e0 l'une de vos pages, vous devez utiliser le bloc Image WordPress. Il peut \u00eatre similaire aux autres blocs pr\u00e9sent\u00e9s, mais il existe des diff\u00e9rences significatives qui le rendent parfait pour les images uniques.<\/p>\n\n\n\n
<\/span>Quand utiliser le bloc Image\u00a0?<\/span><\/h3>\n\n\n\n
Le bloc d'image doit \u00eatre utilis\u00e9 en particulier lorsque l'objet affich\u00e9 sur l'image est particuli\u00e8rement important pour votre visiteur Web que vous souhaitez\u00a0:<\/p>\n\n\n\n
- \n
- Attirez l'attention du visiteur Web avec une image sp\u00e9cifique.<\/li>\n\n\n\n
- Afficher l'image avec l\u00e9gende.<\/li>\n\n\n\n
- Affichez des infographies qui aident les visiteurs \u00e0 mieux comprendre le sujet abord\u00e9.<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres du bloc d'images<\/span><\/h3>\n\n\n\n
L'un des plus grands avantages du bloc Image WordPress est ses options de taille d'image. Vous pouvez facilement redimensionner une image en la tirant par son coin, choisir une taille fixe en pixels ou d\u00e9finir la taille en pourcentage.<\/p>\n\n\n\n
Une autre option importante est les champs de saisie pour le texte alternatif, la l\u00e9gende et le lien. Je recommande fortement d'utiliser ces champs car ils jouent un r\u00f4le important dans le r\u00e9f\u00e9rencement sur la page.<\/p>\n\n\n\n
<\/span>M\u00e9dia et bloc de texte<\/span><\/h2>\n\n\n\n
Passons \u00e0 des mises en page plus avanc\u00e9es que vous pouvez cr\u00e9er \u00e0 l'aide du bloc M\u00e9dia et texte. Ce bloc principal de WordPress vous permet de combiner des m\u00e9dias et du texte c\u00f4te \u00e0 c\u00f4te, d'une mani\u00e8re esth\u00e9tique et contextuelle.<\/p>\n\n\n
\n<\/a><\/figure>\n<\/div>\n\n\n<\/span>O\u00f9 utiliser le bloc m\u00e9dia et texte\u00a0?<\/span><\/h3>\n\n\n\n
Bien que le bloc M\u00e9dia et texte soit le plus appropri\u00e9 pour une utilisation dans les articles de blog, avec un peu d'imagination, vous pouvez \u00e9galement l'utiliser ailleurs. Par exemple, vous pouvez cr\u00e9er un bel aper\u00e7u du produit ou du service en utilisant une image et du texte c\u00f4te \u00e0 c\u00f4te.<\/p>\n\n\n\n
N'oubliez pas d'ajouter un bloc Bouton \u00e0 la section de texte du bloc M\u00e9dias et texte, s'il est utilis\u00e9 comme aper\u00e7u du produit\/service. De cette fa\u00e7on, vous pouvez concevoir une belle section CTA sur n'importe quelle page.<\/p>\n\n\n\n
<\/span>Avantages des m\u00e9dias et du bloc de texte<\/span><\/h3>\n\n\n\n
- \n
- Rassembler l'image et le texte qui correspondent contextuellement les uns aux autres.<\/li>\n\n\n\n
- \u00c9viter les erreurs d'image dans le blogpost.<\/li>\n\n\n\n
- Aide \u00e0 la r\u00e9activit\u00e9 du site (utilisez la fonction "Stack on mobile").<\/li>\n<\/ul>\n\n\n\n
<\/span>Param\u00e8tres des m\u00e9dias et des blocs de texte<\/span><\/h3>\n\n\n\n
Lorsque vous regardez le r\u00e9glage du bloc M\u00e9dia et texte, vous remarquerez plusieurs options d'alignement, certaines d'entre elles sont uniques, par rapport \u00e0 la plupart des autres blocs.<\/p>\n\n\n\n
Le r\u00e9glage int\u00e9ressant et utile de ce bloc est la couleur d'arri\u00e8re-plan. En colorant la zone autour de l'image et du texte qui s'embo\u00eetent, vous pouvez visuellement mettre en \u00e9vidence leur connexion.<\/p>\n\n\n
![\"\"](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2020\/02\/Snimka-obrazovky-2020-03-24-o-17.57.10-1024x514.png\")
<\/a><\/figure>\n<\/div>\n\n\n![\"Tableau](\"https:\/\/www.ait-themes.club\/wp-content\/uploads\/2019\/08\/BE-Table.jpg\")
<\/a><\/figure>\n<\/div>\n\n\n