[MODIFICATION] ZoomBox, effet de zoom sur les images, CGV, et block informations

[yvanb]

Bonjour à tous,

voici une amélioration pour prestashop que je viens d'adapter.
Ceci est un zoom sur image pour remplacer la Thickbox standard.

Je remercie Nomman pour sa fancybox dispo ici, mais qui personnellement ne fonctionne pas sur mon prestashop donc j'ai cherché autre chose et j'ai finit par trouvé la ZoomBox de....

L'utilisation commerciale n'est apparemment pas interdit, il faut contacter l'auteur, mais impossible... donc j'essayerais pour vous

Bref une image vos mieux qu'un long discourt, Testé sur prestashop 1.1.0.5 Firefox 3.0.11 et IE 8 :

ATTENTION - Pour utiliser ZoomBox CGV et ZoomBox Block Infos, vous devez modifier header.tpl et uploader le dossier zoombox dans le dossier js, comme préciser dans zoombox.zip

-Le fichier ZoomBox CGV.txt permet de mettre la Box des CGV dans le même style.
-Le fichier ZoomBox Block Infos.txt permet d'afficher les liens du block informations dans des ZoomBox.

-Dans le fichier ZoomBox Block Infos.txt un lien en dur a été créer. Se lien est : "/themes/prestashop/css/global.css", remplacez "prestashop" par le nom de votre thème utilisé.

Mise à jour / Correction des bugs :
20/06/2009 à 21h.30 -Correction dans le fichier zip d'un oubli de code, ce qui ne faisait pas fonctionner le zoom sur l'image principale.

22/06/2009 à 13h.04 -Modification du fichier zoombox.js, une erreur de dossier provoquerais apparemment une petite erreur et donnerais une simple page noir.

ZoomBox CGV.txt

ZoomBox Block Infos.txt

zoombox.zip

[jolvil]

Merci pour cette contribution, ajoutée à la liste des modules et contributions de la communauté Prestashop.

[banban]

Bonjour et merci pour votre module. Je vais de faire un essai, Hélas le module n'est pas présent dans le liste des modules du backoffice.

Je dispose de la version 1.1.0.5

[jolvil]

Ce n'est pas un module mais une contribution, il faut donc modifier quelques lignes de code dans Prestashop.
il y a un fichier qui explique l'installation dans l'archive.

[yvanb]

Ce n'est pas un module mais une contribution, il faut donc modifier quelques lignes de code dans Prestashop.
il y a un fichier qui explique l'installation dans l'archive.

+1
Voui ceci n'est pas un module mais une modification du code de la page product.tpl du theme en cours, un ajout dans header.tpl et l'ajout du dossier zoombox dans le dossier JS...

Mais tout est dans le zip

[EDIT] Petit oublie de ma part :

Ouvrer header.tpl

Chercher :

       <link rel="shortcut icon" type="image/x-icon" href="{$img_ps_dir}favicon.ico" />

Ajout en dessous :

       <link href="{$base_dir}js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />

Voila, puis j'ai rajouté dans le zip les fichiers modifiés du theme d'origine et l'ajout du CSS.... sorry

[/EDIT]

[banban]

En effet cela fonctionne sans problème avec le link vers le fichier css lol

Bon boulot !!
Pensez-vous qu'il serait possible d'ouvrir le " cms " de la boutique dans une Fancybox ?

[yvanb]

Pour la FancyBox... Peut être, pour la ZoomBox oui, juste trouver le lien et rajouter le " rel="zoombox" " dans le lien....

Voila la solution :

[EDIT] Encore un oubli,... Editer le fichier order-carrier.tpl. Vais aller m'acheter un cerveau [/EDIT]

Recherchez :

{if $conditions}
{l s='Terms of service'}


       <input type="checkbox" name="cgv" id="cgv" value="1" {if $checkedTOS}checked="checked"{/if} />
{l s='I agree with the terms of service and I adhere to them unconditionally.'} {l s='(read)'}

{/if}

Remplacer par :
{if $conditions}
{l s='Terms of service'}


       <input type="checkbox" name="cgv" id="cgv" value="1" {if $checkedTOS}checked="checked"{/if} />
{l s='I agree with the terms of service and I adhere to them unconditionally.'} {l s='(read)'}

{/if}

[banban]

Merci merci !

Je prépare une contrib pour l'affichage les liens informations " CMS " avec la fancybox

[yvanb]

J'ai posté la screen shot de la box CGV

Une contrib liens CMS ?

[banban]

En fait, je souhaite ouvrir une "fancybox" pour les liens du block informations ( CGV , Livraison ... )

[yvanb]

Ok, ceci ne doit pas être très compliqué, dans "blockinfos.tpl" dans le lien, essaye d'ajouter simplement le code

rel="zoombox"

Ou remplacer par sa :
{$cmslink.meta_title|escape:htmlall:'UTF-8'}

Comme ceci, il devrait ferra les lien automatiquement dans la ZoomBox, mais il risque de te mettre tous le site en entier dans la ZoomBox... Pas testé, je te laisse le soin de le faire

[banban]

non il bug, je cherche un autre moyen car il me faut le scroll vertical en plus

[yvanb]

Atend, je teste et je met un screen

[EDIT] Voila ce que j'obtiens [/EDIT]

[RE EDIT] Voila c'est fait voici la marche a suivre :

cms.tpl doit être comme cela :

