J Shortcodes est une extension vous permettant d’insérer facilement de nombreux boutons personnalisées, des boites d’informations, mais aussi des colonnes dans vos articles et pages WordPress. L’extension ne dispose d’aucune option, mais il est vous possible via les balises personnalisées (shortcodes) d’insérer et de gérer le style graphique des boutons, boites d’informations et colonnes à insérer. Une documentation est disponible sur le blog de l’auteur, expliquant les différentes manières d’ajouter et de personnaliser l’ensemble des éléments. Ces éléments peuvent bien évidemment être insérés plusieurs fois dans le même article et peuvent être fusionnés.

Les boutons

Les boutons disponibles via l’extension sont dans un style très épurés et convient parfaitement aux styles demandé par les blogueurs. Il est plutôt facile de personnaliser et d’ajouter un bouton dans vos articles. Pour cela, il vous suffit de coller la balise suivante là où vous souhaitez voir apparaitre le bouton dans votre article.

Sans icône :

[jbutton color="orange" size="medium"]Bouton[/jbutton]

Avec icône :

[jbutton icon="icônes.png" size="medium" color="orange"]Bouton[/jbutton]

Les paramètres :

  • size
  • color
  • rounded
  • icon
  • link
  • newpage
  • a_css
  • span_css

Bouton-JShortcode

Les boites d’informations

Les boites d’informations permettent d’afficher un message important dans une boite graphique. vous pouvez, via les paramètres disponible de la balise personnalisée introduire une icône, un bouton et de personnaliser l’aspect graphique de la boite via une ombre, la couleur et les bordures. Pour insérer une boite d’informations, il vous suffit de coller le bout de code suivant.

Normal :

[jbox color="gray"]Mon texte[/jbox]

Personnalisée :

[jbox border="2" radius="8" shadow="3" title="Titre" icon="icone.png"]Mon texte[/jbox]

Les paramètres :

  • width
  • color
  • icon
  • title
  • border
  • radius
  • shadow
  • jbox_css
  • icon_css
  • title_css
  • content_css
  • vgradient

JShortcodes-box

Les colonnes

Insérer des colonnes dans un article ou une page permet vraiment de structurer son contenu et donne un aspect propre et professionnel à votre article. Via la balise personnalisée de l’extension, il vous est possible d’insérer plusieurs colonnes et d’y insérer le contenu souhaité. La largeur est automatiquement prise en charge et permet ainsi d’insérer jusqu’à cinq colonne dans votre contenu. Avec les paramètres avancés, il vous est possible de créer, à la manière du NYT, un style de colonne unique ayant différentes largeurs et contenus.

Trois colonnes :

[jcolumns]column 1...[jcol/]column 2...[jcol/]column 3...[/jcolumns]

Colonnes de différentes tailles

[jcolumns model="93,179,349,175,179" inbordercss="1px solid #e2e2e2" outbordercss="1px solid #999999"] ... [jcol/] ... [jcol/] ... [jcol/] ... [jcol/] ... [/jcolumns]

Les paramètres :

  • model
  • halign
  • valign
  • colclass
  • colgap
  • colcss
  • stripbr
  • inbordercss
  • outbordercss
  • topbordercss
  • bottombordercss

Column-JShortcodes

BRANDT Valentin

Créateur de Geekeries.fr. Référentiel de ressources WordPress en Français qui a vu le jour pour la toute première fois en 2007. Je publie régulièrement des plugins, des outils SEO, des ressources et de l'actualités pour améliorer votre expérience avec le CMS WordPress.

Ne manquez pas nos autres contenus :