zoom+ no zoom zoom-

Galerie WALMA3 pour SPIP

Suite à nos premières galeries walma, voici une nouvelle version relookée pour spip >= 1.8.2 qui permet d’afficher les images d’un article, ou de recréer une galerie à partir de votre recherche.

Voir la démo en ligne
Accès au forum walma
Voir les sites utilisant walma

Si vous appréciez l’usage de walma, merci de prendre le temps d’inscrire votre galerie.

walma.html

HTML - 22.4 ko
Téléchargez walma.zip !

Un seul fichier "walma.html" à mettre en ligne pour avoir une galerie modulable !

Pour utiliser la Galerie Walma, il vous faut un SPIP > 1.8.2, si tel n’est pas le cas, faites un tour sur SPIP !

Une fois votre SPIP installé

Paramétrez la création de vignettes en allant sur la page http://monsitespip/ecrire/config-fonctions.php3 soit
Configuration du site>Fonctions avancées

Reportez vous à la page de SPIP Le traitement des images

Si vous souhaitez en savoir plus pour optimiser vos images, un tutorial est à votre disposition ici

déposez via ftp le fichier walma.html

dans un dossier nommé squelettes à la racine de votre site spip, c’est tout ! à moins que vous ne préfériez le renommer en article-XX.html, XX étant le nom de votre rubrique galerie.

-  créez un article, faites "joindre un document" pour ajouter vos images puis rendez vous sur la page http://monsitespip/page.php3 ?fond=walma&id;_article=xx

-  gestion des langues facile ! : entrez dans le titre ou le descriptif de vos images cette balise


<multi>[fr]votre texte en français[en]your text in english</multi>

Walma en image

(JPEG)

techniquement

du css et du javascript sont intégrés dans la page, Le css se module suivants l’affichage demandé grace à la balise [(#ENV)]

testé avec succès sur ces navigateurs :

windows xp
explorer 5.0.1
explorer 6.0.2
firefox 1.0.7
Netscape 7.02
mac osx
explorer 5.2.1 (burf sur les icones sinon ça va)
firefox 1.0
Safari 1.0.3

Exemple de galerie

Les plus experts

Les plus experts pourront extraire et externaliser le css et le javascript (Pour aller plus loin : Des variables dans la feuille de style), pour mettre vos menus en haut ou sur les côtés, préférez l’include dans la page elle même, voir également sur spip-contrib le fichier page.php3.

Le fichier walma.html contient des annotations et remarques qui facilite la compréhension du code

Inclusion menus à gauche ou à droite

Pour insérez un menu à gauche, après avoir créé soit un seul fichier html plaçé dans le dossier squelettes et appelé par
<INCLURE(page.php3){fond=gauche-ou-droite}{id_article}>
soit par votre fichier/couple html et php appelé par
<INCLURE(menu-gauche-ou-droite.php3){id_article}>

enlevez l’espace avant INCLURE, et remontez le crochet fermant de #REM, juste sous la balise <body> vous trouvez ces lignes :

Prise en compte de vos menus


<body>
[(#REM) toujours au dessus du php possibilité d'insérer vos menus en haut à gauche ou à droite
<div class="insertionmenu">
< INCLURE(menu-gauche-ou-droite.php3){id_article}>
</div>]

devient


<body>
[(#REM) toujours au dessus du php possibilité d'insérer vos menus en haut à gauche ou à droite]
<div class="insertionmenu">
<INCLURE(menu-gauche-ou-droite.php3){id_article}>
</div>

Et avant la balise </style> faites de même :


[/*(#REM) si insertion  menu à gauche libérez simplement ces lignes des crochets et des étoiles
.galeriewalma, .baswalma{float:right; right:10px; }
.titredelagalerie{float:right; margin-right:20px; }
.insertionmenu{position:absolute; font-size:12px;  width:170px; left:10px; top:100px; text-align:left; z-index:2; background-color:#E8E8E8;}
*/]
</style>
devient

[/*(#REM) si insertion  menu à gauche libérez simplement ces lignes des crochets et des étoiles*/]
.galeriewalma, .baswalma{float:right; right:10px; }
.titredelagalerie{float:right; margin-right:20px; }
.insertionmenu{position:absolute; font-size:12px;  width:170px; left:10px; top:100px; text-align:left; z-index:2; background-color:#E8E8E8;}
</style>

Le forum walma

Enfin, pour toutes vos questions, utilisez le forum ici !

Prenez un bon navigateur!