<link href="{$base_dir}js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
<link href="{$base_dir}/themes/prestashop/css/global.css" rel="stylesheet" type="text/css" media="{$media}" />
{if $cms}
   {if $content_only}

       {$cms->content}

   {else}
       {$cms->content}
   {/if}
{else}
   {l s='This page does not exist.'}
{/if}


[b]Et cms.php doit être comme ceci :[/b]

<?php

include(dirname(__FILE__).'/config/config.inc.php');
include(dirname(__FILE__).'/init.php');

if (($id_cms = intval(Tools::getValue('id_cms'))) AND $cms = new CMS(intval($id_cms), intval($cookie->id_lang)) AND Validate::isLoadedObject($cms))
{
   $smarty->assign(array(
       'cms' => $cms,
       'content_only' => intval(Tools::getValue('content_only'))
   ));
   $smarty->display(_PS_THEME_DIR_.'cms.tpl');

}
else
   Tools::redirect('404.php');

?>

Et une screen en prime

[banban]

Merci bien , cependant lors de l'ouverture de la zoombox, j'obtiens une page noir

Modification du fichier zoombox.js

J'ai plus de soucis

[yvanb]

Cela est peut être normale, vérifier le lien du fichier CSS dans cms.tpl car j'ai mis le thème par défaut donc l'adresse :

<link href="{$base_dir}/themes/prestashop/css/global.css" rel="stylesheet" type="text/css" media="{$media}" />

a toi de le modifier pour mettre le nom de ton thèmes

[yvanb]

Oui c'est une solution aussi, mais attention avec la compatibilité avec le reste, d'où le CSS en lien "Dur"

[banban]

visiblement, pas de nouveau bug ! Tres bon boulot

[yvanb]

Ok Nickel, alors, j'espère que sa servira à d'autres

[troppelmann]

J'ai aussi installé ces't contribution. Mais chez moi. Le module functionne pas. Je n'est peux pas ouvrir les images.

[yvanb]

Bonsoir, je croit qu'en effet, le module a un léger bug sur l'image principal, avec les petites pas de problème.
Quand on clique sur une petite sa l'ouvre, ensuite on peut cliquer sur la grande, bref je pige pas d'où sa vient....

Je cherche toujours, mais si ton bug a rien avoir avec sa, merci de préciser, car la c'est un peu vague~~~~
PS: a tu fait l'édit plus bas qui consiste a ajouter le <link dans le Header.tpl ?

[troppelmann]

Salut yvanb

J'ai fais tout les instruit comme descrivez dans les guides.

Fonctionne le module chez toi?

[yvanb]

Oui avec 1 bug, j'ai encore homi quelque chose..... Rien de bien grave le zoom ne se fesait pas sur l'image principal, je poste le ZIP correct

[oscardiop]

Bonsoir Yvanb

votre contribution ne fonctionne pas en faisant tous les modifs que faire???? aidez nous a trouver la solution

[yvanb]

Bonsoir, quelle version de prestashop utilise tu ?
A tu bien uploader le dossier zoombox dans le dossier js ?

Et quelle contribution utilise tu ?

[oscardiop]

j'utilise la version 1.1 jai bien uploader le dossier zoombox dans le dossier js ?,j'utilse la contribution qui est joint avec le fichier télécharger

[yvanb]

A tu essayer sur le themes d'origine ? car pour ma part, j'upload et remplace les fichiers, et sa fonctionne.... Si non donne ton ftp par mp et je lookerais tous sa demain

[troppelmann]

Comme oscardiop a descrivez. J'ai la meme problème. Si on utilise un autre template ca fonctionne pas.

[Alekhine]

Hello,

Si vous modifiez le hearder.tpl d'un template et pas de l'autre... c'est sur que ça ne va pas fonctionner pour l'autre

[yvanb]

Hello,

Si vous modifiez le hearder.tpl d'un template et pas de l'autre... c'est sur que ça ne va pas fonctionner pour l'autre

+1@ Alekhine

Oui, si vous l'appliquer sur la template d'origine mais que vous utiliser une autres template, c'est sur que les modifications ne fonctionnerons pas.... Il faut appliquer les modifications sur la template utilisée, pour démonstration on utilise toujours la template par défaut

[troppelmann]

Jai trouvais l'erreur

On doit remplacer dans le zoombox.js

zoombox.lecteurFLV="/zoombox/FLVplayer.swf" // Ou se trouve le lecteur FLV par rapport à la racine
zoombox.lecteurMP3="/zoombox/mp3player.swf" // Ou se trouve le lecteur MP3 par rapport à la racine



avec

zoombox.lecteurFLV="FLVplayer.swf" // Ou se trouve le lecteur FLV par rapport à la racine
zoombox.lecteurMP3="mp3player.swf" // Ou se trouve le lecteur MP3 par rapport à la racine

[yvanb]

Aurais tu une screenshot de l'erreur stp ?
Car perso, je nais pas eu cette erreur.....

Merci !

[troppelmann]

Il me ne montre pas un erreur. J'ai ne pu pas ouvrir les images.

[yvanb]

Ah bizarre, ou alors c'est peut être dû au fait que ta boutique soit dans un sous dossier non ? Fin si sa fonctionne comme sa, les autres lookeron le topic

[Matthieu B]

Merci bien , cependant lors de l'ouverture de la zoombox, j'obtiens une page noir

