DéveloppementsFichiers XML

Compteur de commentaires Blogger et Google+


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 Network Gadget Gadget Version Template Version
Add-on affichant le nombre de commentaires déposés via Blogger et Google+ sur chacun des articles d'un blog.
Google+
Blog
1
1
2
Compteur commentaires
Petit add-on qui permet d'afficher séparément le nombre de commentaires déposés via Blogger et Google+ pour chacun des articles.

Présentation du module

Le add-on ne s'affiche que sur les articles dont le dépôt de commentaires est autorisé. Il contient 3 données :
  • Le nombre de commentaires déposés via Blogger
  • Le nombre de commentaires déposés via Google+
  • Le nombre total de commentaires Blogger et Google+


Compteur commentaires


L'activation des commentaires Google+ n'est pas requise.


Le fichier CSS

Histoire de changer les habitudes, on va commencer par installer les CSS


Le fichier CSS
.comments-count-blo-goo {
  padding: 5px;
  background: rgb(248, 248, 248);
  margin-top: 15px;
  border: 1px solid rgb(229, 229, 229);
  border-radius: 3px;
  color: #666666;
  line-height: normal;
  vertical-align: top;
  font-size: 13px;
  font-family: arial;
}

.comment-blogger, .comment-google {
  padding-left: 18px;
  height: 16px;
  display: inline-block;
  width: 130px;
}

.comment-blogger {
  background: url("//www.blogger.com/img/logo-16.png") no-repeat;
  background-size: 14px;
}

.comment-google {
  background: url("//www.google.com/images/icons/ui/gprofile_button-16.png") no-repeat;
  background-size: 14px;
  vertical-align: top;
  line-height: normal;
}

.comment-total {
  font-size: 13px;
  vertical-align: top;
  display: inline-block;
}

.comment-total div, .comment-google div {
  vertical-align: top !important;
}
Où recopier ce fichier ?

Vous ajoutez le code CSS via l'éditeur de modèles :

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



Le code HTML

XML
<b:if cond='data:post.allowComments and data:post.allowNewComments'>
  <div class='comments-count-blo-goo'>
    <div class='comment-blogger'><data:post.numComments/> commentaire<b:if cond='data:post.numComments &gt; 1'>s</b:if></div>
    <div class='comment-google'><div class='g-commentcount' data-color='#666666' data-font-family='arial' data-font-size='13px' data-preexisting_count='0' expr:data-href='data:post.url'/></div>
    <div class='comment-total'>Total : <div class='g-commentcount' data-color='#666666' data-font-family='arial' data-font-size='13px' expr:data-href='data:post.url' expr:data-preexisting_count='data:post.numComments'/></div>
  </div>
</b:if>
Où recopier ce code ?

Le module est raccordé aux articles. Il doit être positionné dans le code HTML du gadget Blog, dans une boucle d'articles.

Choisissez l'un de ces emplacements :

  • Afficher dans les options des articles, version web
  • Afficher dans les options des articles, version mobile personnalisée - Item
  • Afficher dans les options des articles, version mobile personnalisée - Index
Dernière modification :
Assistance publique pour le produit Blogger sur les Forums d'aides :

Certifiée par Google - Experte Platine TC (Ambassador & Advanced Troubleshooter):
  • 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

DéveloppementsMulti-versions
Facebook : Bouton J'aime [Like button]
Populaire
DéveloppementsMulti-versions
Facebook : Bouton partager [Share button]
Populaire
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