Tutoriel Blogger: comment afficher des images côte-à-côte dans un article blogspot

Aligner les images dans Blogger.

Si comme moi vous ne COMPRENEZ pas pourquoi blogger ne VEUT PAS mettre vos images proprement côte à côte alors que la largeur de votre blog est suffisante pour les accueillir, ce tuto est pour vous!

En gros quand on insère des images à la suite dans un article Blogger, elles se mettent automatiquement les unes en dessous des autres. Mais voilà, vous n'avez pas envie que vos lecteurs aient trop à faire défiler le blog, vous aurez envie de les avoir ALIGNEES. 
Après avoir galéré longtemps, je me suis mis en tête de rechercher le parfait tuto, quelques-uns ne marchaient pas mais cet article de acraftingjourney (en anglais) m'a donné la réponse!

Sans plus attendre, voici mon pas-à-pas pour réaliser cet exploit!


1- Créer un nouvel article comme d'habitude

2- Passez en mode HTML, oui ce mode habituellement réservé aux geeks!

cliquez pour agrandir

3- Copiez-collez ce code:

<table border="0" width="150"><tbody> <tr><td>PREMIEREIMAGE</td><td>DEUXIEMEIMAGE</td></tr> </tbody></table>

note: table border="1" fera apparaitre des bordures

4-Faites "entrée" plusieurs fois pour laisser de l'espace après la fin de ce texte.

5- Insérez votre première image via l'outil habituel

6- Repérez bien la portion de code qui vient d'apparaitre. Sélectionnez cette portion, Coupez-la 

ajouter la 1e image et couper la portion de texte qui vient juste d'appaitre

7- Collez-la A LA PLACE des majuscules PREMIEREIMAGE dans le code

coller cette portion à la place du texte PREMIERE IMAGE dans le code

8- Refaites les étapes 5, 6, 7 pour intégrer la 2e image,
(pour + d'images rajouter des portions de code <td>-----</td> dans le code et refaites la même procédure).

C'est terminé! Finalisez l'article en mode normal et admirez le résultat!

en revenant en mode classique on constate déjà l'alignement des images

dernière astuce: dans votre portion de code image commençant par <a href> et se terminant par </a>, juste avant la fin, il y a un numéro en s### (exemple s200/fimofruits.jpg dans la capture d'écran 7). Ce numéro représente le redimensionnement de votre image. Vous pouvez donc ajuster la taille de votre image en augmentant ou réduisant ce numéro!

Cet article vous a été utile? Alors mettez un petit commentaire et ajoutez un lien vers votre article pour qu'on puisse admirer le résultat!