Tutorial plugin JQuery : Delectable pour afficher les derniers bookmarks Delicious

jquery-delectable

Le plugin JQuery Delectable (encore un plugin par theodin) permet d’afficher très facilement les dernières adresses ajoutées à un compte Delicious. Il est similaire au plugin JQuery Tweetable dans son fonctionnement. Comme souvent, j’ai préparé une petite démo :

demo du plugin JQuery Delectable

Le plugin est assez complet car, en plus d’afficher l’URL du bookmark, on peut afficher les tags rattachés et la date d’ajout. Un système de mise en avant des tags est même intégré lorsque l’on clique sur un de ces tags.

Comme toujours, il faut importer JQuery et le plugin dans sa page HTML :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"><!--mce:0--></script>
<script src="js/jquery.delectable.js" type="text/javascript"><!--mce:1--></script>

On crée par la suite un bloc vide auquel on donne un id pour le sélectionner avec JQuery :

 

Il faut enfin initialiser le plugin JQuery en passant le sélecteur du div créé précédemment et quelques options :

$(document).ready( function () {
	$('#delicious').delectable({
                username: 'arnaudk', // nom d'utilisateur du compte Delicious
                tags: true, // on affiche ou non les tags
                date:true, // on affiche ou non la date d'ajout du bookmark
                limit: 20 // nombre de bookmarks à afficher
        });
});

Pour conclure, encore un plugin JQuery permettant de lier les divers réseaux sociaux et autres sites dits ‘2.0’. On peut maintenant afficher facilement son Twitter, ses dernières photos Flickr et ses derniers bookmarks Delicious sur une même page !

Ce contenu a été publié dans JQuery, avec comme mot(s)-clé(s) , . Vous pouvez le mettre en favoris avec ce permalien.

Une reponse a Tutorial plugin JQuery : Delectable pour afficher les derniers bookmarks Delicious

  1. Ping : links for 2009-10-23 « Ikan66

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *