Voilà un tutorial que je reprends et adapte depuis ce site :
http://www.virusphoto.com/1887-creez-votre-propre-site-web-en-utilisant-les-images-de-votre-album-flickr.html
La question est de se dire comment mettre en place une galerie d'image dynamique sans prendre des années et comment la maintenir avec des images fraîches au jour le jour... La solution : utiliser les mêmes outils que d'habitude, Flickr, et quelques pages HTML... Comme Flickr à son nouvel ami, Picnik, on a une solution qui tient pas mal la route et qui une fois en ligne va se positionner sans avoir à garder son ordinateur pas loin...
Un site web avec mes images Flickr
Flickr est le site de partage de photos le plus utilisé, perso, cela fait un peu plus d'un an que je l'utilise. Il est possible d'envoyer simplement les images vers Flickr, avec tout une série d'outils plus ou moins intégré dans les outils de gestion des images de façon simple et efficace.
Quand on construit un site Web, la mise en place via FTP ou l'upload des images l'une après l'autre est assez barbare... et une approche permettant de mettre en ligne directement des images sur son web à partir de ce que Flickr propose est sympa et plus simple.
La méthode ici va proposer d'utiliser deux outils pour construire un site Web Flash en exploitant un Set Flickr !
Nous allons dans un premier temps mettre en place un site Flash puis lier ce site que nous n'aurons pas à modifier ou mettre à jour avec la mise à jour des images directement depuis le Set Flickr ! Le site sera maintenu uniquement par la gestion des images dans l'application Flickr directement, une image enlevée de cet album ne sera plus sur le site et vice versa !
Nous allons utiliser Simple Viewer et Flickr Viewer.
Dans un premier temps j'ai crée un album (set Flickr) qui s'appelle Another Gallery, ce set servira de base à la publication du site que je vais construire. Pour construire ce set, je mets en place directement dans l'outil Flickr la construction d'un set.
Nous allons construire un site web pour cela il va falloir disposer d'un espace, j'ai fais le choix de prendre un espace chez Free.fr, nous verrons dans la suite que nous allons de plus abstraire le lien vers cet espace en mettant en place, une redirection DNS permettant de donner au site et donc à la galerie, une adresse compréhensible par le commun des internautes !
D'autres solutions d'hébergement peuvent être choisi, quelques contraintes existent liés aux outils utilisés qui nécessité certaines fonctions PHP disponibles. En particuliers, il est nécessaire que la fonction fopen soit disponible. L'approche retenu ne nécessite pas de base de donnée puisque toutes les informations sont distantes sur le site de Flickr et dans les bases de Flickr.
Nous n'allons mettre en place que des couches de présentation et pas de logique ou de traitement dans ces sites.
J'ai donc un expace web disponible sous : http://sebastien.cazajous.free.fr/ et dans cet espace, je mets en place un répertoire permettant d'accueillir mon application PHP et les liens vers Flickr : http://sebastien.cazajous.free.fr/titoFromToulousegallery/.
Je vais faire un tour chez Gandi et je mets en place une redirection DNS qui permet de faire pointer http://foto.cazajous.net/ vers ce répertoire, qui a pour adresse complète : http://sebastien.cazajous.free.fr/titoFromToulousegallery/
On aura pour résultat lors de l'accès à la ressource http://foto.cazajous.net, l'accès à l'espace que l'on est en train de constuire. Les bases sont posés, il faut maintenant mettre en place les outils techniques et logiciels permettant de délivrer le service.
Pour mettre en ligne le site, il va vous falloir les outils traditionnels des webmasters : éditeur html, éditeur d'image pour mettre en place les logos et client ftp pour envoyer le tout chez Free.fr !
Il faut d'abord télécharger les deux packages des applications Simple Viewer et Flicker Viewer... C'est par là !
(attention, téléchargez bien cette version et pas une autre, sinon celà ne fonctionnera pas).
Après ces téléchargements, décompressez en local les deux archives dans le même répertoire. Ouvrez le dossier simpleviewer, et remplacez le fichier index.html par le même fichier contenu dasn le répertoire FlickrViewer.
Prenez le fichier "flickrViewer.php" issu du répertoire FlickrViewer et placez le dans le répertoire simpleviewer.
Nous avons tous les éléments pour configurer l'application afin de lier la librairie Flickr et votre set.
Pour cela, nous devons obtenir unr clé d'API de la part de Flickr. Cette clé permet de se connecter à Flickr de façon "batch" sans avoir à se signer avec son login password, et de ne pas conserver dans un fichier ce couple.
Pour obtenir cette clé, il faut autoriser le site web que l'on va crée à joindre Flickr. Il faut aller à cette adresse, se connecter avec son compte Flickr.
Ensuite, Flickr veut quelques informations sur l'usage que l'on veut faire de l'API, il faut compléter le formulaire, choisir l'option "non-commercial use", puis décrire l'application que l'on est en train de constuire dans le champ "Describe the application are you planning to build", par exemple :
On valide les conditions d'utilisation et un code s'affiche, il s'agit de la clé à conserver précieusement pour la suite.
Maintenant que la clé est obtenue, on peut configurer les composants pour accéder à Flickr.
Il est nécessaire maintenant de prendre en compte cette clé afin de la positionner dans les codes fournis pour accéder à son compte Flickr, pour cela il faut éditer le fichier flickrViewer.php.
Il est ensuite nécessaire de modifier la clé Flickr à la ligne 22 :
Remplacez b4bb27c883f06aa4575c6c346c402749 par votre clé API obtenue ci-dessus.
Attention à bien conserver les apostrophes autour de la clé.
Ensuite, il est nécessaire de modifier l'identifiant du set Flickr. On trouve cet identifiant en allant sur la page du set directement. Ainsi pour une page :
http://www.flickr.com/photos/cazajous/sets/72157594541098365/
La clé du set sera : 72157594541098365 !
On pourra alors modifier le fichier avec la valeur précédente :
Attention à bien conserver les apostrophes autour de ce chiffre.
Enfin, encore une étape importante, la modification de l'adresse Flickr afin de permettre l'accès à votre album et pas à celui du voisin !
Remplacez cazajous par votre identifiant Flickr.
Attention à bien conserver le "/" final, ainsi que les apostrophes.
On définit ensuite un fichier temporaire, dans le répertoire courant, on crée à la racine du site avec un logiciel FTP, il est nécessaire de mettre en place des droits cohérents sur le répertoire en 777 :
Finalement, on prend en compte les préférences, durée du cache :
Ceci correspond à la période pendant laquelle les photos sont conservées en mémoire (dans le dossier temporaire qu'on vient de créer), en secondes.
Plus cette période est longue, moins votre site n'aura à recourir à Flickr pour aller y chercher des informations.
Mais aussi, moins votre site sera actualisé régulièrement.
43200 secondes correspond à 12 heures, c'est un bon choix. Mais vous pouvez changer cette valeur (0 = rien n'est conservé en mémoire).
Titre du site :
Lien vers Flickr :
Titre des images :
Laissez à true si vous voulez affichez le titre de l'image (récupéré depuis Flickr), ou mettez false si vous ne le souhaitez pas.
Avec quelques notions de HTML, on peut faire beaucoup mieux si nécessaire, mais on peut s'arrêter là... On envoye tout ça sur le site de Free via FTP et ...
Ca marche !
Quand on construit un site Web, la mise en place via FTP ou l'upload des images l'une après l'autre est assez barbare... et une approche permettant de mettre en ligne directement des images sur son web à partir de ce que Flickr propose est sympa et plus simple.
La méthode ici va proposer d'utiliser deux outils pour construire un site Web Flash en exploitant un Set Flickr !
Nous allons dans un premier temps mettre en place un site Flash puis lier ce site que nous n'aurons pas à modifier ou mettre à jour avec la mise à jour des images directement depuis le Set Flickr ! Le site sera maintenu uniquement par la gestion des images dans l'application Flickr directement, une image enlevée de cet album ne sera plus sur le site et vice versa !
Nous allons utiliser Simple Viewer et Flickr Viewer.
Dans un premier temps j'ai crée un album (set Flickr) qui s'appelle Another Gallery, ce set servira de base à la publication du site que je vais construire. Pour construire ce set, je mets en place directement dans l'outil Flickr la construction d'un set.
Nous allons construire un site web pour cela il va falloir disposer d'un espace, j'ai fais le choix de prendre un espace chez Free.fr, nous verrons dans la suite que nous allons de plus abstraire le lien vers cet espace en mettant en place, une redirection DNS permettant de donner au site et donc à la galerie, une adresse compréhensible par le commun des internautes !
D'autres solutions d'hébergement peuvent être choisi, quelques contraintes existent liés aux outils utilisés qui nécessité certaines fonctions PHP disponibles. En particuliers, il est nécessaire que la fonction fopen soit disponible. L'approche retenu ne nécessite pas de base de donnée puisque toutes les informations sont distantes sur le site de Flickr et dans les bases de Flickr.
Nous n'allons mettre en place que des couches de présentation et pas de logique ou de traitement dans ces sites.
J'ai donc un expace web disponible sous : http://sebastien.cazajous.free.fr/ et dans cet espace, je mets en place un répertoire permettant d'accueillir mon application PHP et les liens vers Flickr : http://sebastien.cazajous.free.fr/titoFromToulousegallery/.
Je vais faire un tour chez Gandi et je mets en place une redirection DNS qui permet de faire pointer http://foto.cazajous.net/ vers ce répertoire, qui a pour adresse complète : http://sebastien.cazajous.free.fr/titoFromToulousegallery/
On aura pour résultat lors de l'accès à la ressource http://foto.cazajous.net, l'accès à l'espace que l'on est en train de constuire. Les bases sont posés, il faut maintenant mettre en place les outils techniques et logiciels permettant de délivrer le service.
Pour mettre en ligne le site, il va vous falloir les outils traditionnels des webmasters : éditeur html, éditeur d'image pour mettre en place les logos et client ftp pour envoyer le tout chez Free.fr !
Il faut d'abord télécharger les deux packages des applications Simple Viewer et Flicker Viewer... C'est par là !
(attention, téléchargez bien cette version et pas une autre, sinon celà ne fonctionnera pas).
Après ces téléchargements, décompressez en local les deux archives dans le même répertoire. Ouvrez le dossier simpleviewer, et remplacez le fichier index.html par le même fichier contenu dasn le répertoire FlickrViewer.
Prenez le fichier "flickrViewer.php" issu du répertoire FlickrViewer et placez le dans le répertoire simpleviewer.
Nous avons tous les éléments pour configurer l'application afin de lier la librairie Flickr et votre set.
Pour cela, nous devons obtenir unr clé d'API de la part de Flickr. Cette clé permet de se connecter à Flickr de façon "batch" sans avoir à se signer avec son login password, et de ne pas conserver dans un fichier ce couple.
Pour obtenir cette clé, il faut autoriser le site web que l'on va crée à joindre Flickr. Il faut aller à cette adresse, se connecter avec son compte Flickr.
Ensuite, Flickr veut quelques informations sur l'usage que l'on veut faire de l'API, il faut compléter le formulaire, choisir l'option "non-commercial use", puis décrire l'application que l'on est en train de constuire dans le champ "Describe the application are you planning to build", par exemple :
| I need to have an API key to make use of the Flickr API with FlickrViewer and SimpleViewer (weeting.org/mark/flickrviewer/) on my website (http://foto.cazajous.net). |
Maintenant que la clé est obtenue, on peut configurer les composants pour accéder à Flickr.
Il est nécessaire maintenant de prendre en compte cette clé afin de la positionner dans les codes fournis pour accéder à son compte Flickr, pour cela il faut éditer le fichier flickrViewer.php.
Il est ensuite nécessaire de modifier la clé Flickr à la ligne 22 :
| $apikey = 'b4bb27c883f06aa4575c6c346c402749'; |
Attention à bien conserver les apostrophes autour de la clé.
Ensuite, il est nécessaire de modifier l'identifiant du set Flickr. On trouve cet identifiant en allant sur la page du set directement. Ainsi pour une page :
http://www.flickr.com/photos/cazajous/sets/72157594541098365/
La clé du set sera : 72157594541098365 !
On pourra alors modifier le fichier avec la valeur précédente :
| $setid = '72157594541098365'; |
Enfin, encore une étape importante, la modification de l'adresse Flickr afin de permettre l'accès à votre album et pas à celui du voisin !
| $userurl = 'http://www.flickr.com/photos/cazajous/'; |
Attention à bien conserver le "/" final, ainsi que les apostrophes.
On définit ensuite un fichier temporaire, dans le répertoire courant, on crée à la racine du site avec un logiciel FTP, il est nécessaire de mettre en place des droits cohérents sur le répertoire en 777 :
| $cache = "tmp/flickr.xml"; |
| $ttl = 43200; |
Plus cette période est longue, moins votre site n'aura à recourir à Flickr pour aller y chercher des informations.
Mais aussi, moins votre site sera actualisé régulièrement.
43200 secondes correspond à 12 heures, c'est un bon choix. Mais vous pouvez changer cette valeur (0 = rien n'est conservé en mémoire).
Titre du site :
| $title = "Another Gallery"; |
| $showImageLink = true; |
| $showImageCaption = true; |
Avec quelques notions de HTML, on peut faire beaucoup mieux si nécessaire, mais on peut s'arrêter là... On envoye tout ça sur le site de Free via FTP et ...
Ca marche !
Aucun commentaire:
Enregistrer un commentaire