Modification du fichier zoombox.js

J'ai plus de soucis

Je ne trouve pas dans le code, la façon dont est géré le fond noir, tu peux m'indiquer la ligne de code ?

Merci

[yvanb]

Bonjour,

apparemment se serrait sa :

Jai trouvais l'erreur

On doit remplacer dans le zoombox.js

zoombox.lecteurFLV="/zoombox/FLVplayer.swf" // Ou se trouve le lecteur FLV par rapport à la racine
zoombox.lecteurMP3="/zoombox/mp3player.swf" // Ou se trouve le lecteur MP3 par rapport à la racine



avec

zoombox.lecteurFLV="FLVplayer.swf" // Ou se trouve le lecteur FLV par rapport à la racine
zoombox.lecteurMP3="mp3player.swf" // Ou se trouve le lecteur MP3 par rapport à la racine

[EDIT] Modification du fichier zoombox.js, selon les modification de troppelmann, qui se trouve dans le .zip en DL ici.
Sinon c'est sa, mais cette erreur a été corrigée dans le .zip....

[EDIT] Petit oublie de ma part :

Ouvrer header.tpl

Chercher :

<link rel="shortcut icon" type="image/x-icon" href="{$img_ps_dir}favicon.ico" />

Ajout en dessous :

<link href="{$base_dir}js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />

Voila, puis j’ai rajouté dans le zip les fichiers modifiés du theme d’origine et l’ajout du CSS…. sorry smile

[/EDIT]

[/EDIT]

[cdilouya]

Salut à tous,

La Zoombox est superbe.
Je l'ai installé sur ma boutique www.labagageriefrancaise.fr

J'ai juste un pb. Le bouton close de la zoombox arrive pile sur un des éléments du menu (horizontal catégorie).
Alors, quand on clique dessus, on arrive sur sac à main plutot que revenir sur le produit initial.

Comment on peut repositionner la zoombox un peu plus bas ???

A+

Cédric

[yvanb]

Bonsoir, peut être que tu devrait appeler le JS de la zoobox avant le JS de ton menu déroulant, qui est lui aussi certainement en javascript...

Mettre sa :

   
       <  script type="text/javascript" src="/js/zoombox/jquery.js">[removed]
       < script type="text/javascript" src="/ps/js/zoombox/zoombox.js">[removed] 

Avant sa :

            < script type="text/javascript" src="/ps/js/tools.js">[removed]

       < script type="text/javascript">
           var baseDir = '/ps/';
           var static_token = 'eb2f4a750fd62720856477d0e78c4214';
           var token = 'e38151c1b11ea8c00bac4408a8bdc622';
           var priceDisplayPrecision = 2;
</ script>

Si non, re tailler la zoombox, c'est à dire, définir une taille moindre dans le fichier zoombox.js en modifiant ces lignes :

zoombox.largeurD=450; // Largeur par défaut 
zoombox.hauteurD=360; // Hauteur par défaut

[cdilouya]

Merci Yvan,

Question profane : Dans quel fichier puis-je trouver les codes dont tu parles dans la 1ere partie ?

Cedric

[yvanb]

Merci Yvan,

Question profane : Dans quel fichier puis-je trouver les codes dont tu parles dans la 1ere partie ?

Cedric

Certainement dans Header.tpl du thème que tu utilise

[cdilouya]

Salut, j'ai vérifié et hélas, ce n'est pas un javascript.
J'ai peut-être une solution.
Peux-tu me dire comment mettre le bouton close en bas à droite de la zoombox ?

[yvanb]

Hum, elle est bonne celle-la....

je pense qu'il faut modifier les lignes :

#zoombox_close {
   position: absolute;
   top: -12px;
   right: -12px;
   height: 30px;
   width: 30px;
   background: transparent url(close.png) ;
   cursor: pointer;
   z-index: 100;
}

dans "zoombox.css"

[EIDT] Remplace la ligne :

   top: -12px;

Par :

#zoombox_close {
   position: absolute;
   top: 582px;

[/EDIT]

[RE EDIT]
Un upload tous chaud
[/RE EDIT]

zoombox_css_croix_bas.zip

[cdilouya]

Yvan je te remercie.

J'ajouterais que dans les valeurs de top et right, il vaut mieux même mettre des % plutôt que des px.
Au moins, on est sûre que malgré toutes les dimensions que peut prendre la zoombox, le bouton close sera toujours à la même position par rapport à la fenêtre.

A+

[yvanb]

Serte l'auteur à créer son css comme cela, donc....

[yvanb]

Au fait, tu a du te planter dans les % car la croix fermer, doit se situé sur l'angle de la boxe, est ce un choix de ta part de l'avoir mis a l'ouest ?

[Fluorite]

Salut à tous

Merci pour cette contribution.

Je me poser juste une question pourquoi temps de Magouille sur vos fichiers prestashop alors qu'un fichier nommé thickbox-modified dans le dossier

JS/jquery/

fait absolument pareil !!! et sans aucune modification particulière à quelque chose près.

Il suffit tout simplement de l'appeler dans votre index "le fichier thickbox-modified " et aussi rajouter le .CSS du Thickbox.

ensuite de mettre des liens du style

suivant ce que l’on veut faire.

voila : avec quelque images , et cela, avec deux lignes rajouter dans le header pas plus

voila après chacun fait comme il veut.

