TPN°5 Page Galerie Wordpres

sObjectifs

Créer une page d’images Gérer les images

Ajout des images dans la bibliothèque

Nous allons ajouter toutes les images qui seront insérées dans la page galerie.

Ajouter à la bibliothèque toutes les images de la maison, de la terrasse, de la mer et du port se trouvant dans votre répertoire GIT.

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 1

Etat de la bibliothèque avec les images uploader.

Création de la page Galerie

La page d’accueil devrait ressembler à cela :

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 2

Il s’agit du titre de la page, il sera affiché par défaut en haut de la page avec une balise <h1>

Chaque image doit avoir un lien pour s’afficher à sa taille réelle.

Titre <h2>.

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 3

Par défaut les images sont insérées à la suite (css float) avec une largeur de 300 pixels.

Largeur du bloc principal : 960 pixels

Saisie du titre avec une balise <h3>

Insérer les 3 photos de la maison

Aperçu de la page

Nous allons améliorer la présentation en mettant pour chaque image : une largeur de 296 pixels à chaque image afin de remplir le bloc, un lien hypertexte pour afficher l’image à sa taille réelle.

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 4

Sélectionner chaque image pour la modifier.

Mettre un alignement à « Gauche » pour que l’image suivante vienne se placer sur la gauche, c’est-à-dire un float left.

Mettre une taille personnalisée à 296 pixels de largeur.

Terminer la page

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 5

Pour afficher l’image lors du survol de l’image.

Publication de la page pour voir son affichage sur le site.

Affichage du rendu de la page Galerie photos

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 6

Ajout de l’onglet Galerie dans le menu

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 7

Ajout de la page « Galerie photos » dans le menu.

Changer l’intitulé de l’onglet qui apparaîtra dans le menu.

BTS Tourisme 2ème année - GIT option multimédia - Wordpress TP n° 5 - Page 8

Affichage du site avec le menu modifié.