Images et lettres

Fermer Littérature et poésie

Fermer It was a good year

Fermer L'art du débutant

Fermer Mes graphs

Galeries carnivores
Extras
Visites

 1816170 visiteurs

 8 visiteurs en ligne

Contact
Contact
Scripts web - ThickBox

Adaptation du script ThickBox pour GuppY 4.5
Sources : http://jquery.com/demo/thickbox
Fichiers ThickBox à télécharger ici : Fichiers ThickBox


1 - Placer les fichiers jquery.js, thickbox.js, thickbox.css et loadinganimation.gif dans le dossier /inc de GuppY
2 - Sauvegarder le fichier /inc/hpage.inc d'origine au cas où, puis modifier le hpage.inc en ligne de la manière suivante :
Insérer les trois lignes de code suivantes juste avant la balise </head> :

<script type="text/javascript" src="<? echo CHEMIN; ?>inc/jquery.js"></script>
<script type="text/javascript" src="<? echo CHEMIN; ?>inc/thickbox.js"></script>
<link rel="stylesheet" href="<? echo CHEMIN; ?>inc/thickbox.css" type="text/css" media="screen" />
Le script est normalement prêt a fonctionner.

Exemples de code html pour appeler le script par le biais d'un lien dans un menu, un article, une news, une boîte libre... :


Exemple de code pour une image (les images sont ici dans le dossier img de GuppY, à adapter selon les besoins) :

<a href="img/mon_image.jpg" title="Ajouter un commentaire ou laisser vide" class="thickbox"><img src="img/ma_miniature.jpg" alt="Simple Image"/></a>
Exemple de code pour une galerie d'images (les miniatures sont rangées dans un tableau centré par une <div>, à adapter selon les besoins) :

<div align="center"><table border="0"><tbody><tr><td><a href="url de l'image/image1.jpg" title="Ajouter un commentaire ou laisser vide" class="thickbox" rel="Le_nom_de_ma_galerie "><img src="url de l'image/miniature_image1.jpg" alt="image1" border="0"></a></td><td><a href="url de l'image/image2.jpg" title="Ajouter un commentaire ou laisser vide" class="thickbox" rel="Le_nom_de_ma_galerie "><img src="url de l'image/miniature_image2.jpg" alt="image1" border="0"></a> </td></tr><tr><td><a href="url de l'image/image3.jpg" title="Ajouter un commentaire ou laisser vide" class="thickbox" rel="Le_nom_de_ma_galerie "><img src="url de l'image/miniature_image3.jpg" alt="image3" border="0"></a></td><td><a href="url de l'image/image4.jpg" title="Ajouter un commentaire ou laisser vide" class="thickbox" rel="Le_nom_de_ma_galerie "><img src="url de l'image/miniature_image4.jpg" alt="image4" border="0"></a></td></tr></tbody></table></div>
Exemples de code pour une iframe, pour une page php :

Ici la page de tchat du Tchat Gazh :

<a href="plugins/tchat_ghaz/chat.php?keepThis=true&TB_iframe=true&height=450&width=450" title="Tchat Gazh" class="thickbox"><h1>Tchat Gazh</h1></a>
height et width à adapter selon les besoins
Et là la page centrale de tchat du plugin shoutpro :

<a href="plugins/shoutpro/centralbox2.php?keepThis=true&TB_iframe=true&height=450&width=450" title="Shout box" class="thickbox">SHOUT BOX</h1></a>
height et width à adapter selon les besoins

Voilà pour l'instant les insertions que j'ai testées. D'autres codes peuvent être consultés sur la page du programmeur ici, paragraphe "Examples", onglets "html" :
http://jquery.com/demo/thickbox/#examples

À noter :

L'appel à la css du script m'a fait perdre le centrage des pages d'admin, je n'ai pas encore trouvé la parade. Bon apparemment c'est seulement dans l'admin donc pas trop grave...
Il y a de possibles incompatibilités avec d'autres scripts ajoutés à GuppY.



Bons tests et souvenez-vous : on sauvegarde avant de faire des modifications.

Date de création : 26/03/2007 @ 18:51
Dernière modification : 15/07/2007 @ 19:55
Catégorie : Scripts web
Page lue 11010 fois

Imprimer l'article Imprimer l'article


Liens carnis
Préférences

Se reconnecter
---

Votre nom (ou pseudo) :

Votre code secret


 Nombre de membres 62 membres


Connectés :

( personne )
Recherche



À visiter

assofreeGuppY

exclu.gif

logo ocre rouge

logo acc

ouate ze phoque
^ Haut ^