Vous est-il déjà arrivé de vouloir présenter des images, une liste ou tout autre contenu sous forme de colonnes? Probablement que oui, pour améliorer la présentation ou pour que vos données soient plus lisibles, mais ajouter des colonnes dans l’éditeur WordPress n’est pas forcément une mince affaire.
Si vous connaissez le code HTML ou le code CSS cela se fera sans réel problème, mais pour vous tous qui n’y connaissez rien au codage informatique, comment allez vous ajouter des colonnes dans un article?
Comme dans presque chaque cas lorsqu’un problème se présente à un un utilisateur de WordPress, il a une solution sous la forme d’un plugin, simple à installer et qui vous évitera de mettre les mains dans le cambouis.
Il existe plusieurs plugin qui vous permettent d’ajouter des colonnes au moyen d’un shortcode, mais celui que vous allons voir aujourd’hui, Advanced WP Columns a une approche différente.
Ajouter des colonnes avec Advanced WP Columns
Advanced WP Columns est un plugin gratuit qui vous permet de configurer le contenu de vos articles sous forme de colonnes, sans aucun shortcode. Pour ce faire, le plugin ajoute un bouton à l’éditeur WordPress, bouton qui va ouvrir une interface beaucoup simple pour ajouter des colonnes.
Advanced WP Columns n’est pas un plugin de colonnes ordinaire dans lequel vous avez besoin d’avoir des compétences de programmation, ou d’utiliser du codes généré pour vous.
Vous pouvez facilement ajouter plusieurs colonnes à votre contenu en seulement quelques clics. Ce plugin élargit en fait les fonctionnalités de l’éditeur WordPress par défaut. Après l’installation du plugin, vous aurez un bouton supplémentaire sur votre éditeur, que vous pourrez utiliser pour interagir avec le plugin, et pour ajouter des colonnes à votre contenu, les modifier et même voir à quoi cela ressemblera côté lecteurs, avant de vous décider à publier votre message.
Mise en route d’Advanced WP Columns
Installation et Activation
Comme tout autre plugin WordPress, vous pouvez l’installer en utilisant l’installateur WordPress par défaut dans le menu Extensions.
Une fois le plugin installé, il ne vous reste plus qu’à l’activer, en cliquant sur le bouton Activer.
Réglages d’Advanced WP Columns
Après l’activation d’Advanced WP Columns, vous trouverez une section « Advanced WP Columns » dans le menu Réglages. C’est ici que vous pourrez effectuer les réglages du plugin.
Vous pouvez définir la largeur du conteneur de colonnes, cette option est utilisée pour configurer les lignes et largeur maximale des lignes. Vous pouvez, dans la section Initial structure, sélectionner un modèle par défaut (deux, trois, quatre colonnes) qui sera utilisé lorsque vous ajouterez de nouvelles colonnes à vos articles, ou vous pouvez conserver le bouton Empty et régler vos colonnes manuellement comme suggéré par défaut.
Vous pouvez également choisir le mode du plugin, adaptatif ou fixe (Responsive layout), il est fortement conseillé de choisir le mode adaptatif, sélectionné par défaut, afin que l’ensemble soit compatible avec les appareils mobiles. Si vous sélectionner le mode adaptatif de mise en page, la largeur des colonnes sera présentée en pourcentage, alors qu’en mode fixe largeur sera indiquée en pixels. Par défaut, les colonnes occuperont 80% de la largeur de votre article (Column per row occupation), pour une meilleure lisibilité.
Si vous choisissez le mode adaptatif, vous pouvez également définir un point de de rupture pour la largeur, par défaut ce point est fixé à 1024 pixels. Cela signifie que si la largeur de l’écran de l’utilisateur est sous cette valeur, chaque colonne sera dans une nouvelle ligne.
Le design de votre thème peut être influencé par le point de rupture, c’est pour cela que vous pouvez spécifier la l’ espace que doit occuper votre colonne dans la ligne pour donner un meilleur effet visuel.
Utilisation d’Advanced WP Columns
Une fois dans l’éditeur visuel de WordPress, vous verrez une nouvelle icône dans la barre d’outils de l’éditeur.
En cliquant sur ce bouton, vous verrez apparaître la fenêtre « Advanced WP Columns Manager ».
C’est ici que vous pouvez ajouter des colonnes et du contenu, sans avoir besoin d’utiliser un shortcode ou tout autre truc similaire.
Pour ajouter une colonne, faites glisser le bouton « Ajouter » et déposez-le sur la barre, ci-dessus en bleu. Si vous souhaitez ajouter de une à quatre colonnes, il vous suffit de sélectionner le bouton ver ‘Empty’ et de sélectionner le nombre de colonne que vous souhaitez ajouter.
Une fois les colonnes générées, vous pourrez les formatez individuellement en cliquant dans la colonne à formater.
Une fois la préparation de vos colonnes terminée, cliquez sur le bouton bleu « + Add Columns » pour voir s’afficher vos colonnes dans l’éditeur visuel de WordPress, telles qu’elles apparaîtront une fois l’article publié.
Et voilà le résultat, réalisé en moins de deux minutes, le plus long ayant été de chercher les vidéos à inclure ;):
Advanced WP Columns dispose de peu d’options pour permettre une intégration parfaite à votre thème. Si vous souhaitez utiliser ce plugin plus à fond, vous pouvez toujours ajouter votre propre classe CSS personnalisée, pour le conteneur de colonnes, les colonnes et les gouttières de séparation des colonnes, dans la fenêtre des paramètres du plugin.
J’espère que vous trouverez ce plugin très utile, et que dans vos prochains articles vous l’utiliserez pour ajouter des colonnes à votre contenu et ainsi en améliorer la présentation.
Avez vous déjà essayé d’insérer des colonnes dans vos article ou vos pages WordPress? Si oui, expliquez nous dans les commentaires ci-dessous votre façon de procéder.
Si cet article vous a été utile, il le sera pour d’autres personnes, Partagez le. Merci!
Publié à l'origine le : 25 janvier 2017 @ 15 h 09 min
