Websnapr transforme votre homepage en vignette

Websnapr est un service gratuit qui génère automatiquement et (presque selon la charge du serveur) instantanément une capture d’écran de n’importe-quelle page web au format 202×152 pixels.Il suffit d’appeler l’URL suivante dans votre navigateur : http://images.websnapr.com/?url=MYURL, en remplaçant bien sûr la variable MYURL par l’adresse du site sans le http:// que vous souhaitez capturer, comme

WebsnaprWebsnapr est un service gratuit qui génère automatiquement et (presque selon la charge du serveur) instantanément une capture d’écran de n’importe-quelle page web au format 202×152 pixels.
Il suffit d’appeler l’URL suivante dans votre navigateur : http://images.websnapr.com/?url=MYURL, en remplaçant bien sûr la variable MYURL par l’adresse du site sans le http:// que vous souhaitez capturer, comme ici par exemple (ce qui donne donc http://images.websnapr.com/?url=www.presse-citron.net), et vous obtenez une jolie miniature, que vous pourrez utiliser pour illustrer vos liens.

Mais le service ne s’arrête pas là : un bout de code javascript vous est fourni pour implanter la fonction directement dans votre site, et là je dois dire que c’est assez sympa : regardez ce que ça donne en survolant ce lien par exemple.
Pas mal non ?
Alors pour installer le bazar :
1. téléchargez ce fichier previewbubble.zip
2. décompressez-le où vous voulez dans un répertoire de votre site (j’ai mis previewbubble.js dans la racine de mon répertoire dotclear et bg.png dans /images/)
3. ouvrez previewbubble.js et mettez le bon chemin vers l’image bg.png à la ligne 10 du fichier (pour moi :/dotclear/images/bg.png car mon index.php est en dehors du répertoire /dotclear/)
4. copiez cette ligne de code dans le header de votre page template : <script type="text/javascript" src="previewbubble.js"></script>
5. ajouter une classe de style previewlink dans vos balises de liens comme ça : <a class="previewlink" href="http://www.presse-citron.net" hreflang="fr">
C’est fait : à vous les zolis liens illustrés au survol du mulot 🙂
Et connaissant la passion des développeurs qui traînent par ici, je ne donne pas longtemps avant que quelqu’un améliore le système afin d’automatiser complètement le processus, pourquoi pas sous la forme d’un plugin Dotclear…


Nos dernières vidéos

31 commentaires

  1. Ah ouais, exact : décalage. C’est bizarre parce-que j’ai testé ce matin dans IE (et dans Opera) et ça marchait nickel comme dans Firefox.

  2. Les attributs de style sont dans le fichier previewbubble.js. C’est là qu’il faut faire les modifs pour IE, si quelqu’un a le courage et le temps de s’y coller…

  3. Suis-je le seul à penser qu’il serait utile d’avoir un screenshot à coté de chaque lien dans ses favoris (ça m’éviterais de cliquer sur tous mes favoris juste parce que j’ai oublié le nom d’un site…) ?
    Je rêve d’une extension FF…

  4. Par contre ce qui m’embete tjrs avec ce genre de service c’est d’être dépendant du site à l’origine du projet…

    Je suis quelqu’un de prévoyant un peu trop parfois 😉

    je m’explique :
    les apercus vignette sont générés dynamiquement en utilisant un script du site images.websnapr.com?url=….

    Et si le site ferme ses portes pour une raison ou pour une autres… tous les apercus que vous aurez plaçé sur vos liens disparaitront…

    Mais heureusement j’ai bien regardé le script et il y a moyen de l’adapter assez facilement (avec surement l’utilisation d’expression régulière) pour afficher des vignettes stockées directement sur votre serveur.

    C’est toujours rassurant de savoir que l’on peut adapter un script en cas de "fermeture" du site proposant le service. 😉

  5. Question de béotien, sans doute, mais pourquoi ce format singulier de 202 x 152 pixels? Pourquoi pas simplement 200×150?
    Bonne journée.

  6. OUi effectivement c’est pas vraiment instantanée…

    J’ai mis le lien il y a plus d’un quart d’heure sur mon site et le survol affiche tjrs thumbnail in queue…

    Eric juste une petite question :
    c’est normal que l’on ne puisse pas sélectionner des parties de texte sur ton blog ?
    quand je selectionne avec la souris ca me prend des gros blocs et je n’arrive pas à selectionner seulement une partie du texte…

    C’est un peu gênant pour copier l’url de trackback 😉 j’ai du me tapper l’url à la main car impossible de la sélectionner pour le copier-coller

  7. Ben non ça marche, tu peux bien sélectionne le texte ou le mot que tu veux, faut juste bien viser. Tu utilises Firefox je suppose ?

  8. En l’occurence j’utilisais IE…

    et effectivement ça fonctionne parfaitement avec Firefox 🙂

    C’est quand même curieux de ne pas arriver à faire une sélection d’un bloc de texte avec IE… d’autant plus que j’ai testé sur mon site et j’y arrive sans problème

  9. c’est nickel sous Firefox et ie.
    Mais il faut effectivement attendre une vingtaine de minutes pour que les images soient disponibles.
    Merci pour l’info !

  10. Je trouve ça assez bien c’est exactement ce que je recherche, mais peut on passer tous les parametres dans un template et lancer les liens avec une base mysql.
    En gros que ce soit dynamaique avec une base de donnée (type annuaire ?)

  11. Je soupçonne un click intempestif au mauvais endroit alors que mon browser était figé quelques secondes ou que sais-je… Toujours est-il qu’une malencontreuse manipulation me pourrit l’existence avec… websnapr.

    A chaque fois que je sélectionne un lien dans Firefox, une fenêtre websnapr 2.0 se déroule et un message me dit « Thumbnail has been queued » avec une pub pour http://www.mister-wong.com. Ce message pointe sur le lien que j’ai sélectionné. Je peux déplacer cette fenêtre mais pas la sortir du browser… elle est donc bien intégrée à Firefox et étonnement, je ne trouve personne qui rencontre le même problème.

    Je ne sais absolument pas comment me débarasser de ceci, mon anti-spyware mis à jour ne détecte rien, je ne trouve rien dans la base de registre, j’ai pas encore analysé les fichiers de config de Firefox, peut-être que…

    Si une bonne âme pouvait me donner la solution, ce serait cool.

  12. Malheureusement depuis le passage à la version 2.0, les choses sont devenues beaucoup plus contraignantes… Rien que le fait d’imposer le passage à la v2 me semble pas très sain. Une alternative à cette fonctionnalité intéressante ?

Répondre