ps: ne regarder pas trop le Bas du site il n'ai pas encore tout à fait finaliser


bonne journée Yannick

[Fluorite]

Re ^^
OU aussi !!!
Je vous joins le fichier Thickebox et le .css que j'ai modifié, mais très légèrement.

Mettez-le dans un dossier et appeler le tout simplement avec votre Header.tpl rajouter la bonne ligne de code

script type="text/javascript" src="{$base_dir}page_pratique/js/thickbox.js"</script

et appeler aussi votre .CSS du thickbox ou rajouter le code du .CSS dans votre Global.css.

Hop le tour et joue je pense ce moyen bien plus souple.

voila bonne journée
Yannick

thickbox.js

[Fluorite]

CSS
Attention Renomme le thickbox.css.txt en thickbox.css

thickbox.css.txt

[cdilouya]

Yvan, je ne me suis pas planté. Esthétiquement, j'ai finalement choisi de la mettre à cette place.
Je te remercie pour ton aide.

[Matthieu B]

J'ai un problème, j'ai bien changé comme il faut les fichiers, il fonctionne à merveille sous firefox, safari etc... sauf ie 6 où lors du clic rien ne se passe !

Voici l'url : http://tinyurl.com/nwsdjr

Une idée du bug ?

[yvanb]

Vérifie que sur IE 6 le javascript ne soit pas désactivé... De plus sur le site de l'auteur rien n'est précisé...

[EDIT]
BobyLaFleche => Je voie pas le rapport avec la zoombox, la tienne est une thickbox modifié que je trouve moins stylé... Pourquoi ne pas créer un new topic pour présenté ta thickbox modifié ?

[/EDIT]

[revolver_oslot]

Atend, je teste et je met un screen

[EDIT] Voila ce que j'obtiens [/EDIT]

[RE EDIT] Voila c'est fait voici la marche a suivre :

cms.tpl doit être comme cela :

<link href="{$base_dir}js/zoombox/zoombox.css" rel="stylesheet" type="text/css" media="screen" />
<link href="{$base_dir}/themes/prestashop/css/global.css" rel="stylesheet" type="text/css" media="{$media}" />
{if $cms}
   {if $content_only}

       {$cms->content}

   {else}
       {$cms->content}
   {/if}
{else}
   {l s='This page does not exist.'}
{/if}


[b]Et cms.php doit être comme ceci :[/b]

<?php

include(dirname(__FILE__).'/config/config.inc.php');
include(dirname(__FILE__).'/init.php');

if (($id_cms = intval(Tools::getValue('id_cms'))) AND $cms = new CMS(intval($id_cms), intval($cookie->id_lang)) AND Validate::isLoadedObject($cms))
{
   $smarty->assign(array(
       'cms' => $cms,
       'content_only' => intval(Tools::getValue('content_only'))
   ));
   $smarty->display(_PS_THEME_DIR_.'cms.tpl');

}
else
   Tools::redirect('404.php');

?>

Et une screen en prime

Merci à toi Yvanb pour cette belle contrib, la zoombox fonctionne parfaitement :-)

Par contre, je n'arrive pas à encapsuler les pages du bloc infos dans la zoombox malgré tes consignes fournies dans les fichiers ZoomBox CGV.txt et ZoomBox Block Infos.txt :-S j'aimerais bcp y arriver car j'apprécie bcp cette méthode d'ouverture très élégante ! Cf. le screen que j'obtiens quand j'ouvre un élément du module blockinfos. Peut-être faut-il modifier le blockinfos.tpl et/ou le blockinfos.php...?

Pour info, ma config : Win XP SP2 + Firefox 3.5.1 + Prestashop 1.1.0.5.

D'avance merci pour votre précieuse aide ;-)

PS : Quelqu'un saurait-il comment intégrer la Shadowbox v3.0 dans Prestashop, sauf erreur de ma part, personne n'a encore réussi à le faire, ou du moins à l'expliquer de façon précise. Je ne me suis pas encore penché sur le moyen d'intégrer ces scripts dans prestashop, mais ça devrait être sensiblement la même démarche que pour la zoombox, je présume...?

[eric69]

Bonjour,
j'avais installé Zoombox, et marche impeccable!
Mais depuis que j'ai mis à jour vers PS1.2 ça ne marche plus!!

Quelqu'un à t-il réussi à l'installé sur ps 1.2 ?

Ou connaissez-vous un autre module (sript) qui ferait la même chose?

[yvanb]

Est ce que la mise à jour n'aurais pas, par hasard, effacé les modifications dans product.tpl et header.tpl du theme que tu utilise?

Possible....

[eric69]

oui je suis bête!!
en fait j'ai recopier les fichiers du theme PS par défaut et ensuite, refais mes modifs perso!
Donc Zoombox est intégré maintenant dans la version PS 1.2 il suffit de l'activer dans Préférences, Produits!!
Donc plus besoin du module ZoomBox.

Mais en fait je me suis trompé c'est pas ZoomBox que je veux utiliser c'est PrettyPhoto, et lui n'est plus compatible avec PS1.2!!
Merci

[kdk]

This didnt work for me (using 1.2 final)

When i replace

></pre>
<ul>
               {foreach from=$images item=image name=thumbnails}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

with

></pre>
<ul>
               {foreach from=$images item=image name=thumbnails}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

the thumbnails disapear.

I change the code to:

