Un logo est une représentation visuelle puissante d'une marque. Lorsque votre entreprise est liée à d'autres marques, que ce soit par le biais d'un partenariat ou d'une affiliation, vous pouvez avoir besoin d'afficher leurs logos sur votre site web afin d'instaurer un climat de confiance et de crédibilité parmi les visiteurs du site.
Par exemple, si vous avez un site de portfolio, vous devez afficher les logos des marques avec lesquelles vous avez travaillé. Il en va de même pour de nombreux autres sites web. WordPress vous permet de le faire de différentes manières simples et faciles.
Dans ce tutoriel, nous vous montrerons les deux méthodes les plus simples pour mettre en valeur des logos dans WordPress, avec et sans plugin. Commencez !
Première méthode : sans plugin (en utilisant le bloc de colonnes)
La colonne est un bloc par défaut de l'éditeur Gutenberg.
Étape 01 : Ajouter le bloc de colonnes à l'éditeur
Ajouter Bloc de colonnes dans l'éditeur en cliquant sur le bouton icône plus (+).
Étape 02 : Sélection d'une disposition de colonnes
Sélectionnez une disposition en colonnes. Plus vous sélectionnez de colonnes, plus vous pouvez ajouter de logos. Sélectionnons la mise en page 33/33/33.
Une fois le bloc ajouté, vous pouvez augmenter le nombre de colonnes.
Pour ce faire, cliquer les Icône de colonne dans la barre d'outils. Aller à les Onglet Paramètres. Ensuite, venez au Section des colonnes.
Vous pouvez augmenter le nombre de colonnesmber en faisant glisser l'échelle ou en tapant directement un chiffre.
Étape 03 : Ajouter le bloc d'images aux colonnes individuellement
Vous pouvez ajouter tous les autres blocs Gutenberg dans les colonnes. Allez dans la section première colonne et cliquer les icône plus (+).
Type d'image dans la boîte de recherche. Une fois que le bloc apparaît, ajoutez-le à la colonne.
Téléchargez maintenant un logo à partir de votre disque local ou de la bibliothèque multimédia.
Vous pouvez voir que nous avons ajouté un logo au bloc de colonnes.
Étape 04 : Ajouter des logos aux autres colonnes, un par un
De la même manière, ajoutez des logos aux autres colonnes du bloc.
Étape 05 : Styliser le bloc de colonnes
Pour styliser le bloc, aller à les Onglet Styles sur la barre latérale droite.
En faisant défiler l'onglet, venir à Espacement des blocs. Cette section vous permettra d'ajouter des espaces entre les logos verticalement et horizontalement. Mais dans ce cas, il est préférable d'ajouter des espaces horizontalement.
Ensuite, ajouter une bordure autour de l'ensemble du bloc de colonnes. Vous pouvez modifier la couleur et la largeur de la bordure.
Pour une personnalisation avancée, vous devez utiliser un plugin tiers. Nous allons expliquer la méthode suivante avec un tel plugin.
Deuxième méthode : utilisation d'un plugin (Tableberg)
Tableberg est un plugin polyvalent qui permet de créer des tableaux, des boîtes d'icônes, des boîtes d'images, des boîtes de logos, etc. Vous pouvez présenter des logos avec des personnalisations avancées sur votre site web avec ce plugin. Obtenez-le à partir du coup de bannière.
Créer de belles tables
Avec l'éditeur de blocs
Une fois installé, suivez les instructions ci-dessous.
Étape 01 : Ajouter le bloc Tableberg à l'éditeur
Le plugin ajoute un bloc à la bibliothèque de blocs de Gutenberg nommé Tableberg. Ajouter le bloc à l'éditeur.
Vous devez définir des cellules de tableau pour le nombre de logos que vous souhaitez afficher. Il suffit de créer le nombre de cellules requis en spécifiant le nombre de lignes et de colonnes.
Par exemple, nous avons besoin de huit cellules pour afficher huit logos. Définir le numéro de la colonne et de la ligne 4*2.
Le nombre requis de cellules est créé, comme vous pouvez le voir.
Étape 02 : Commencer à ajouter des logos aux cellules Tableberg
Tableberg vous permet d'ajouter plusieurs blocs personnalisés aux cellules. Rechercher et ajouter le bloc Image à une cellule.
Aujourd'hui, télécharger un logo, que ce soit par téléchargement ou à partir de la médiathèque.
Ajouter tous les autres logos au reste des cellules Tableberg.
Étape 03 : Styliser les cellules
Aujourd'hui, aller à les onglet styles tout en gardant l'ensemble du tableau sélectionné. Vous pouvez modifier la couleur d'arrière-plan individuellement pour toutes les lignes et cellules. Mais comme nous n'en avons pas besoin pour ce tutoriel, nous laissons cette option de côté.
Venez à les Espacement des cellules en faisant défiler l'onglet vers le bas. En utilisant les options de cette section, vous pouvez ajouter des espaces entre les colonnes du logo, à la fois verticalement et horizontalement.
Bordure "Come to Table. Dans la section Bordure intérieure, vous pouvez modifier la couleur et le rayon de la bordure.
Vous pouvez ainsi donner un aspect esthétique aux colonnes du logo.
Conclusion
Tableberg est un plugin polyvalent passionnant qui vous permet de créer de nombreux designs étonnants pour votre site web. Avant de quitter le site, vous pouvez consulter d'autres tutoriels sur le plugin.