Affichage des images en pop-up dans les CMS

[hafaliana]

Bonjour,

 

Je suis sous prestashop 1.4

 

Je souhaiterais mettre en place une systeme de visualisation des images en popup dans les pages cms.

Je m'explique : Les images se montrent en miniatures dans une page cms. Quand on y clique dessus, l'image apparait en forme de pop-up en grand.

 

J'ai essayé de mettre un lien vers l'image en grand sur la miniature et il y a une option pop-up dans prestashop mais il semble que celà ne marche pas.

 

Merci d'avance

[Szed]

Il n'y a par défaut pas cette fonctionnalité.

 

Pour cela il vous faut intégrer de façon classique (JS  + CSS), un script de lightbox (comme shadowbox, lightbox, ou autre) dans votre thème.

Ensuite, simplement spécifier (selon le script) la classe ou l'attribut rel adéquat lorsque vous créer votre lien dans le CMS.

[hafaliana]

Merci mais pourriez vous être plus precis, comment entreprendre celà ? Ou n'y a t-il pas un module qui le gère ?

[Szed]

De connaissance, il n'y a pas de module non.

Partons du principe que vous souhaitez utiliser http://www.shadowbox-js.com/ par exemple.

Vous télécharger le package, et ensuite, suivez le tuto d'installation. 

 

Donc, dans le header.tpl de votre thème, il va falloir appelé le fichier JS, et CSS.

Admettons que vous placiez shadowbox.js dans le dossier JS de votre thème et shadowbox.css dans le dossier CSS de votre thème, vous allez rajouter cela dans votre header.tpl :

 

Le css, à mettre après l'appel des fichiers CSS : 

<link href="{$css_dir}shadowbox.css" rel="stylesheet" type="text/css" media="{$media}" />

Le JS, à mettre après l'appel des fichiers JS : 

<script type="text/javascript" src="{$js_dir}shadowbox.js"></script>
{literal}
<script type="text/javascript">
Shadowbox.init();
</script>
{/literal}

Et ensuite, dans votre page CMS, lorsque vous créer votre lien, il vous faut lui indiquer un attribut rel : rel="shadowbox"

[serialmother]

Bonjour,

et merci pour vos explications.

le lien ne semble plus fonctionner vers  shadowbox-js.com

 

J'ai pu l'installer, mais en version prestashop 1.6, seulement avec des liens en dur vers les dossiers js et css,  et non l'appel que vous donnez.

Est-ce un problème de version de prestashop ?

 

D'autre part, lorsque je fais un lien sur la photo dans la catégorie, et que j'enregistre la page, le lien  rel="shadowbox" est systématiquement effacé...

la seule solution que je trouve est de rajouter l'attribut dans la base. Ce qui est assez fastidieux.

Pourriez-vous m'indiquer comment faire pour que le l'attribut  rel="shadowbox" ne soit pas effacé à l'enregistrement de la page ?

 

Merci