{"id":3646,"date":"2024-09-20T17:22:30","date_gmt":"2024-09-20T17:22:30","guid":{"rendered":"https:\/\/tableberg.com\/?p=3646"},"modified":"2024-09-20T17:22:33","modified_gmt":"2024-09-20T17:22:33","slug":"comment-mettre-en-valeur-les-logos-dans-wordpress","status":"publish","type":"post","link":"https:\/\/tableberg.com\/fr\/how-to-showcase-logos-in-wordpress\/","title":{"rendered":"Comment mettre en valeur les logos sur WordPress (avec\/sans plugin)"},"content":{"rendered":"

Un logo est une repr\u00e9sentation visuelle puissante d'une marque. Lorsque votre entreprise est li\u00e9e \u00e0 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\u00e9dibilit\u00e9 parmi les visiteurs du site.<\/p>\n\n\n\n

Par exemple, si vous avez un site de portfolio, vous devez afficher les logos des marques avec lesquelles vous avez travaill\u00e9. Il en va de m\u00eame pour de nombreux autres sites web. WordPress vous permet de le faire de diff\u00e9rentes mani\u00e8res simples et faciles.<\/p>\n\n\n\n

Dans ce tutoriel, nous vous montrerons les deux m\u00e9thodes les plus simples pour mettre en valeur des logos dans WordPress, avec et sans plugin. Commencez !<\/p>\n\n\n\n

Premi\u00e8re m\u00e9thode : sans plugin (en utilisant le bloc de colonnes)<\/h2>\n\n\n\n

La colonne est un bloc par d\u00e9faut de l'\u00e9diteur Gutenberg. <\/p>\n\n\n\n

\u00c9tape 01 : Ajouter le bloc de colonnes \u00e0 l'\u00e9diteur<\/h3>\n\n\n\n

Ajouter Bloc de colonnes<\/strong> dans l'\u00e9diteur en cliquant sur le bouton ic\u00f4ne plus (+)<\/strong>.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

\u00c9tape 02 : S\u00e9lection d'une disposition de colonnes<\/h3>\n\n\n\n

S\u00e9lectionnez une disposition en colonnes. Plus vous s\u00e9lectionnez de colonnes, plus vous pouvez ajouter de logos. S\u00e9lectionnons la mise en page 33\/33\/33<\/strong>.<\/p>\n\n\n\n

\"S\u00e9lectionner<\/figure>\n\n\n\n

Une fois le bloc ajout\u00e9, vous pouvez augmenter le nombre de colonnes. <\/p>\n\n\n\n

Pour ce faire, cliquer<\/strong> les Ic\u00f4ne de colonne<\/strong> dans la barre d'outils. Aller \u00e0<\/strong> les Onglet Param\u00e8tres<\/strong>. Ensuite, venez au Section des colonnes<\/strong>. <\/span><\/p>\n\n\n\n

Vous pouvez <\/span>augmenter le nombre de colonnes<\/span>mber<\/strong> en faisant glisser l'\u00e9chelle ou en tapant directement un chiffre.<\/p>\n\n\n\n

\"Augmenter<\/figure>\n\n\n\n

\u00c9tape 03 : Ajouter le bloc d'images aux colonnes individuellement<\/h3>\n\n\n\n

Vous pouvez ajouter tous les autres blocs Gutenberg dans les colonnes. Allez dans la section premi\u00e8re colonne<\/strong> et cliquer<\/strong> les ic\u00f4ne plus (+)<\/strong>. <\/p>\n\n\n\n

Type d'image<\/strong> dans la bo\u00eete de recherche. Une fois que le bloc appara\u00eet, ajoutez-le \u00e0 la colonne.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

T\u00e9l\u00e9chargez maintenant un logo \u00e0 partir de votre disque local ou de la biblioth\u00e8que multim\u00e9dia.<\/p>\n\n\n\n

\"T\u00e9l\u00e9charger<\/figure>\n\n\n\n

Vous pouvez voir que nous avons ajout\u00e9 un logo au bloc de colonnes.<\/p>\n\n\n\n

\"Logo<\/figure>\n\n\n\n

\u00c9tape 04 : Ajouter des logos aux autres colonnes, un par un<\/h3>\n\n\n\n

De la m\u00eame mani\u00e8re, ajoutez des logos aux autres colonnes du bloc.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

\u00c9tape 05 : Styliser le bloc de colonnes<\/h3>\n\n\n\n

Pour styliser le bloc, aller \u00e0<\/strong> les Onglet Styles<\/strong> sur la barre lat\u00e9rale droite.<\/p>\n\n\n\n

\"Styliser<\/figure>\n\n\n\n

En faisant d\u00e9filer l'onglet, venir \u00e0<\/strong> Espacement des blocs<\/strong>. Cette section vous permettra d'ajouter des espaces entre les logos verticalement et horizontalement. Mais dans ce cas, il est pr\u00e9f\u00e9rable d'ajouter des espaces horizontalement.<\/p>\n\n\n\n

Ensuite, ajouter une bordure<\/strong> autour de l'ensemble du bloc de colonnes. Vous pouvez modifier la couleur et la largeur de la bordure.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

Pour une personnalisation avanc\u00e9e, vous devez utiliser un plugin tiers. Nous allons expliquer la m\u00e9thode suivante avec un tel plugin.<\/p>\n\n\n\n

Deuxi\u00e8me m\u00e9thode : utilisation d'un plugin (Tableberg)<\/h2>\n\n\n\n

Tableberg<\/strong> est un plugin polyvalent qui permet de cr\u00e9er des tableaux, des bo\u00eetes d'ic\u00f4nes, des bo\u00eetes d'images, des bo\u00eetes de logos, etc. Vous pouvez pr\u00e9senter des logos avec des personnalisations avanc\u00e9es sur votre site web avec ce plugin. Obtenez-le \u00e0 partir du coup de banni\u00e8re.<\/p>\n\n\n\n

\n
\n
\n
\n

Cr\u00e9er de belles tables <\/strong>
Avec l'\u00e9diteur de blocs<\/strong><\/p>\n\n\n\n

\n
Essai gratuit<\/a><\/div>\n\n\n\n
Obtenir un Pro<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
\n
\"\"<\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

Une fois install\u00e9, suivez les instructions ci-dessous.<\/p>\n\n\n\n

\u00c9tape 01 : Ajouter le bloc Tableberg \u00e0 l'\u00e9diteur<\/h3>\n\n\n\n

Le plugin ajoute un bloc \u00e0 la biblioth\u00e8que de blocs de Gutenberg nomm\u00e9 Tableberg<\/strong>. Ajouter le bloc \u00e0 l'\u00e9diteur.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

Vous devez d\u00e9finir des cellules de tableau pour le nombre de logos que vous souhaitez afficher. Il suffit de cr\u00e9er le nombre de cellules requis en sp\u00e9cifiant le nombre de lignes et de colonnes.<\/p>\n\n\n\n

Par exemple, nous avons besoin de huit cellules pour afficher huit logos. D\u00e9finir le num\u00e9ro de la colonne et de la ligne 4*2<\/strong>.<\/p>\n\n\n\n

\"S\u00e9lectionner<\/figure>\n\n\n\n

Le nombre requis de cellules est cr\u00e9\u00e9, comme vous pouvez le voir.<\/p>\n\n\n\n

\"Cellules<\/figure>\n\n\n\n

\u00c9tape 02 : Commencer \u00e0 ajouter des logos aux cellules Tableberg<\/h3>\n\n\n\n

Tableberg vous permet d'ajouter plusieurs blocs personnalis\u00e9s aux cellules. Rechercher et ajouter le bloc Image<\/strong> \u00e0 une cellule.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

Aujourd'hui,\u00a0t\u00e9l\u00e9charger un logo,<\/strong><\/span>\u00a0que ce soit par t\u00e9l\u00e9chargement ou \u00e0 partir de la m\u00e9diath\u00e8que.<\/p>\n\n\n\n

\"Logo<\/figure>\n\n\n\n

Ajouter tous les autres logos au reste des cellules Tableberg.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

\u00c9tape 03 : Styliser les cellules<\/h3>\n\n\n\n

Aujourd'hui, aller \u00e0<\/strong> les onglet styles<\/strong> tout en gardant l'ensemble du tableau s\u00e9lectionn\u00e9. Vous pouvez modifier la couleur d'arri\u00e8re-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\u00f4t\u00e9.<\/p>\n\n\n\n

\"Styliser<\/figure>\n\n\n\n

Venez \u00e0<\/strong> les Espacement des cellules<\/strong> en faisant d\u00e9filer l'onglet vers le bas. En utilisant les options de cette section, vous pouvez ajouter des espaces entre les colonnes du logo, \u00e0 la fois verticalement et horizontalement.<\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

Bordure \"Come to Table<\/strong>. Dans la section Bordure int\u00e9rieure, vous pouvez modifier la couleur et le rayon de la bordure. <\/p>\n\n\n\n

\"Ajouter<\/figure>\n\n\n\n

Vous pouvez ainsi donner un aspect esth\u00e9tique aux colonnes du logo.<\/p>\n\n\n\n

Conclusion<\/h2>\n\n\n\n

Tableberg est un plugin polyvalent passionnant qui vous permet de cr\u00e9er de nombreux designs \u00e9tonnants pour votre site web. Avant de quitter le site, vous pouvez consulter d'autres tutoriels sur le plugin. <\/p>\n\n\n\n