>    </pre>
<ul>
               {foreach from=$images item=image name=thumbnails}
               {assign var=imageIds value=`$product->id`-`$image.id_image`}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

and now it works.

But I'm not good in coding, can someone test my modifaction?

Thanx.

[yvanb]

oui je suis bête!!
en fait j'ai recopier les fichiers du theme PS par défaut et ensuite, refais mes modifs perso!
Donc Zoombox est intégré maintenant dans la version PS 1.2 il suffit de l'activer dans Préférences, Produits!!
Donc plus besoin du module ZoomBox.

Mais en fait je me suis trompé c'est pas ZoomBox que je veux utiliser c'est PrettyPhoto, et lui n'est plus compatible avec PS1.2!!
Merci

Faux !
Ce n'est pas la même zoombox qui est intégré par défaut dans la 1.2...

This didnt work for me (using 1.2 final)

When i replace

></pre>
<ul>
               {foreach from=$images item=image name=thumbnails}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

with

></pre>
<ul>
               {foreach from=$images item=image name=thumbnails}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

the thumbnails disapear.

I change the code to:

>    </pre>
<ul>
               {foreach from=$images item=image name=thumbnails}
               {assign var=imageIds value=`$product->id`-`$image.id_image`}

id}-{$image.id_image}-thickbox.jpg" title="{$product->name|escape:'htmlall':'UTF-8'}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}">
id}-{$image.id_image}-medium.jpg" alt="{$image.legend|htmlspecialchars}" title="{$image.legend|htmlspecialchars}" />

and now it works.

But I'm not good in coding, can someone test my modifaction?

Thanx.

Thanks, for your contribution

[Sébastien Plénat]

Bonjour,

je voudrais intégrer la page récapitulatif de la commande dans la zoombox, de la même manière que les pages cms, mais je n'y parviens pas.

Pouvez vous m'aider ?


Merci

[eyann]

Coucou!

Je me prends la tête comme c'est pas permis de puis 1 journée sur ça.
J'ai bien installé la zoombox, impeccable, génial, super contrib.
Bon jusque la pas de problème pour les images.
Le soucis vient à priori du fichier cms.php qui ne prends apparement pas en compte la valeur "content_only". Je me retrouve donc, dans mon menu horizontal haut et le footer, avec les block cms infos (mentions légales ect...) sans header / footer. Hors j'en ai besoin lorsque la page n'appelle pas une page infos avec le complément "content_only=1". (comme lorsque le client commande et doit accepter les CGV...).

Pour info, voici mon fichier cms.php

<?php

include(dirname(__FILE__).'/config/config.inc.php');

//will be initialized bellow...
if(intval(Configuration::get('PS_REWRITING_SETTINGS')) === 1)
   $rewrited_url = null;

include(dirname(__FILE__).'/init.php');

if (($id_cms = intval(Tools::getValue('id_cms'))) AND $cms = new CMS(intval($id_cms), intval($cookie->id_lang)) AND Validate::isLoadedObject($cms))
{
   /* rewrited url set */
   $rewrited_url = $link->getCmsLink($cms, $cms->link_rewrite);

   include(dirname(__FILE__).'/header.php');
   $smarty->assign(array(
       'cms' => $cms,
       'content_only' => intval(Tools::getValue('content_only'))
   ));
   $smarty->display(_PS_THEME_DIR_.'cms.tpl');
   include(dirname(__FILE__).'/footer.php');
}
else
   Tools::redirect('404.php');

?>

Voila, si j'ai pas été clair, je m'en excuse!!!

[eyann]

Petite précision, si je modifie mon fichier cms.php en

<?php

include(dirname(__FILE__).'/config/config.inc.php');
include(dirname(__FILE__).'/init.php');

if (($id_cms = intval(Tools::getValue('id_cms'))) AND $cms = new CMS(intval($id_cms), intval($cookie->id_lang)) AND Validate::isLoadedObject($cms))
{
   $smarty->assign(array(
       'cms' => $cms,
       'content_only' => intval(Tools::getValue('content_only'))
   ));
   $smarty->display(_PS_THEME_DIR_.'cms.tpl');

}
else
   Tools::redirect('404.php');

?> 

c'est bien ça qui se passe, j'ai plus de header / footer dans mes fichiers cms infos. Cependant, mon fichier cms.php du post précédent, c'est le contraire, j'ai mon header / footer même sur la page appelée avec la zoombox et le "content_only=1".

Merci d'avance, sans vous je ne serai pas arrivé jusque la.

;-)

[eyann]

Bon, je fais un truc con mais qui a l'air de marcher:

<?php

include(dirname(__FILE__).'/config/config.inc.php');

//will be initialized bellow...
if(intval(Configuration::get('PS_REWRITING_SETTINGS')) === 1)
   $rewrited_url = null;

include(dirname(__FILE__).'/init.php');

if (($id_cms = intval(Tools::getValue('id_cms'))) AND $cms = new CMS(intval($id_cms), intval($cookie->id_lang)) AND Validate::isLoadedObject($cms))
{
   /* rewrited url set */
   $rewrited_url = $link->getCmsLink($cms, $cms->link_rewrite);

   if ($_GET['content_only']!=1) {include(dirname(__FILE__).'/header.php');}
   $smarty->assign(array(
       'cms' => $cms,
       'content_only' => intval(Tools::getValue('content_only'))
   ));
   $smarty->display(_PS_THEME_DIR_.'cms.tpl');
   if ($_GET['content_only']!=1) {include(dirname(__FILE__).'/footer.php');}
}
else
   Tools::redirect('404.php');

