[résolu] Thickbox et Spip 2.0.6

Question

codascii

12 Apr 2009 à 18:46

Bonjour,

ça fait 15 jours que je tourne en rond et que je ne trouve de réponse nulle part, je pousse donc la porte de ce bar !
J'ai un site sous Spip 2.0.6 dans lequel j'ai installé le plugin Thickbox.

Dans l'entête de la page Article, j'ai ajouté les lignes suivantes :


			<script src="plugins/thickbox2/javascript/thickbox.js" type="text/javascript"'></script>
    	<link rel="stylesheet" href="plugins/thickbox2/thickbox.css" type="text/css" media="projection, screen"></link>
    	<script type='text/javascript'>
			<!--
			// Inside the function "this" will be "document" when called by ready() 
			// and "the ajaxed element" when called because of onAjaxLoad 
			var init_f = function() {
					if (jQuery("a.thickbox,a[@type='image/jpeg'],a[@type='image/png'],a[@type='image/gif']",this).addClass("thickbox").size()) {
						 TB_chemin_animation = "plugins/thickbox2/circle_animation.gif";
						 										 TB_chemin_close = "plugins/thickbox2/close.gif";
																 TB_chemin_css = "plugins/thickbox2/thickbox.css";
																 TB_init(this);
																 };
															}
															//onAjaxLoad is defined in private area only
															if(typeof onAjaxLoad == "function") onAjaxLoad(init_f);
															jQuery(document).ready(init_f);
		// --></script>

et dans la boucle du portfolio j'ai juste ajouté

class="thickbox"

dans le lien

<a href="[(#URL_ARTICLE|parametre_url{id_document,#ID_DOCUMENT})]" class="thickbox">

et ça ne fonctionne pas Smiley decu

Mais chose incroyable, quand je clique sur une image du portfolio dans la partie privée du site, ça fonctionne Smiley eek

!!!

J'espère que vous pourrez me donner des pistes car là je commence à me décourager !
Modifié par codascii (13 Apr 2009 - 17:37)

knarf

12 Apr 2009 à 20:09

Bonjour,

Comme je ne suis pas très calé en js, à quoi servent les lignes ajoutées dans l'entête de l'article exactement ?

Normalement il n' y pas besoin de rajouter quoi que ce soit le plugin est ajouter directement.

Si c'est une modification de son fonctionnement, pourquoi ne pas rajouter les modifs directement dans le plugin.

a écrit :
Mais chose incroyable, quand je clique sur une image du portfolio dans la partie privée du site, ça fonctionne.

Je dirais que c'est normal, si l'ajout dans l'entête de l'article ne plait pas au plugin ce dysfonctionnement ne se retrouve pas dans la partie privée puisqu'il n'affecte que les page "articles".

codascii

12 Apr 2009 à 20:33

knarf a écrit :
Comme je ne suis pas très calé en js, à quoi servent les lignes ajoutées dans l'entête de l'article exactement ?

Normalement il n' y pas besoin de rajouter quoi que ce soit le plugin est ajouter directement.

J'ai commencé sans rien ajouter dans le code de ma page mais ça ne fonctionnait pas. A force de chercher, notamment sur le site http://jquery.com/demo/thickbox/ j'ai ajouté ces lignes...

knarf a écrit :

Si c'est une modification de son fonctionnement, pourquoi ne pas rajouter les modifs directement dans le plugin.

Euh... ça je ne sais pas encore faire Smiley smile

knarf a écrit :

Mais chose incroyable, quand je clique sur une image du portfolio dans la partie privée du site, ça fonctionne.

Je dirais que c'est normal, si l'ajout dans l'entête de l'article ne plait pas au plugin ce dysfonctionnement ne se retrouve pas dans la partie privée puisqu'il n'affecte que les page "articles".

Alors, je vais réessayer.

fvsch

13 Apr 2009 à 00:29

Bonjour,

Supposition très au pif:

1. L'admin de SPIP utilise jQuery.
2. Tes pages n'appellent pas la bibliothèque jQuery;
3. Thickbox est un plugin jQuery qui exploite les fonctions de la bibliothèque.

Les points 1 et 3 expliquent pourquoi ça marche dans l'admin, et les points 2 et 3 expliqueraient pourquoi ça ne marche pas sur tes pages publiques.

Ceci dit, il s'agit d'une supposition, difficile d'en dire plus sans voir le site. (Tiens, on n'amène pas le patient pour une consultation chez le médecin, maintenant? Les temps changent.)

PS: sujet déplacé dans le salon qui va bien.

knarf

13 Apr 2009 à 05:36

Est-ce que tu utilise un répertoire squelettes ou tu as crée tes propres pages ?

Si c'est le cas, test le plugin en utilisant le squelette-dist uniquement.

Le plugin semble valide pour la branche 2.0.0

Si tu as un répertoire squelettes, est-ce que cette balise #INSERT_HEAD est bien présente dans le squelette "inc-head".

a écrit :
Balise permettant aux plugins d'inserer des appels javascript ou css ;
C'est ici que SPIP va inserer l'appel de la librairie jQuery

codascii

13 Apr 2009 à 09:03

Bonjour,

j'ai avancé un peu hier soir, j'avais commencé par inclure le plugin jquery mais ça ne fonctionnait pas non plus par contre ça fonctionne en local en ajoutant la ligne

