Home Tutorial Internet Intégrer PicLens à votre site Web
Close Panel

Sandage

C'est quoi la meilleurs section sur BZ ?
 
Intégrer PicLens à votre site Web PDF Imprimer Email
Note des utilisateurs: / 0
MauvaisTrès bien 
Internet
Lundi, 28 Avril 2008 23:16

Ce mois-ci, nous allons utiliser le module PicLens pour enrichir votre site Web ou votre blog personnel. PicLens permet d’insérer de magnifiques diaporamas au sein de vos pages et, ainsi, les embellit encore un peu plus.
 
 
 
 
 

 

 

 

1 Installer PicLens

PicLens, développé par Google, n’était au départ qu’une simple extension destinée au navigateur Firefox qui permettait de diffuser des diaporamas. Depuis, ce module a été développé pour d’autres navigateurs tels qu’Internet Explorer, Safari, etc. Et il peut désormais s’appliquer aussi à un support en ligne, de manière à faire défiler des clichés sur son espace de la Toile.
Seul bémol : l’application est en anglais.


Attention ! Avant de vous tourner vers PicLens, vérifiez bien que, sur votre ordinateur (tournant sous Windows 2000, XP ou Vista) vous êtes équipé du .net framework 2.0. Kèsaco ? Un moteur de développement de Microsoft, disponible gratuitement en téléchargement sur le site Windows Update en tant qu’installation facultative. Mais il est fort possible que cette application soit déjà présente sur votre machine, notamment par le biais de votre carte graphique.
Une fois ce point vérifié, nous pouvons installer PicLens. Rendez-vous sans plus attendre sur le site www.piclens.com pour le télécharger : prenez garde de ne pas télécharger le plug-in pour navigateur. Nous, c’est l’application qui génère des diaporamas en ligne qui nous intéresse. Pour éviter de vous perdre, l’adresse directe est www.piclens.com/lite/publisher-win.php.
Cliquez sur Download pour télécharger l’installeur (il “pèse” 2,5 Mo) et suivez la procédure d’installation, somme toute très simple.

2 Préparer les photos

Lancez l’application PicLens Publisher en double-cliquant sur l’icône du même nom. Première étape, cliquez sur Select Folder afin de sélectionner le dossier où sont enregistrées les photos à mettre en ligne, puis cliquez sur Next. Ensuite, vous pouvez éventuellement décocher des photos du dossier et/ou cliquer sur Add files pour ajouter un autre dossier. Cela fait, cliquez sur Next. Enfin, sélectionnez ou créez un dossier où PicLens déposera les fichiers générés pour le diaporama (images, vignettes, Javascript, Flash et HTML). Il ne vous reste plus qu’à cliquer sur Next. Ouvrez maintenant le dossier de destination, vous y trouverez un fichier nommé Gallery.html.
Un simple double clic ouvre le diaporama sur votre poste. Tout est prêt pour être mis en ligne.

3 Mise en ligne

À l’aide de votre habituel logiciel de publication FTP (comme d’habitude, nous vous recommandons l’excellent FileZilla, www.filezilla.fr), connectez-vous sur votre hébergement et envoyez le dossier généré. Dans ce cas précis, votre diaporama est consultable sur ce modèle : http://monsite.com/mondossier/gallery.html.
N’hésitez pas à renommer votre fichier gallery.html en index.html, votre diaporama s’en trouvera directement consultable sur le modèle suivant : http://monsite.com/mondossier.
Encore mieux, maintenant, nous allons insérer le diaporama dans une page Web existante. Dans l’entête (<head></head>)
de la page concernée, ajoutez la ligne suivante :

<link id="gallery" rel="alternate" href="/photos.rss" type="application/rss+xml">

Ensuite, au même endroit, insérez le lien vers le Javascript :

<script type="text/javascript" src="http://lite.piclens.com/current/piclens.js"></script>

Enfin, faites un lien dans le body vers le diaporama sur le modèle qui suit :

<a href="javascript:PicLensLite.
start();">clic</a>


Vous trouverez ces codes source dans les fichiers gallery.html et instructions.html.

 

Ajouter au favorie

Add to: JBookmarks Add to: Facebook Add to: Mr. Wong Add to: Webnews Add to: Buzka Add to: Icio Add to: Ximmy Add to: Oneview Add to: Kledy.de Social Bookmarking Add to:  FAV!T Social Bookmarking Add to: Favoriten.de Add to: Seekxl Add to: Social Bookmark Portal Add to: BoniTrust Add to: Power-Oldie Add to: Bookmarks.cc Add to: Newskick Add to: Newsider Add to: Linksilo Add to: Readster Add to: Yigg Add to: Linkarena Add to: Digg Add to: Del.icoi.us Add to: Reddit Add to: Jumptags Add to: Upchuckr Add to: Simpy Add to: StumbleUpon Add to: Slashdot Add to: Netscape Add to: Furl Add to: Yahoo Add to: Blogmarks Add to: Diigo Add to: Technorati Add to: Newsvine Add to: Blinkbits Add to: Ma.Gnolia Add to: Smarking Add to: Netvouz Add to: Folkd Add to: Spurl Add to: Google Add to: Blinklist Information

Who's Online

Nous avons 49 invités en ligne
Ads by VADpay