Effet FancyZoom sur les images dans Blogger/Blogspot


Dans un précédent article, on a vu comment obtenir un effet lightbox dans Blogger/Blogspot.
Je vous avais parlé de l'effet FancyZoom du co-fondateur de Panic Software.
Aujourd'hui, on va voir comment installer cet effet sur Blogger/Blogspot.
Tout d'abord, rendez-vous sur le site de Cabel.
Il faut maintenant télécharger le soft.




Une fois téléchargé, il faut l'installer à la racine de son site, et c'est là que les problèmes commencent, puisqu'avec Blogger, on n'a pas accès par ftp aux fichiers du blog.

Il nous faut donc trouver une solution alternative, sur internet il y a de nombreux hébergeurs gratuits d'images, de vidéos et de scripts.

Personnellement, je vous conseille d'aller sur Google Sites, et d'ouvrir un site de la sorte vous pourrez héberger vos scripts ou autres documents.

Pour ma part, j'ai installé ces scripts sur mon site:

<script src="http://franck.melka.perso.sfr.fr/FancyZoom%201.1/js-global/FancyZoom.js" type="text/javascript"></script>
<script src="http://franck.melka.perso.sfr.fr/FancyZoom%201.1/js-global/FancyZoomHTML.js" type="text/javascript"></script>

En fonction de l'endroit où vous les hébergez, vous devrez modifier le chemin vers vos scripts.


Maintenant, rendez vous dans le tableau de bord de Blogger et développez: Modèles, ensuite entrez dans le code source:



Immédiatement après

<head>


collez vos scripts comme indiqué sur la capture d'écran, ci dessus.

Maintenant, reste le plus délicat, car sur les nouveaux modèles de Blogger, on ne trouve plus de balise

<body>


Alors suivez ce qui est affiché dans cette capture d'écran, ci dessous:


Juste après la balise,

</head>


Copiez et collez toute cette ligne en effaçant la ligne existante:

<body expr:class="&quot;loading&quot;data:blog.mobileClass" onload="setupZoom()">

C'est tout.

Attention, dans votre blog ce sera ou Lightbox ou FancyZoom.



NB: bien entendu, si vous souhaitez affiner ces effets, il vous faudra modifier le code installé sur votre serveur.
Enhanced by Zemanta

Commentaires

Enregistrer un commentaire

Posts les plus consultés de ce blog

Augmenter le paramètre memory_limit lors de l'installation de GLPI / increase php memory limit/MAMP/Apache/php

Image
Lors de l'installation de GLPI sur un MAC (OSX Snow Leopard) utilisant MAMP , on a toujours un message d'erreur nous indiquant que GLPI nécessite 64 Mio de mémoire et qu'il est important de lui allouer cette mémoire en configurant le fichier php.ini. Cette opération est facilement réalisable, comme nous allons le voir. Bien entendu, l'objectif de cet article n'est pas d'apprendre comment installer MAMP sur un MAC, ni GLPI dans MAMP. Tout d'abord, quel est le message qui s'affiche? Dans les test de la mémoire allouée, par défaut nous avons 32 Mio alors que GLPI en nécessite 64 au minimum, on nous demande donc d'augmenter les paramètres memory_limit dans le fichier php.in, mais lequel? Pour connaitre le fichier à modifier, il nous tout d'abord savoir  quelle version de php est installée sur notre serveur, pour cela rendez-vous dans la page d'accueil de MAMP et cliquer sur l'onglet phpinfo Ensuite vous aurez tous les él...
Lire la suite

Comment ajouter le bouton "like" de Facebook sur Blogger et obtenir des statistiques de Facebook

Image
Cet article sur le bouton "like" de Facebook est destiné à tous ceux qui voudraient installer un bouton "j'aime" dynamique de Facebook et avoir des statistiques de visites. A quoi ça ressemble? et qu'est ce que ça fait comme action, Ce bouton 'like" connecte votre visiteur à son compte Facebook, quand il clique sur votre bouton. Ce bouton est dynamique puisqu'il  permet à votre visiteur de commenter le lien à partager sur Facebook, tout en affichant la photo de son profil. Comment installer ce bouton? Tout d'abord: Aller sur: Tableau de bord Votre blog Présentation Modifier le code HTML Cocher la case"développer des modèles de Gadgets" *pour ceux qui le souhaitent: sauvegarder votre Thème" Quand vous êtes dans votre code source Faites ctrl+F pour lancer une recherche dans votre code Taper dans le champ de recherche:...
Lire la suite

Iphone Tracker, Androïd Tracker, Applications de Tracking pour SmartPhones et Téléphones Cellulaires

Image
Dernièrement les médias nous ont appris officiellement, ce que nous savions déjà depuis un peu plus d'un an et demi: à savoir que l'on peut suivre nos traces sur l'IPhone.Ces applications de tracking pour Smartphones et mobiles existent depuis bien longtemps et beaucoup d'entre-elles sont utilisées par la police comme preuves irréfragables devant les tribunaux. Voyons maintenant comment elles fonctionnent et sur quelles plateformes elles tournent. Tout d'abord la plus emblématique d'entre toutes: IPhone Tracker, créée par un ancien ingénieur d' Apple , disponible à cette adresse: IPhone Tracker . Le code source est disponible quant à lui à cette adresse: Code Source . Le code est en Objective-C est ne pourra être compilé que pour des MAC ( concernant IPhone Tracker ). Le principe: quand vous synchronisez votre Iphone ou ipad sur votre MAC, un fichier est créé, cette application va aller chercher sur votre disque dur ce fichier caché qui se no...
Lire la suite