<script type="text/javascript" src='dist/javascript/jquery-1.1.js'></script>

avant mes lignes qui concernent Thickbox.
Cela confirme ce que disait Florent V. :

Florent V. a écrit :

1. L'admin de SPIP utilise jQuery.
2. Tes pages n'appellent pas la bibliothèque jQuery;
3. Thickbox est un plugin jQuery qui exploite les fonctions de la bibliothèque.

Florent V. a écrit :

Ceci dit, il s'agit d'une supposition, difficile d'en dire plus sans voir le site. (Tiens, on n'amène pas le patient pour une consultation chez le médecin, maintenant? Les temps changent.)

J'hésitais à vous le présenter car ça m'est déjà arrivé que la page d'Alsacréations où est posé le problème soit mieux référencée que celle du site...

Ce matin, je vais faire les tests que Knarf propose... J'ai créé mon propre squelette et je ne suis pas certain d'avoir laissé la balise #INSERT_HEAD.

codascii

13 Apr 2009 à 09:43

C'est bien un problème avec mon squelette puisque ça fonctionne avec celui par défaut.
J'ai ajouté la balise #INSERT_HEAD dans inc-head et les lignes que j'avais ajoutées à la main apparaissent bien automatiquement dans l'en-tête de ma page article... ça avance ! Même si ça ne fonctionne pas encore.
Je vais continuer à chercher.
Je vous mets le lien : site

[édit]Merci beaucoup pour vos pistes ! ça y est, ça fonctionne ! J'ai changé aussi la boucle du portfolio.
Reste à résoudre mon problème de pied de page qui n'est plus à la bonne place Smiley langue

... Peut-être une balise commune dans mon fichier css et celui de Thickbox...[/édit]

[édit2]J'ai changé le code css du fichier thickbox. ça fonctionne bien sous Firefox 3, Opéra 9.64, IE 7 et IE 6. Je suis preneur de tests avec d'autres versions ou d'autres navigateurs ! Mais c'est une autre histoire... Je pense poster dans Ergonomie et esthétique générale.
Merci encore à vous deux !!![/édit2]
Modifié par codascii (13 Apr 2009 - 17:36)

codascii

13 Apr 2009 à 20:54

Oups ! Message en double...
Modifié par codascii (17 Apr 2009 - 20:59)

Felipe

Administrateur

14 Apr 2009 à 10:51

Bonjour,

codascii a écrit :

J'hésitais à vous le présenter car ça m'est déjà arrivé que la page d'Alsacréations où est posé le problème soit mieux référencée que celle du site...

-http://monsite ?
Pour les tests de compatibilité, il faudrait regarder sur quelle page précisément? Je trouve rien de bon matin ...

As-tu réussi à faire fonctionner la partie privée (admin) ET ce plugin avec la même version de jQuery?
J'ai eu le même souci que toi avec Thickbox puis je suis passé à Fancybox (le temps que je comprenne que le lien et la classe étaient à rajouter à la main Smiley rolleyes

) et il y a aussi un problème de version de jQuery (enfin je crois).
Modifié par Felipe (14 Apr 2009 - 10:53)

codascii

14 Apr 2009 à 23:17

Bonsoir Felipe,

je n'étais pas là de la journée...
Je te remets l'adresse du site ici.

En fait, j'ai supprimé toutes les balises ajoutées à la main et grâce à knarf j'ai placé la balise #INSERT_HEAD dans l'en-tête de ma page. Dans article.html uniquement car je trouve que ça ralenti un peu l'affichage. Si je l'avais placée dans inc-head, ça se serait retrouvé sur toutes mes pages et ça n'a pas d'intérêt pour l'instant.

Ensuite j'ai juste changé la boucle du portfolio qui provenait d'un de mes anciens sites en spip version 1.quelque chose par celle qui était dans la page article du dossier squelettes-dist.

Comme l'avait dit Florent V., je m'étais aperçu aussi qu'il y avait un problème de JQUery. J'ai désinstallé définitivement le plugin JQuery, et en fait le plugin Thickbox utilise le JQuery qui se trouve "intégré à Spip 2.0.6 ?" dans le dossier prive/javascript/.

Pour le Portfolio, on n'a même pas besoin d'ajouter la classe à la main. C'est uniquement pour les images insérées dans les articles.

En fait en cherchant sur internet, j'avais mélangé Plugin et les infos de ce site : ThickBox 3.1. Cette version, pas encore sous la forme d'un plugin, donne je pense des possibilités supplémentaires mais je ne suis pas très bon en anglais Smiley cligne

.

J'ai corrigé les fichiers css qui interféraient (mon pied de page se retrouvait au milieu de l'écran).

Reste quelques détails à régler... Dont celui-ci :
- toutes les pages passaient la validation mais maintenant la page article possède 11 erreurs à la validation css 2.1 ! Dont 7 après l'insertion de ce plugin et 4 après celle du plugin multi média.

Je vais aller voir ce qu'est Fancybox par curiosité.

Pour les tests de compatibilité, c'est surtout sur la page Article pour voir si le portfolio fonctionne. Merci d'avance !
Modifié par codascii (17 Apr 2009 - 20:58)

Sujet clos

JavaScript, DOM et API Web HTML5

[résolu] Thickbox et Spip 2.0.6