Galerie Web

Dans la série automatisation : comment créer une galerie web avec Photoshop.

Vous pouvez créer une galerie d'image ou un diaporama à partir des fonctions d'automatisation de Photoshop.

Photoshop crèe des pages web à partir d'un ensemble d'images stockées dans un répertoire, et génère les vignettes qui permettent d'accéder à ces images.

Pour créer ces pages, rien de plus simple.
Placez les images originales dans un répeertoire de votre choix.
Dans Photoshop : Fichier / Automatisation / Galerie Web Photo...

L'écran se décompose en 3 zones, Site, Dossiers, Options.

Dans la zone Site :
-Choisissez un style pour la galerie dans le menu déroulant Styles (Un aperçu de la page d'accueil dans le style choisi apparaît à droite).
- Entrez votre adresse électronique si vous le désirez
- Choisissez l'extension de votre page web.

Dans la zone Dossiers :
- Parcourir vous permettra de sélectionner le répertoire où vous avez placé vos images
- Inclure tous les sous-dossiers permet d'inclure les images contenues dans le(s) sous-dossiers du dossier sélectionné
- Destination vous permet de sélectionner le répertoire qui contiendra les images et les pages html de la galerie

La zone Options :
- Un menu déroulant vous permet de sélectionner les différentes options.
- Pour chaque option, vous pourrez définir un certain nombre de paramètre. Les paramètres sont facultatifs.

Option Bannière :

- Dans le champ Nom du site, entrez le titre que vous voulez voir apparaître pour votre galerie.
- Dans le champ Photographe, entrez le nom... du photographe.
- Le champ Coordonnées du contact, vous permet d'entrer les informations pour vous contacter (numéro de téléphone, adresse...)
- Dans le champ Date, entrez la date qui doit apparaître sur chaque page de la galerie (date du jour par défaut).
- Police et Corps, permettent de définir le style de texte utilisé.

Option Grandes images:

- Redimensionner les images permet de redimensionner les images avant de les mettre dans les pages de la galerie,
- Choisissez la taille d'image dans le menu déroulant ou entrez une taille en pixels maxi 800).
- Conserver, permet de choisir les dimensions d'image à conserver lors du redimensionnement.
- Qualité JPEG, permet de choisir la qualité de l'image. Une valeur élevée donne une meilleure qualité, mais fichier plus gros.
- Taille du cadre, permet de définir la largeur en pixels du cadre autour de l'image.
- Titres avec, permet de choisir ce qui doit s'afficher sous l'image.
Police et Corps, permettent de définir le style de texte utilisé.

Option Vignettes :

- Dans le menu déroulant Taille sélectionnez une taille ou entrez la valeur en pixels de la largeur de chaque vignette.
- Colonnes et Rangées, permettent de définir le nombre de colonnes et de rangées à utiliser pour afficher les vignettes.
- Dans la zone Taille du cadre, entrez la largeur en pixels du cadre entourant chaque vignette.
- Taille du cadre, permet de définir la largeur en pixels du cadre autour de l'image.
- Police et Corps, permettent de définir le style de texte utilisé.

Option Couleurs personnalisées :

- Permet de changer la couleur d'un élément particulier.

La dernière option, Protection, permet de définir un texte qui s'affichera sur chaque image.

Une fois toutes les options définies, cliquez sur OK et Photoshop crèera les différentes pages.

Dans le répertoire de destination, vous trouverez les fichiers html de base, un répertoire images contenant les grandes images, un répertoire pages contenant les pages faisant appel à ces images et un répetoire thumbnails contenant les vignettes.

Cliquez sur le fichier index.html pour utiliser la galerie.

Il ne vous reste plus qu'à placer les fichiers sur le serveur ou à les adresser à la personne de votre choix pour qu'elle puisse visionner vos photos.

 

Modification / Création d'un style

Je ne m'étendrais pas trop sur cette partie car ce n'est plus de Photoshop mais de HTML dont il est question.

Je vous indique juste le principe, si vous voulez plus de détails, contactez-moi.

Allons-y :o).

Quand vous créez une galerie avec l'option Fichier/Automatisation/Galerie web photo vous choisissez un style de galerie.

Vous pouvez créer le votre.

Les styles se trouvent dans le répertoire de photoshop par exemple: C:\Program Files\Adobe\Photoshop 7.0\Paramètres prédéfinis\Galerie Web Photo

pour créer votre propre style, copiez le répertoire que vous utilisez habituellement comme style et renommez le à votre goût.

Allez dans ce répertoire. Vous y trouverez 4 fichiers htm : Caption.htm - IndexPage.htm - SubPage.htm - Thumbnail.htm et un répertoire Images

Le répertoire images contient les images des pages web que vous allez générer (les flèches page précédentes, page suivante par exemple) et éventuellement une feuille de style.

Si vous voulez changer, ces images, remplacez les par les vôtres en leur donnant le même nom que les images d'origine.

Vous n'avez plus qu'à modifier les différentes pages web en ajoutant une image de fond, un logo, un titre par exemple. Je vous laisse essayer les différentes options.

Quand les pages vous conviennent, lancez la generation de vos pages web en sélectionnant le répertoire que vous avez créé dans la liste des styles.