Comment créer son propre blog: choisir un hébergeur, choisir le nom, écrire son premier article...

samedi 10 août 2013

Créer un widget qui ne s'affiche pas sur la page d'accueil sur Blogger

Widget
On aimerait parfois afficher un widget sur les pages d'articles mais pas sur la page d'accueil.

Dans Blogger, il faut passer par une modification du code HTML mais ce n'est pas très compliqué.

1. Repérer le nom du widget:

Remarque: si vous avez donné un titre au widget lors de l'installation, vous pouvez sauter cette étape et passer au point 2.
  1. Allez dans Mise en page
  2. Cliquer sur Modifier le widget
  3. Agrandissez la fenêtre. Vous trouverez le nom du widget à l'extrême droite de la barre d'adresse, par exemple HTML3.

2. Modifier le modèle de votre blog:

  1. Allez dans Modèle
  2. Faites une sauvegarde de votre modèle (voir Copie de sauvegarde du modèle sur Blogger)
  3. Cliquez sur Modifier le code HTML
  4. Cliquez sur Accéder au widget ou cherchez le nom avec CTRL-F
  5. Développez le widget en cliquant sur la petite flèche noir dans la marge de gauche, deux fois.

Notez ce qui vient après, tout entre le début du widget et </b:widget> qui indique la fin du widget)

<b:widget id='HTML3' locked='false' title='LinkWithin' type='HTML'>
  <b:includable id='main'>
      <!-- only display title if it's non-empty -->
      <b:if cond='data:title != &quot;&quot;'>
        <h2 class='title'>
          <data:title/>
        </h2>
      </b:if>
      <div class='widget-content'>
        <data:content/>
      </div>
      <b:include name='quickedit'/>
    </b:includable>
</b:widget>

Il faut insérer les deux lignes suivantes dans le code du gadget:

<b:if cond='data:blog.pageType == "item"'>
et
</b:if>

A l'endroit suivant:

<b:widget id='HTML3' locked='false' title='LinkWithin' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'>
<data:title/>
</h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>

</b:if>
</b:includable>
</b:widget>

3. Vérifiez si ça fonctionne:

  1. Cliquez sur Prévisualiser le modèle pour vérifier si le widget fonctionne correctement.
  2. Si le résultat vous convient, Enregistrer le modèle.