ajouter un diaporama picasa sur un blog

obtenir ces boutons

Ajouter un diaporama : 2° partie

Diaporama avec les images d'un album Picasa : autre méthode

Le diaporama fourni par le site Picasa est présenté ci-dessous. Inconvénients : en cliquant sur les images, on se retrouve dans l'album concerné, sur le site Picasa. En plus, le diaporama s'arrête à la fin de l'album. On peut l'éviter : il suffit d'utiliser le code fourni sur la page précédente.



Méthode de création :

1) Avoir un compte google ou d'en créer un : cliquer ici.

2) Cliquer sur "Transférer".

3) Créer un album photo. Remplir les champs et cliquer sur "Continuer".

4) Cliquer sur "Ajouter des photos". Parcourir le disque dur et sélectionner les images de votre choix. On peut en sélectionner plusieurs à la fois (enfoncer la touche Ctrl). Cliquer sur "Transférer".

5) Rendre l'album "Public". Pour cela :
- cliquer sur : "Modifier" - "Propriétés de l'album" ;
- à côté de "Partager", sélectionner : "Public" ;
- cliquer sur "Enregistrer les modifications".

6) Allez dans la marge de droite de Picasa web et cliquer sur "Lien vers cet album" puis sur "Insérer un diaporama dans une page Web".

7) Choisir la taille du diaporama, les légendes, une lecture automatique ...

8) Copier le code :
<embed type="application/x-shockwave-flash" ... ></embed>

9) Insérer le code dans un message ou un gadget HTML/JavaScript.

10) Changer les dimensions du diaporama (width="..." height="...") :
- "width" devra correspondre à toute la largeur disponible : les images plus larges s'afficheront ainsi plus grandes ;
- "height" correspondra à l'image la plus haute.

11) Remplacer la couleur de fond noire par la couleur de fond du blog comme dans l'exemple ci-dessus. Cela évitera que des bandes noires apparaissent autour des images qui n'ont pas les proportions standard. Méthode : changer les 6 derniers chiffres dans RGB=0x000000.

* * * * *
Troisième possibilité : on peut aussi utiliser le gadget "Diaporama" de Blogger.

Mais il faut se contenter d'images de très petite taille au format vignette. Il ne peut convenir que pour être inséré une colonne latérale. En cliquant sur l'image, on se retrouve aussi dans l'album de Picasa.

On peut régler la vitesse de défilement.

La méthode à suivre est la suivante :

1) Accéder à "Picasa Web Albums".

2) Si l'album photos à utiliser n'existe pas encore, cliquer en haut de l'écran (au centre) sur "Transférer". Transférer des photos dans un album de "Picasa Web Albums".

3) Cliquer sur le nom de l'album concerné.

4) Rendre cet album "Public". Pour cela :
- cliquer sur : "Modifier" - "Propriétés de l'album" ;
- à côté de "Partager", sélectionner : "Public" ;
- cliquer sur "Enregistrer les modifications".

5) Dans la colonne de droite, cliquer avec le bouton droit de la souris sur l'icône avec la mention "RSS", et sélectionner "Copier l'adresse du lien".
Exemple : http://picasaweb.google.fr/data/feed/base/user/101739395493444581297/albumid/5410219684020459841?alt=rss&kind=photo&hl=fr
.

6) Dans le "Tableau de Bord", cliquer sur :
- "Mise en page" ;
- "Ajouter un gadget" ;
- "Diaporama".

7) Sélectionner : "Autre".

Adresse du flux : coller l'adresse copiée au point 5).

Enregistrer.

Pour agrandir la fenêtre d'affichage du diaporama, ajouter le paragraphe suivant (le chiffre doit être adapté à ses besoins) à l'intérieur du code de mise en page du modèle (template) de blog :

.slideshow-container
{
width: 500px;
}

5 commentaires:

Claire G. a dit…

Bonjour,
Merci pour tout votre décodage ... mais justement je n'arrive pas à faire accepter par Blogger le code du diaporama (<embed). Où le placer exactement ? Dans le modèle ? Où dans le modèle ? Quand je le place dans la section head il m'indique systématiquement une erreur et refuse ... Help ! Je voudrais mieux que les vignettes Blogger qui sont riquiqui et font amateur (ce que je suis) !

Paroisses de Carnac Plouharnel La Trinité a dit…

Merci, explications claires, et la visualisation avec la même couleur que le fond de la page est parfaite.
Questions : Existe t il des codes supplémentaires à ajouter pour piloter le démarrage, la pause, le faire tourner en boucle car avec ce code démarre immédiatement .
Merci
Jean-Jacques

Marnat a dit…

Bonjour

J'ai utilisé les diaporamas picasa dans plusieurs de mes blogs (via le lien
Problème: ce jour mes diaporamas ne sont plus visibles que ce soit sur Chrome, Mozilla ou internet explorer..) le flash player est à jour.
Je ne visualise pas non plus le modèle présenté sur cette page = carré blanc sans message.
Merci pour votre aide.

Kieran Pavel a dit…
Ce commentaire a été supprimé par l'auteur.
Meiser a dit…

Bonjour.
Essayez les instructions "float:left;", "padding-left:0px;" ou "margin-left:0px;".