DéveloppementsFichiers CSS

Un peu de couleurs pour le compteur statistiques du blog


Les posts publiés avant juin 2015 sont susceptibles de contenir des informations obsolètes !
Référez-vous à la nouvelle théorie du langage XML ou/et posez vos questions sur le forum pour en savoir plus.
Description Gadget Gadget Version Template Version
Ajouter un calque coloré dans le gadget des statistiques Blogger
Stats
1
1
2
Un peu de couleurs pour le compteur statistiques du blog
Pas besoin de vous expliquer ce qu'est ce gadget. Simplement le nombre de pages vues par les visiteurs sur une certaine période.
Son compteur noir est un peu triste. De ce fait, nous allons lui donner un peu de couleurs. Je me suis donc amusée a faire quelques petits calques dont voici les résultats.


Un peu de couleurs pour le compteur statistiques du blog


1ère étape : configurer les paramètres du gadget statistiques

Vous ajoutez le gadget Statistiques du blog à votre blog et vous le paramétrez comme sur l'image ci-dessous, en sélectionnant un des deux styles indiqués.


Un peu de couleurs pour le compteur statistiques du blog


2ème étape : ajouter un style

Il y a 5 calques de couleurs différentes.
Vous choisissez la couleur qui convient le mieux à votre blog.
Vous recopiez l'un des CSS ci-dessous via l'outil de création de modèles.

  • Tableau de bord
  • Modèle
  • Personnaliser
  • Avancé
  • Ajouter Fichiers CSS


Un peu de couleurs pour le compteur statistiques du blog



Style 1 : Compteur blanc / gris

.Stats .digit {
  background:url("http://lh5.ggpht.com/_E5JYoHlDglk/TKWGx5mYQ8I/AAAAAAAACPE/nuNJgjw1Zx0/stats-flipper-grey.png") no-repeat left !important;
  border:1px solid grey;
}


Style 2 : Compteur rouge

.Stats .digit {
  background:url("http://lh6.ggpht.com/_E5JYoHlDglk/TKWGx7wFmFI/AAAAAAAACPI/gFJqWP6uGd8/stats-flipper-red.png") no-repeat left !important;
  border:1px solid red;
}


Style 3 : Compteur bleu

.Stats .digit {
  background:url("http://lh3.ggpht.com/_E5JYoHlDglk/TKWGxidbW3I/AAAAAAAACO8/gdPsUquKYxE/stats-flipper-blue.png") no-repeat left !important;
  border:1px solid blue;
}


Style 4 : Compteur vert

.Stats .digit {
  background:url("http://lh4.ggpht.com/_E5JYoHlDglk/TKWGx9GXJrI/AAAAAAAACPA/D13KBx20t4o/stats-flipper-green.png") no-repeat left !important;
  border:1px solid green;
}


Style 5 : Compteur jaune

.Stats .digit {
  background:url("http://lh6.ggpht.com/_E5JYoHlDglk/TKWGyOTUSqI/AAAAAAAACPM/4_3sM6snMlk/stats-flipper-yellow.png") no-repeat left !important;
  border:1px solid yellow;
}


Liens divers

Dernière modification :
Assistance publique pour le produit Blogger sur les Forums d'aides :

Certifiée par Google - Experte TC :
  • Affectation Google France, produit Blogger, du 11/07/2011 au 28/07/2014.
  • Affectation Google US, produit Blogger depuis le 28/07/2014.

Posts les plus consultés de ce blog

ThéorieRéférences XMLParamètres des données
Le paramètre Image redimensionnable [isResizable]
Populaire
DéveloppementsFichiers XML
Résumés des articles avec images réactives [Pack 2016]
Populaire