?>

avec du php basique :-)

[-Johan-]

Moi la popup apparait du coin haut gauche de la fenêtre quand j'ai qu'une image produit, comment le faire apparaitre à partir de l'image ?

[ps93]

Super contrib!
Validée pour ma part sur PS 1.4

[gbaby]

This is great! It works perfectly with images but I'd like to be able to use it with video as well. Is there any way to make it work with youtube videos?

<object width="425" height="344" data="http://www.youtube.com/v/M0zv4zfaOU4&hl=en&fs=1&" type="application/x-shockwave-flash">


</object>

[Frederic27]

Bonjour à tous,

Personnellement, je pense avoir bien suivi la marche à suivre, mais quand je clique sur un lien au lieu d'ouvrir une petit fenetre comme sur vos prt scr, sur mon site (j'utilise Mozilla) il ouvre une nouvelle page avec le texte . Normal`?

[Ovi]

Anybody tried this on Prestashop 1.2.5 ? Thanks.

[arti795]

Bonjour a tous,

D'abord, merci a yvanb pour cette contibution! mais malgrès le zip mis à jour, j'obtiens un écran noir sur toute la page quand je clic sur l'image principale d'un produit. Par contre tous est nickel sur les miniatures...

Une idée?

[Frederic27]

Je suis désolé de relancer, je sais que c'est chiant, mais j'aimerais bien avoir une solution.

Au lieux d'avoir une fenêtre simple qui s'ouvre j'ai une nouvelle page qui apparait avec mon bg, et le texte dessus, ce qui est forcement moins attirant ^^

[ChristopheS]

Bonjour, merci pour cette contribution.

J'aimerais revenir sur le problème de @cdilouya

La Zoombox passe sur le menu horizontal (pour moi, celui de Cegiel, merci encore Cg) !?

Ça ne fait pas joli du tout, tout le contraire de cet outil bien agréable !

Salut à tous,

La Zoombox est superbe.
Je l’ai installé sur ma boutique http://www.labagageriefrancaise.fr

J’ai juste un pb. Le bouton close de la zoombox arrive pile sur un des éléments du menu (horizontal catégorie).
Alors, quand on clique dessus, on arrive sur sac à main plutôt que revenir sur le produit initial.

Comment on peut repositionner la zoombox un peu plus bas ???

A+

Cédric

Personne ne connait une solution plus propre que de redimensionner et déplacer le bouton de fermeture ?

Savez-vous pourquoi le "visibility","hidden" ne fonctionne pas dans le fichier zoombox.js ?

Fichier zoombox.js - ligne 57

$("embed").css("visibility","hidden"); // On cache tous les éléments qui pourrait passé par dessus zoombox
           $("object").css("visibility","hidden");

Merci, @ bientôt ;-)

--

[ChristopheS]

Je voudrais remercier publiquement Grafikart pour ce script ZoomBox et pour son aide à la résolution de ce problème.

La solution est simple, fallait-il la connaitre !

Il faut jouer sur les z-index, pour cela assuré vous que le z-index de votre barre de menu est inférieurs à celui de zoombox. (c'est la réponse de Grafikart)

Modifiez donc le zoombox.css comme ceci :

#zoombox_conteneur {
   position:absolute;
   padding:18px 18px 56px 18px;
   overflow: visible;
   z-index: 999;
}

Merci Grafikart ;-)

[celine37]

Merci pour cette contribution, l'installation fut rapide, l'effet est superbe, c'est pile ce que je recherchais !

La qualité d'affichage des images couplée à des visuels de qualité offre un rendu génial !

Merci :-)

[SoloWeb]

...

Modifiez donc le zoombox.css comme ceci :

#zoombox_conteneur {

position:absolute;

padding:18px 18px 56px 18px;

overflow: visible;

z-index: 999;

}


...

Thanks vertig for this big notification

[Addamz]

In 1.2.5 change product.tpl with this code.

>

</pre>
<ul>
               {foreach from=$images item=image name=thumbnails}
               {assign var=imageIds value=`$product->id`-`$image.id_image`}

getImageLink($product->link_rewrite, $imageIds, 'thickbox')}" rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}" title="{$image.legend|htmlspecialchars}">
getImageLink($product->link_rewrite, $imageIds, 'medium')}" alt="{$image.legend|htmlspecialchars}" height="{$mediumSize.height}" width="{$mediumSize.width}" />

[Anartisanart]

Merci pour ce zoom.
Pour la version 1.3.1 j'ai suivi les consignes, puis comme le code du fichier "product.tpl" a changé, dans la partie de code indiquée :
j'ai changé ça :

rel="other-views" class="thickbox {if $smarty.foreach.thumbnails.first}shown{/if}"

par ça :

rel="zoombox[other-views]" class="{if $smarty.foreach.thumbnails.first}shown{/if}"

En tout cas ça m'a mis un petit effet zoom et changé l'allure de l'agrandissement. C'est pas mal, mais je croyais à un résultat plus extraordinaire.
Voir une de mes pages pour exemple, http://www.clochtard-crasvat.com/echoppe/16-shirt-f-w.html , si il devait manquer quelque chose dans l'effet, dites le moi.

Merci

[nobock]

Hello, j'ai moi aussi bossé de mon coté pour faire une zoombox sur presta, et j'ai beaucoup modifier le code css. L'auteur de la zoombox ( graphikart ), à mis des bride de css + js pour faire un autre design de sa zoombox, pour qu'elle ressemble à une lightbox plus classique comme celle de presta.

Je l'ai amélioré de tel manière à ce que les liens ne s'affiche pas pareil, suivant le type de lien. Si vous voulez je dépouissière le code , je finit les test et je le partage. Screenshot en bas :

[Anartisanart]

@Nobock

Ton site est superbe... et superbement bien fait...
Est-ce que ta zoombox est en fonctionnement quelque part ? pour voir.
merci à toi

[nobock]

@Nobock

Ton site est superbe... et superbement bien fait...
Est-ce que ta zoombox est en fonctionnement quelque part ? pour voir.
merci à toi

Je viens d'écrire un billet sur cette zoombox, j'ai updater au passage le site pour faire office de démo, et ça à l'air de tourner. En bas de l'article il y a un fichier zip avec tout le package pour l'installer. J'ai fait le truc à la va vite, c'est une beta

http://www.custo.me/contribution-web-20/134-custome-zoombox.html

Par contre j'ai quelques soucis sous presta, je n'arrive pas à supprimer entièrement la thickbox. On dirait que ça ouvre un double popup ou la zoombox prend le dessus, mais sur IE par exemple, cela ne fonctionne pas. Je vais regarder la contrib de celui qui à ouvert le post, cela m'aidera peut être à mieux cerner le problème.

Le must serai d'avoir un zoombox + le rollover zoomable désactivable ou non dans le backoffice. Au passage le coup du pop up block info + cgu est une très bonne idée

[synapse38]

Un énorme merci à Yvanb pour cette contrib géniale !

Et un merci aussi à Ringostar pour la petite ligne qui tue, car effectivement, en 1.3.1, le product.tpl est très différent.


Nobock, on surveille de près ton boulot ;-)

[domi77185]

Bonsoir à tous,

ça fait 2 soirs que je me prend la tête, quelqu'un a t'il réussi à faire fonctionner zoombox sous IE6 ?

La version en test sur le site de l'auteur fonctionne, mais la version adaptée pour prestashop ne fonctionne pas (erreur de script).

error: ")" attendu

j'ai pas trouvé d'ou cela vient, sachant que sur tout les autres navigateurs que j'ai testé fonctionne et sans message d'erreur.

[domi77185]

Bonjour,

Après plusieurs heures de recherche, j'ai enfin réussi à faire fonctionner zoombox sur IE6.

rien de sorcier,
il suffit juste de virer la version de zoombox téléchargeable depuis ce post, et installer la véritable version de zoombox qui est compatible IE6.

attention, si vous avez modifiez le fichier zoombox.css, il n'est pas compatible avec celui de la version officielle.

Dominique.

[nobock]

Hello, j'ai finit de développer le fork de la zoombox. Pour ceux qui auraient loupé le poste précédant, c'est une amélioration de la zoombox classique, avec le skin "lightbox" abandonné par sont auteur + une détection du type de lien et de sont affichage.

Si vous ouvrez une série d'image, les boutons suivant précédant s'affiche à droite et à gauche de l'image, et pour un autre contenu comme un site web ou une vidéo youtube, les bouton suivant précédant s'affiche en bas à droite.

Cette version contrairement à la beta est utilisable sur vos presta en production. Elle à été testé sous ie, fx, chrome, safari ( + iphone ).

Liens pour la télécharger : http://www.custo.me/contribution-web-20/134-custome-zoombox.html

Pour l'installer supprimer le contnenu de votre ancien répertoire zoombox par celui-ci, et supprimez le fichier Jquery.js ( doublons donc inutile ).

[Anartisanart]

super,
je vais tenter d'essayer ça aujourd'hui.

Merci pour le boulot.

[mehdi2405]

bonjour

je decouvre ce magnifique code et bravo à vous pour votre contrib

pouvez vous me dire comment je pourrais l'utiliser pour l'affichage des produits.

merci Prestamis (pas mal non ?)

[Anartisanart]

Merci Nobock,
je viens d'installer ta version, ça fonctionne bien, c'est chouette, merci.

[Anartisanart]

@Nobok

Il faut vraiment enlever le fichier Jquery.js, parce que chez moi, à cause de ce fichier, mes catégories n'apparaissaient plus sur les pages produit.
Sinon, j'ai juste remplacé dans zoombox, les fichiers qui portaient le même nom que les tiens par les tiens et ça a fonctionné.

[nobock]

Prestashop utilise déja la librairie jquery, donc effectivement il ne faut pas inclure le fichier jquery.js dans le dossier de zoombox. Mais aucune obligation de le supprimer normalement.

[Anartisanart]

le jquery de la version d'origine ne posait pas de problème en le laissant là. Mais le tiens si... mystère...

Mais encore merci.

[quinou]

Bonjour,
J'ai installé la zoombox pour les photos mais également pour les pages CMS. Et elle fonctionne parfaitement.
Cependant du fait que le header.php (donc le header.tpl) ait été supprimé de cms.php, nous avons des pages cms indexées uniquement avec le body sans <head> et donc sans meta name (title, description...) d'où un problème pour le référencement. Également, lorsque l'internaute clique sur le lien d'une page CMS à partir de google par ex, il arrive sur une page avec seulement le body.
J'ai essayé en css "display:none". Ca fonctionne bien pour la zoombox mais... aussi pour la page cms!
Y aurait il un moyen de :
-faire apparaitre uniquement le body dans la zoombox
-afficher l'ensemble de la page (head, body, footer) lorsqu'elle est appelée SANS la zoombox

[nobock]

Dans le zoombox.js tu peut rajouter un display none dans le code du squelette de la zoombox.

[quinou]

Bonjour Nobock,
Je ne vois vraiment pas comment faire
N.B. j'ai également été obligé de supprimer le jquerry du dossier zoombox pour que ça fonctionne (vers : 1.3.1.1)

[nobock]

Hello, un module est en cours de développement. Pour l'instantant j'ai quelques soucis pour le rendre facile d'installation, car il faut installer un bon gros bout de code dans le tpl et c'est pas très pratique. Je finalise aussi l'intégration dans tiny MCE pour rendre automatique la détection de zoombox simple / multiple.

En ce qui concerne la commercialisation d'un module basé sur la zoombox, l'auteur m'a dit que quand le projet était terminer, je n'avais qu'a le recontacter pour voir comment s'arranger.

[sebban]

Bonsoir,
Tout d abord Un grand Merci pour cette contributions et toutes celles qui en on découler..
Nobock J ai tenter d installer ta MAJ a la place du module d origine 5 erreur détecter avec Firebug et bug général firefox dommage il avais l air sympa!!!;/
En faite j ai suivi le post car j ai eu un petit problème avec la zome box d origine

Zomebox pour les image ok
Zomebox pour l Order ok
ZomeBox pour le CMS problème affichage= CMS COMPLET CHARGER dans une nouvel page obliger de faire un retour pour revenir au site

J ai surement du zapper quelque chose pourtant j ai vérifier mes fichiers 3 fois ils sont ok avec les fichier du post d origine...J ai lu plus haut qu une personne avait le même problème. Avez vous résolu son problème?

Une idée Nobock??

Ps : J'aurai aimer intégré la zomebox au formulaire de contact pouvez vous me donner un bout de code a remplacer svp

[prestadevelop]

Very nice module, thanks a lot!

[arti795]

bonjour à tous,

Lorsqu'on clique sur le lien (Ouvrir dans une nouvelle page) dans la zoombox contenant une page CMS, cela ouvre bien la page mais avec un problème d'affichage. En effet, étant en "content_only", la page n'affiche pas le "reste" du site, à savoir les blocs header, left, right et footer.

Une solution que j'ai trouvé pour y remédier:

Dans le dossier js/zoombox, ouvrir zoombox.js

Ligne 308 changer:

            
           else{
               zoombox.contenu='<iframe src="'+zoombox.lien+'" width="'+zoombox.largeur+'" height="'+zoombox.hauteur+'"></iframe>';
               zoombox.titre=zoombox.titre+' (Ouvrir dans une nouvelle page)';
               $("#zoombox_titrec").append(' (Ouvrir dans une nouvelle page)');
           }        

par:

           else{
           ///////////modification du lien  " (Ouvrir dans une nouvelle page) "/////////// 
               var lien_modif=zoombox.lien;
               lien_modif=lien_modif.replace('content_only=1','content_only=0');

               zoombox.contenu='<iframe src="'+zoombox.lien+'" width="'+zoombox.largeur+'" height="'+zoombox.hauteur+'"></iframe>';
               zoombox.titre=zoombox.titre+' (Ouvrir dans une nouvelle page)';
               $("#zoombox_titrec").append(' (Ouvrir dans une nouvelle page)');
           }

Cette modif change simplement le "content_only=1" par "content_only=0" dans le lien.

En espérant que ça soit utile à d'autres :-)


ps: encore merci à yvanb pour cette zoombox!

[nobock]

Hello !

Je viens de finir le développement d'un module zoombox disponible sur le prestastore. Le module installe la zoombox pour les photos des fiches produits, les cgv et dans tiny mce.

L'installation ne nécessite aucune modification des fichier tpl si leur structure n'a pas été modifié. ( a rel="other-views pour les fichier produits ). 3 instance de la zoombox sont crée pour pouvoir activer uniquement celle que l'on veut sans créer de conflits. Pour l'intégration à tiny mce il y a un backup automatique à l'installation pour sauvegarder le fichier de config. A la désinstallation du module il y a une restauration automatique de ce fichier.

Pour ceux qui veulent intégrer la zoombox à tiny mce sans ce module car déja effectué l'installation via ce poste il vous suffit de modifier le fichier www/js/tinymce/jscripts/tiny_mce/plugins/advlink/link.htm et ajoutez à la ligne 199 après

{#not_set} 

Le code suivant :

Zoombox
Zoombox ( multiple )

Ensuite quand vous créez un lien dans tiny mce allez a l'onglet avancé et choisissez zoombox en lien relationnel avec la page. Cette manip est valable pour tout les système utilisant tiny mce ( joomla par ex ). Sinon oui le module est payant mais j'ai passé plusieurs heures à faire la modif zoombox et l'intégration à prestashop sans rien modifier. L'auteur de la zoombox recevra un pourcentage des ventes sous forme de don.

Si vous avez des question n'hésitez pas !