Bienvenue sur le Journal du Blog, vous pouvez vous abonner au flux RSS. Merci pour votre visite!
Nous vous parlions du nouveau Widget MyBloglog il y a quelques jours, même s’il apporte des fonctionnalités très intéressantes vous ne l’avez pas adopté pour la plupart. Effectivement l’ancienne version du Widget MyBloglog est nettement plus discrète mais surtout plus personnalisable, ce qui permet en bricolant un peu de l’intégrer harmonieusement à votre blog.
Vous avez toujours la possibilité de générer un code pour l’ancien widget en cliquant ici :
Nous allons vous apprendre à bricoler le widget MyBloglog pour l’adapter, selon vos envies, à votre blog. Lorsque vous en générez le code, vous avez la possibilité de remplir les champs suivants :
Traduction :
- c_color_heading_bg : couleur de fond du titre
- c_color_heading : couleur du titre
- c_color_link_bg : couleur de fond des liens
- c_color_link : couleur des liens
- c_color_bottom_bg: couleur de fond du bas
- Width : largeur du widget
- Show Screen Names : affiche uniquement les avatars
- Images size : Avatar en grande ou demi taille
- Rows : nombre de lignes d’avatars affichés
- Title : titre du widget
Voici le code généré que vous allez placer à l’endroit où vous souhaitez qu’il apparaisse dans votre blog :
<script type=”text/javascript” src=”http://pub.mybloglog.com/comm2.php?mblID=2007063000240007&c_width=180&c_sn_opt=y&c_rows=5&c_img_size=f&c_heading_text=Recent+Readers&c_color_heading_bg=005A94&c_color_heading=ffffff&c_color_link_bg=E3E3E3&c_color_link=005A94&c_color_bottom_bg=005A94″></script>
On retrouve dans ce code les différents éléments qui vont vous permettre d’aller plus loin dans la customisation du widget MyBloglog. La première chose qui pose souvent problème est que la couleur de fond de votre blog n’est pas dans la palette proposé par le générateur de code. Pour cela il vous suffit de remplacer au bon endroit le code couleur par celui de votre blog
exemple : c_color_heading_bg=005A94 le fond du titre est en #005A94 il vous suffit de remplacer ce code couleur par celui que vous désirez. Notez que vous pouvez indiquer “none” pour qu’il n’y ait aucune couleur (fausse transparence)
Le reste de la customisation va se faire grâce à la feuille de style (style.css dans la plupart des cas)
Vous pouvez par exemple supprimer les différents liens qui se trouvent en dessous des avatars grâce à la ligne suivante (ajouter dans le css)
table#MBL_COMM td.mbl_fo_hidden, table#MBL_COMM td.mbl_join, table#MBL_COMM td.mbl_join_img {display:none;}
Vous pourrez ensuite attribuer une class css à votre widget avec le rajout suivant :
<div id=”mybloglog”>
<script type=”text/javascript” src=”http://pub.mybloglog.com/comm2.php?mblID=2007063000240007&c_widt…none&c_color_link=none&c_color_bottom_bg=none”></script>
</div>
Cet ajout vous permettra de définir dans votre feuille de style (CSS) des paramètres pour le widget MyBloglog, comme ceci:
#mybloglog {
text-align: left;
float: left;
margin: -107px 0px 0px 16px;
height: 50px;
}
On commence à voir quelques blogs qui présente le widget de manière rectiligne, pour cela il vous suffit de fixer le nombre de ligne (rows) à 1 et une largeur suffisamment grande (500px par exemple).
Il ne s’agit là que d’un exemple de ce que vous pouvez faire, l’attribution d’une classe (ou id) css vous permettra d’aller beaucoup plus loin. Si vous avez des questions n’hésitez pas à les poser dans les commentaires.
Vous avez aimé cet article : abonnez-vous au flux RSS
27 Responses
Et pour le mettre dans le header, de façon rectiligne, je n’ai trouvé aucune explication. Est-ce que quelqu’un du JDB pourrait m’aider ? Merci
Bonjour, je vais essayer de t’aider ;).
Concernant l’affichage rectiligne, dans le code de ton widget tu as : c_rows=X
où X est le nombre de colonnes affichées sur ton blog. En mettant c_rows=1 tu n’auras donc qu’une colonne, ce qui est le but recherché.
Pour la taille du widget, tu as, toujours dans le code :
c_width=X
Où X est la longueur de ton widget. A toi de voir, selon la longueur d’image de ton header ;), le plus simple étant bien sûr de faire quelques tests.
Pour finir, le code du widget de mybloglog est à insérer directement dans ton header, avant ou après ton image d’header, en fonction de l’endroit où tu souhaites l’afficher.
Et bien sûr, suivre les indications de ce billet pour enlever les informations et n’afficher que les avatars ;).
Si ce n’est pas assez clair, n’hésite pas.
Merci Aurelien,
En fait j’ai deja sur mon blog le widget mybloglog customizé sans les liens et tout, je l’ai mis dans ma sidebar. Avec Firebug, j’ai recopié le code du script de mon widget, changé un peu le code pour n’avoir qu’une seule ligne. Je l’ai placé dans la div navbarleft, car mon objectif est de le mettre dans le menu, entre contact et la barre de recherche. Et la le blog ne s’affiche plus, j’ai juste le widget qui se met en haut a droite sur fond blanc. Je comprends pas. Si tu te sens de jeter un oeil, c’est ici : http://www.jayworld.fr Merci
Honnêtement, je n’ai aucune idée :/
D’un autre coté, si je peux me permettre, il n’y pas beaucoup de place, enfin tu ne pourras pas afficher beaucoup de visiteurs, ce qui est dommage je trouve. Ou alors, mettre ton menu tout en haut (comme tu peux le voir sur ce blog) et disposer ton widget mybloglog en face de ta barre de recherche. Un peu comme ce que propose Gonzague sur son blog : http://blog.gonzaguedambricourt.com/
D’accord, je pense que je vais rester avec mon widget en sidebar. Comme tu dis, je pourrais afficher plus de visiteurs, c’est mieux. Merci pour ton aide. Ton thème est très simpa, d’ailleurs t’as un abonné en plus !
Merci, le Journal du Blog est un blog collaboratif, nous sommes plusieurs à écrire dessus. Et nous invitons d’ailleurs, depuis le début, nos lecteurs à proposer des articles (en rapport avec les thématiques abordées, bien évidemment).
Lol, je faisais allusion à ton blog perso
Rhoo pardon, j’y passe tellement moins de temps que du coup j’en fini par l’oublier :/. Les catégories dans le header sont très pratiques je trouve, tout comme le footer qui me permet de décharger la sidebar. Par contre je m’interroge sur le fait de mettre, ou non, des images dans le header et de mettre les widgets de mybloglog et de blogasty plus en valeur (car dans le footer, on ne les voit pas vraiment). Enfin comme tout thème qui se respecte, il ne me satisfait jamais complètement, et il est voué à évoluer régulièrement.
Merci beaucoup, je tâcherai de publier plus régulièrement sur mon blog que ces derniers temps pour le coup
Bonsoir,
Merci pour cette note. J’ai mis du temps mais j’y suis arrivé.
Julien
@Julien : le résultat est très sympa
Par contre, j’ai voulu ajouter ton blog à mon lecteur de flux RSS, et tu as un bug avec le plugin FeedBurner FeedSmith :/
@Aurelien Ah mince…je regarde ca de près
@Julien : quelle réactivité!!! Merci, je retenterai demain
[...] vous expliquions à travers un précédent tuto, comment utiliser le widget Mybloglog de manière rectiligne. Il peut être intéressant de réfléchir à la meilleure solution pour insérer ce widget à la [...]
Je viens d’installer le widget de manière rectiligne dans le header de mon blog … sur Firefox ça marche mais pas sur IE ??? …
Je voulais juste faire une remarque sur le fait de modifier le style du widget de Mybloglog … les modifications ne sont pas prisent en compte lors d’une connexion bas débit du style 3g … je viens de faire le test dans le train ! Par exemple le blog d’Aurélien explose avec la 3g …
Mais j’adore c’est trop bien ce petit widget !
Sans vouloir troller, et bien que la compatibilité sur tout les navigateurs est un élément indiscutable sur la toile, qui utilise encore IE? :p
Concernant mon blog, tu entends quoi par explose? En théorie, et je viens de tester à nouveau sur mon gsm, un plugin permet de lire mes billets sans afficher le blog, un peu comme un lecteur RSS (sauf que je viens de découvrir que ça ne prend pas les vidéos :/). Faut d’ailleurs que je trouve un autre plugin, celui-ci est bourré de pub :/
[...] rapport à l’ergonomie de mon blog. En parcourant le net, je suis tombé sur un article du journal du blog expliquant parfaitement la façon de customiser son widget. Cet article indique les modifications [...]
Merci pour le tuto, fort utile !
Ah ça fais plaiz de voir ce tuto, depuis le temps que j’en cherchai un sur Mybloglog, j’avais déjà pas mal galéré pour comprendre comment afficher le widget, maintenant je vais pouvoir aller un peu plus loin dans la customisation.
Merci beaucoup !!!!
Super petit tuto, merci beaucoup ! Depuis le temps que je me demandais comment les autres faisaient pour supprimer le lien “mybloglog”.
[...] et tout le monde saura dorénavant que vous êtes passés par là (le billet qui m’a un peu aidé, merci aux twitters [...]
Bonjour
Je ne vois pas click here donc je ne peux pas suivre les instructions
quand je slic sur Mybloglog en dessous des recent visitors dans My sites and services je vois un carré orange inscrit : Do you have a blog or Website? CHICK ERE to add it to your profil ?
Ca veut dire quoi ? je suis nul en anglais
merci de votre aide
je précise que j’arrive pas a remplir ça bloque pour un truc que je ne onnais pas
http://www.mybloglog.com/buzz/community ???
Super merci beaucoup, ce post m’a fait gagner du temps! J’ai plus qu’à l’appliquer chez moi!
Ahhh yeessss!!!
Merci bien, enfin ça va être plus claire et je vais peut-être enfin réussir à l’intégrer… Maintenant le plus dure est de choisir : http://www.lejournaldublog.com.....e-choisir/
Merci, c’est très utile, je cherche ceci depuis longtemps.
Merci mille fois. Ca fait longtemps que je cherchais cette astuce.
Bonjour
j’ai enfin pu trouver ce widget ‘dans son ancienne forme que je n’ai pas trouvé sur le site officiel de mybloglog.
par contre je ne suis pas arrivé à le customiser.
En essayant avec le code généré situé en haut du post et en mettant mon mblID, çà ne donne rien.
cela à peut être changé , je cherche encore.
Bravo pour le désign de ton blog et de toutes les infos intéressantes qui s’y trouvent.
Bonne continuation.