Intégrer du contenu riche en colonne latérale

Il nous est régulièrement demandé comment intégrer du contenu un peu personnalisé en colonne latérale : images, texte mis en forme, bio vous permettant de vous décrire, vidéo, etc... Par défaut, si vous voulez mettre en place ce type de contenu, il vous faut ajouter un widget HTML et taper votre texte en y incluant les balises HTML permettant de le mettre en forme, ou dans le cas des images, avoir envoyé l'image dans le gestionnaire de fichier au préalable, puis inclure le bout de code HTML qui va bien. C'est relativement peu accessible pour la majorité d'entre vous qui ne maîtrisez pas le langage HTML.

Hors il existe une petite astuce qui va vous permettre d'intégrer ce type de contenu facilement.

 

Utiliser l'éditeur de notes

Quoi qu'il arrive, pour mettre en colonne latérale du contenu riche, il vous faut utiliser le widget inclure son propre HTML. L'astuce consiste à se faire générer le code HTML qui va bien, plutôt qu'à le taper soit-même.

Pour ce faire, il vous suffit de cliquer sur le bouton Publier pour obtenir la page de rédaction de note. Placez-vous directement dans le Corps de note, et créez le contenu que vous souhaitez placer en colonne latérale. Si il s'agit de texte, tapez votre texte comme vous le feriez pour une note, et mettez le en forme. Si il s'agit d'une image, insérez votre image, en faisant attention à ne pas choisir un format trop large pour qu'elle tienne dans la colonne latérale. Vous pouvez également combiner les deux, intégrer des liens, etc...

 

Une fois que vous êtes satisfait de votre contenu, cliquez sur l'onglet HTML qui est en haut à droite de l'éditeur, puis sélectionnez tout le code qui apparaît et copiez le.

Vous pouvez alors vous rendre dans l'Habillage, puis dans la zone de Contenu. Une popup devrait vous alerter que vous quittez la page sans enregistrer, mais c'est normal. Ne publiez pas la note.

Ajoutez un module permettant d'inclure son propre HTML. Donnez lui le titre que vous voulez puis collez le contenu que vous venez de copier. Cliquez sur ok, faites glisser le module à l'endroit souhaité en colonne latérale et enregistrez.

Le tour est joué, vous avez intégré du texte mis en forme en colonne latérale sans rien connaître au HTML !