Une petite leçon (un peu confuse) pour personnaliser votre blog BlogSpot

Coucou tout le monde!
Comme ces derniers temps, avec la fameuse migration de 20six, de nombreux blogs sont en cours de relooking, je me suis dit que j'allais faire une note avec quelques astuces pour relooker son blog Blogger. Bon, je ne doute pas que Amand ou Johnthebest, avec leurs connaissances, n'auront pas besoin de ce genre d'astuces, mais il peut toujours y en avoir à qui ça peut servir. Je m'exuse par avance si je dis des tas de trucs que vous connaissez déjà, mais il faut dire que ce genre de chose est assez difficile à expliquer. D'ailleurs, je m'excuse aussi par avance si c'est pas clair!!! Et puis bon, je ne suis pas franchement une experte moi-même, donc j'espère que je ne vais pas dire de bêtises et que je vais réussir à être claire.
Je vais essayer de procéder dans l'ordre. Tout d'abord, quelques bases.

Toute image stockée sur internet a un url (une adresse). Que votre image soit stockée sur votre blog ou sur un site d'hébergement d'images tel qu'imageshack, vous pouvez obtenir cet url en faisant un clic droit sur votre image, puis en sélectionnant propriétés, l'url est donné dans la fenêtre qui apparaît alors. Dans mes explications pour la suite, je noterai url_de_votre_image dans les codes pour symboliser là où vous devez écrire cette url.Par ailleurs, j'écrirai aussi url_du_site lorsque je parlerai de l'adresse d'un site, et nom_du_site, pour parler du nom d'un site.

Pour insérer une image, que ce soit dans un commentaire, dans un lien ou dans un code source de note ou du blog, le code à taper est le suivant:

Vous pouvez également spécifier la taille que vous souhaitez donner à votre image, en pixels, de la manière suivante:

en ajustant le nombre de pixels comme ça vous arrange.Pour insérer un lien, il faut faire comme suit:

En combinant ce code avec celui pour insérer les images, on peut alors créer de jolis liens images, en remplaçant dans le code ci-dessus le nom du site par le code pour insérer une image. Ainsi, si vous avez un site que vous voulez linker, et une image que vous voulez attribuer au lien vers ce site, vous devez taper:

Voilà. Ca paraît un peu compliqué comme ça, mais vous verrez, on s'y fait très vite.Ensuite, quelques balises simples. Pour que des mots soient en gras dans un commentaire, écrivez ainsi:

Pour écrire en italique, écrivez comme ça:

Pour que des mots soient soulignés, écrivez comme ça:

En html, une couleur est toujours associée à un code, composé de lettres et de chiffres. Par exemple, la couleur de fond de mon blog est #feccff, la couleur rose fushia utilisée pour les liens dans mes notes est #cb3398. Pour connaître le code d'une couleur, vous pouvez utiliser photoshop, et certains autres logiciels.Maintenant que les bases sont posées, commençons par l'insertion d'un joli bandeau titre pour mettre en haut du blog. Si vous souhaitez faire cela, pour avoir une belle image en haut du blog au lieu de juste le nom du blog, il faut suivre les quelques étapes suivantes. Tout d'abord, il vous faut une image, de taille 700x240 pixels à peu près, contenant notamment le titre de votre blog, et tout ce que vous pouvez avoir envie d'y mettre d'autre. Ensuite, vous allez dans les pages d'administration de votre blog, puis cliquez sur "modèle", pour accéder au code source de votre blog. Vous devez alors chercher la partie du code contenant ceci:

Vous allez écrire le code d'insertion de votre image (donné dans les explications ci-dessus) juste entre la sixième et la septième ligne de ce petit paragraphe. Et voilà le travail! Mais attendez, ce n'est pas exactement fini. En effet, vous avez maintenant votre bannière, mais le titre de votre blog apparaît toujours juste au dessus, et il faut que vous le rendiez invisible. C'est très simple. Cherchez le paragraphe contenant ceci:

où la ligne color décrit la couleur du fond du blog, et recherchez aussi le code contenant ceci:

où la ligne color: décrit la couleur du titre du blog, et où font-size décrit la taille du titre.Pour que le titre devienne invisible, assurez vous que le code couleur du titre (pour moi, #feccff) soit le même que le code couleur du fond de votre blog (pour moi, #feccff). Au passage, il est bon de réduire la taille du titre, afin d'éviter une trop grosse zone vide au-dessus de votre bannière. Pour cela, entrez une valeur inférieure à 50% dans la ligne décrivant la taille du titre.Bon, on avance, vous ne trouvez pas? Bon, maintenant on va passer à l'insertion de liens dans votre blog. Pour cela, vous devez chercher le paragraphe suivant dans le code source:

(enfin, ça ressemble à ça, en tout cas).

Il y a deux autres lignes similaires en dessous, commençant également par . Vous allez enlever toutes les lignes commençant par (sauf éventuellement la ligne Google News, si vous avez envie de la garder), et à la place vous aller mettre des liens à vous. Il suffit de commencer chaque ligne par , et de la terminer par , et entre ces deux balises, vous mettez le code qui sert à créer un lien (voir explication plus haut). Il peut s'agir d'un lien normal, ou d'un lien image, bien évidemment.

Pour modifier les couleurs de votre blog (fond, polices, liens etc...), cherchez les endroits du code source où ces couleurs sont définies, et changez le code couleur dans les lignes color.

Pour modifier la taille des textes, liens et autres mots, changez le pourcentage dans les lignes font-size.

Sur les blogs, souvent les titres et certains mots sont mis en majuscule par défaut. Pour qu'ils ne le soient plus, effacez les lignes text-transform.

Voilà, je crois vous avoir donné les éléments les plus importants.Je sais que ça paraît un peu compliqué expliqué comme ça, mais je suis sûre que vous vous en sortirez très bien! Une fois qu'on a compris, ça vient tout seul!

Allez, bon courage à ceux que tout ceci intéressera! Bises!