Avant de commencer, je vous invite à jeter un coup d'œil sur mon article sur la nouveauté Blogger Draft qui permet de gérer les images que vous avez déjà publié dans un de vos Blogs.
Explication du code d'une image
Lorsqu'on ajoute une image dans un article, voici le code généré par Blogger (il faut cliquer sur Modifier le code HTML pour voir le code de l'image):<div class="separator" style="clear: both; text-align: center;">- Tout le code est compris entre une DIV pour séparer l'image du texte de l'article.
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkOxNpbqWlvllkMpt6tJlFjdkL_5XkDRA_hFfTbDvsHMYhChBem8Ibf0H_lZ1xusJm85kspFIuvyVNmGKXi8t-5dxVdcspS6R0CWs8FCTMOtjXEa2OXH6M0lUIav_cP3D_f7PGYlYoQjEQ/s1600-h/Otimiser-image-Blogger.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><imgborder="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkOxNpbqWlvllkMpt6tJlFjdkL_5XkDRA_hFfTbDvsHMYhChBem8Ibf0H_lZ1xusJm85kspFIuvyVNmGKXi8t-5dxVdcspS6R0CWs8FCTMOtjXEa2OXH6M0lUIav_cP3D_f7PGYlYoQjEQ/s320/Otimiser-image-Blogger.png" /></a></div>
- Blogger ajoute automatiquement une balise Lien à l'image, c'est à dire que l'image est cliquable.
- Si l'image est de grande Taille, Blogger peut afficher jusqu'à 20% de la taille réelle de l'image: s320
- Lorsqu'on clique sur l'image on peut la voir dans les dimensions réelles : s1600-h
- Blogger ajoute automatiquement de la marge à l'image, un peu d'espace à gauche et à droite (si l'image est centrée): style="margin-left: 1em; margin-right: 1em;"
Des marges ajoutées automatiquement par Blogger
Je sais que ma colonne des messages fait 600px et avant d'ajouter des images dans mes articles je les redimensionne à 600px.Quand je les ajoute dans mon article, Blogger ajoute automatiquement une marge à gauche et à droite ce qui fait qu'on ne voit pas la totalité de l'image:
Maintenant notre image s'affichera entièrement (sans marges) :
Aucun commentaire:
Enregistrer un commentaire