Changer les titres de vos sidebar [Blogger]


Nouveau Girls Can Code ! Cette fois-ci on va s'attaquer aux titres de la sidebar !
A l'origine, les titres ("Newsletter", "Réseaux Sociaux") sont comme ça :

Pour les changer, c'est tout simple. On va aller dans le backoffice de Blogger, dans "Thèmes". On va cliquer sur "Modifier le code HTML". Ça peut faire peur de voir tout ce code, n'est-ce pas ?


On va cliquer sur la première ligne, et faire CTRL+F. Une zone de recherche s'affiche en haut à droite.
Dans la barre de recherche on va taper :
/* Headings

Cela concerne le code des titres des sidebars. On va décortiquer le code :
/* Headings
----------------------------------------------- */
div.widget > h2,
div.widget h2.title {
  margin: 0 0 1em 0; /* marge du titre des gadgets de la sidebar */
  font: $(widget.title.font); /* police du titre */ 
  color: $(widget.title.text.color); /* couleur du titre */ 
}

Centrer les titres et les mettre en majuscule
Pour centrer et mettre en majuscules les titres, il suffit de rajouter deux lignes sur le code.
/* Headings
----------------------------------------------- */
div.widget > h2,
div.widget h2.title {
margin: 0 0 1em 0;
font: $(widget.title.font);
color: $(widget.title.text.color);
text-align: center; /* permet de centrer le texte */ 
text-transform: uppercase; /* permet de mettre le texte en majuscule */ 
}

Changer la police et la couleur
Pour se faire, on va retourner dans le back-office de Blogger. Dans "Thèmes", on va cliquer sur "Personnaliser".  

On va cliquer sur "Avancé" puis sur "Gadgets". 
Là, on va pouvoir choisir la police, la couleur, la taille parmi un grand choix de police et de couleurs.