[Résolu] Jquery lightbox2 page cms

[DPOD]

Salut à tous,

 

Sur un site prestashop que je gère (sous 1.3)

J'ai voulu intégrer une lightbox dans la page cms

 

Donc j'ai suivi les instructions de cette page

http://lokeshdhakar....ects/lightbox2/

 

J'ai essayé dans une page html de base, ca marche.

 

J'ai uploadé dans le js de mon theme les fichier de la lightbox, j'ai crée un dossier "lb"

 

Pour prestashop, dans mon header.tpl

juste avant la balise </head>

 

J'ai ajouté :

 

<script type="text/javascript" src="http://www.monsite.fr/themes/clean-simple/js/lb/jquery-1.7.2.min.js"></script>

<script type="text/javascript" src="http://www.monsite.fr/themes/clean-simple/js/lb/lightbox.js"></script>

<link rel="stylesheet" href="http://www.monsite.fr/themes/clean-simple/js/lb/css/lightbox.css" type="text/css" media="screen" />

 

Je met le lien de la photo avec l'attribut rel="lightbox" dans ma page, mais cela ne veut pas fonctionner.

 

Ais je oublié quelquechose ?

Ya til une manip spéciale pour ajouter du jquery a prestashop ?

 

Merci d'avance,

Edited August 27, 2012 by DPOD (see edit history)

[SiteProjet]

Bonjour.

 

L'injection de la library jquery pose souvent des soucis car cette dernière est déjà chargée sous Prestashop.

En plus de risquer de rendre votre script inutilisable, vous risquez d'impacter tous les autres qui utilisent cette bibliothèque (comme à plusieurs endroits sur les fiches produits).

 

Essayez sans cette injection :

<script type="text/javascript" src="http://www.monsite.fr/themes/clean-simple/js/lb/jquery-1.7.2.min.js"></script>

 

De plus Prestashop dispose également des library pour la lightbox (fancybox), vous les trouverez dans le dossier /js/jquery

Elles sont peut-être également chargées par défaut.

[DPOD]

Donc ma procédure est a priori la bonne, mais il pourrait s'agir d'un conflit entre javascript ?

Y a t-il un moyen de vérifier cela avec Firebug ?

[DPOD]

Je viens de faire le test en enlevant la première injection,

lorsque je check ma page avec Firebug onglet reseau, je vois bien mon script mais il est en rouge avec la mention aborted

 

Que faire dans ce cas ?

 

Pour faire cela proprement j'ai modifié mon code

 

<script type="text/javascript" src="{$js_dir}light/js/lightbox.js"></script>

<link rel="stylesheet" href="{$js_dir}light/css/lightbox.css" type="text/css" media="screen" />

 

Maintenant le code se voit bien dans firebug, il semble ok, mais... pas de lightbox

 

 

Une idée ?

Edited August 24, 2012 by DPOD (see edit history)

[DPOD]

J'ai réussi ! en fait en ecrivant proprement et en remetant la première ligne c'est ok !

Merci de ton aide.

 

Petite question subsidiaire, en le mettant dans le header, je lance le script sur chaque page,cela ralentit mon site non ?

Comment faire pour ne le lancer que sur les pages cms ?

[DPOD]

Je me suis réjoui trop vite (sic!)

 

Ca marche effectivement dans ma page cms, mais alors dans mes pages produits la thickbox ne marche plus,

une idée ?

 

Je pense que le problème vient du fait que j'appelle deux librairies jquery ,

 

une ici :

<script type="text/javascript" src="{$content_dir}js/jquery/jquery-1.2.6.pack.js"></script>

et la :

<script type="text/javascript" src="{$js_dir}light/js/jquery-1.7.2.min.js"></script>

 

Vous en pensez quoi ?

Edited August 24, 2012 by DPOD (see edit history)

[DPOD]

Je me réponds à moi même j'ai gardé exactement le même code, mais

je l'ai mis plus haut dans mon header.tpl et car marche ?

 

Quelqu'un pour m'expliquer comment cela se fait ?

[SiteProjet]

Bonjour.

 

Probablement parce que vous avez injecté une library avant l'autre, ce qui résout le précédent conflit.

 

En effet plutôt que de l'afficher sur toutes les pages le mieux est de ne le faire que sur les pages de CMS. Vous pouvez faire cela en injectant le code dans un module (invisible, comme un freeblock dont vous auriez supprimé le contenu du .tpl).

Puis dans ce .tpl vous indiquez :

 

{if $page_name == 'cms'}

votre code ici

{/if}

 

Vous pouvez aussi procéder avec :

{if $page_name !== 'product'}

 

votre code ici

{/if}

Mais il se peut que d'autres pages que celle des produits entre en conflit.

 

 

 

Ou alors vous pouvez de mettre ces librairies que dans le tpl du module qui gère les pages de CMS (si cela est bien géré par un module...).

 

 

PS: vérifiez que le nom des pages de cms est bien cela. Par exemple le nom de la page d'accueil est "index", et en choisissant cela le module n'apparaît bien que sur cette page.

[DPOD]

Merci ! Je passe mon topic en Résolu !

[SiteProjet]

Avec plaisir