29 Mars 2013
/http%3A%2F%2F1.bp.blogspot.com%2F-nFw9l_b4hOc%2FUD4pozDJtaI%2FAAAAAAAAIn4%2F12aPDnhECOk%2Fs400%2FTab%2Bview%2Bwidget.jpg)
Gadget Affichage les articles par catégorie en onglet | LeBlogger : Astuces Blogger et Blogspot
Je vous présente un gadget pour votre template pour afficher les articles par catégories ou libellés Alors, je vais vous expliquer comment l'insérer sur votre modèle de blog. Il permet d'un coup d’œil de voir les derniers articles de vos catégories favoris. Alors le gadget se presente avec 6 onglets "catégorie" avec un affichage de quatre vignettes plus articles, pour plus de détails cliquer sur l'image ci-dessous ou cliquez sur la démo pour voir un exemple. DEMODémarrant l'explication du tuto : Vous connecter sur votre panneau blogger de votre compte Tant sélectionnez le blog que vous souhaitez ajouter ce curseur. Après cela, allez à >> Modifier le code HTML modèle, puis vérifiez élargir modèles de gadgets Juste au cas où, si quelque chose va mal dans l'édition ultérieure, vous devez sauvegarder votre premier modèle. INSERTION DES CODESAprès toutes ces étapes, mettez le code suivant au-dessus du code ]]> :#tabber-wrapper{width:640px;float:left;word-wrap:break-word;overflow:hidden}ul.tab-view{float:left;list-style:none;height:32px;border-bottom:1px solid #aaa;border-left:1px solid #aaa;width:638px;margin:0;padding:0}ul.tab-view li{float:left;height:31px;line-height:31px;border:1px solid #aaa;border-left:none;overflow:hidden;position:relative;background:#eee;margin:0 0 -1px;padding:0}ul.tab-view li a{text-decoration:none;color:#26231c;display:block;border:1px solid #eee;outline:none;font-weight:700;padding:0 15px}html ul.tab-view li.active,html ul.tab-view li.active a,html ul.tab-view li.active a:hover{background:#eee;color:#026ab5;border-bottom:1px solid #eee}.tab-wrapper{border:1px solid #aaa;border-top:none;overflow:hidden;clear:both;float:left;width:638px;background:#eee;margin-bottom:15px}.tabber{padding:10px 0}.tabber .column{float:left;display:inline;width:146px;margin:0 0 0 11px}.tabber h2{font:bold 12px Arial;line-height:15px;margin:7px 0 5px}.tabber h2 a{color:#222}.tabber h2 a:hover{color:#026ab5}Note : La largeur principale-wrapper (post-colonne) est de 640 px, puis la largeur des onglets doit être de la même largeur, qui est de 640 px. donc vous pouvez ajuster la largeur de la main-wrapper sur votre modèle. Et la largeur entre les onglet est de 2px (à droite et à gauche 1px), Alors le total de la largeur des onglets augmente avec les bordures épais 1px, donne 638 px de large. La largeur de chacun des posts ici 146 px, si votre modèle utilise une largeur "principale-wrapper" est plus petit, alors augmenter la largeur. L'étape suivante consiste à positionner le code suivant au-dessus du code :Description: Messages rouge: Norah Jones, Diana Krall sont les titres des ongles du gagets, vous pouvez les modifier. Les chiffres couleur bleu (146 et 95) ci-dessus est la largeur et la hauteur de la vignette sur la catégorie de poste, donc la taille réglable. Ensuite, insérer le code suivant avant le code
: La prochaine étape est de savoir comment placer le gadget sur notre blog. Chercher le code et plaçer aprés :
Enfin, enregistrer et voir le résultat. S'il vous plaît, s'il y a un probléme laissez un message dans les commentaires. Bonne chance.
http://www.leblogger.fr/2013/03/gadget-affichage-les-articles-par.html