DéveloppementsReconversion de gadgets

Gadget Liste de liens avec vignettes (avec Apercite)


Suite à l'arrivée des Thèmes de la 3e génération, les posts publiés avant juin 2015 sont susceptibles de contenir des informations obsolètes ou qui ne conviennent pas à votre nouveau thème !
Pour vous aider a développer votre thème, référez-vous :En cas de besoin, exposez votre cas sur le forum.
Description Gadget Gadget Version Template Version
Thumbnails ajoutés au gadget Blogger : Liste de liens. Choix entre 2 présentations, paramètres des liens, 19 tailles des vignettes, etc. Screenshots générés par Apercite.
LinkList
1
1
2
Thumbnails linklist with Apercite
A quelques détails près, c'est le même développement présenté précédemment. Mêmes caractéristiques, même design, même construction, sauf...
...que la différence vient du fait que les captures ne proviennent pas du même service.
bis repetitas

Présentation des vignettes

Comme vous le constaterez, le design et les options restent inchangés.

Les screenshots sont générés par Apercite. Ce service propose gratuitement pas moins de 19 tailles différentes réparties en deux séries (4/3 et 16/10). Les tailles varient de 80 pixels jusqu'à 800px.


Vignettes simples, 80x60, 100x75, 120x90, 160x120, etc

Vignettes volte/face, 80x60, 100x75, 120x90, 160x120, etc


Haut de page


Configurer le code HTML du gadget

Choisissez d'abord les paramètres dans ce tableau. Ensuite, recopiez les codes ci-dessous aux endroits mentionnés.

N° d'identification du gadget Choisir entre 1 et 999. Si vous avez déjà installés des gadgets "libellés" sur votre blog, veillez à ne pas choisir le même numéro.
Afficher dans la version mobile personnalisée ?
Titre du gadget
Thème
Taille de la miniature px
Ouverture des liens
liens rel="nofollow"
Condition d'affichage


Haut de page


Le code du gadget

<b:widget id='LinkList502' locked='false' mobile='yes' title='Liens avec vignette' type='LinkList'>
<b:includable id='main'>
<!-- Thumbnails linkList by Blogger Code - Ref.: http://goo.gl/6avy6 -->
<link href='https://sites.google.com/site/bloggercodebc/home/widget/BCThumbnailsLinkList.css?attredirects=0&amp;amp;d=1' rel='stylesheet' type='text/css'/>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
  <b:loop values='data:links' var='bcThumbLink'>
    <div class='bcmode1 bc80x60'>
      <a expr:href='data:bcThumbLink.target'>
        <div class='thumbLink'>
          <img expr:src='&quot;http://www.apercite.fr/api/apercite/80x60/oui/&quot; + data:bcThumbLink.target' alt=''/>
        </div>
        <div class='nameLink'>
          <data:bcThumbLink.name/>
        </div>
      </a>
    </div>
  </b:loop>
</div>
<div class='thumbnailscredits'>
  <a href='https://www.apercite.fr/'>Website thumbnails provided by Apercite</a>
  <span class='item-control blog-admin'>
    <a expr:href='&quot;//www.blogger.com/rearrange?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;widgetType=&quot; + data:widget.type + &quot;&amp;amp;widgetId=&quot; + data:widget.instanceId + &quot;&amp;amp;action=editWidget&amp;amp;sectionId=&quot; + data:widget.sectionId' expr:onclick='&quot;return _WidgetManager._PopupConfig(document.getElementById(&apos;&quot; + data:widget.instanceId + &quot;&apos;));&quot;' expr:target='&quot;config&quot; + data:widget.instanceId' expr:title='data:edit-link'><data:edit-link/></a>
    <a href='http://bloggercode-blogconnexion.blogspot.com/2013/05/widget-thumbnail-linklist-apercite.html' target='_blank' title='Tutoriel'>Tutoriel</a>
  </span>
</div>
</b:includable>
</b:widget>


Où copier ce code ?
  • Tableau de bord
  • Modèle
  • Modifier le code HTML


Emplacement A copier juste avant
Au-dessus du gadget blog1 <b:widget id='Blog1' locked='true' title='Articles du blog' type='Blog'>


Si vous avez suivi toutes les étapes, dans la mise en page, le gadget est à présent visible dans la colonne centrale juste au-dessus des articles.

Si l'emplacement ne vous convient pas, déplacez-le à votre convenance.


Déplacer le gadget


Haut de page


Les paramètres du gadget

Étant donné qu'il s'agit d'un gadget "liste de liens" modifié, les paramètres sont identiques à ceux du gadget "liste de liens (logique).

Tous les paramètres ont été conservés. Titre, nombre de liens à afficher, triage, nom et url.


Gadget Liste de liens avec vignettes


Haut de page


Modifier le thème ou/et la taille des miniatures dans le code du gadget

Le fichier CSS a été incorporé dans le code HTML du gadget. Il contient toutes les tailles et les 2 thèmes (simple et volte/face). Si pour une raison ou une autre vous avez besoin de modifier ces paramètres, changez les données directement dans le code HTML du gadget :


Modifier thème et taille


A noter que le gadget n'apparaîtra sur le blog que si il contient au moins un lien.


Haut de page


Liens divers

Assistance publique pour le produit Blogger sur les supports  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

Base de connaissancesFonctionnalitésContenu
Populaire
DéveloppementsMulti-versions
Facebook : Bouton J'aime [Like button]
Populaire
DéveloppementsMulti-versions
Twitter : Bouton Suivre [Follow button]
Populaire