Zen Colorbox

davewest:

WheelZoom makes use of the existing displayed image and zooms in using css and is easy to add into colorbox.. I added it to my site and it works. When colorbox displays the image, hovering over the image, spin the mouse wheel to zoom in/out grab the zoomed in image to move it around. Sample installation, download wheelzoom from Jack Moore wed site and place the script file in your template jscript folder.

modify includes/classes/zen_colorbox/jquery_colorbox.php add

echo '<script type="text/javascript" src="' . $template->get_template_dir('.js', DIR_WS_TEMPLATE, $current_page_base, 'jscript') . '/wheelzoom.js"></script>"></script>';

> 
> modify includes/classes/zen_colorbox/autoload_default.php add edits in red
> ```
$("a[rel^='colorbox']").colorbox({onComplete:function(){ wheelzoom(document.querySelectorAll('.cboxPhoto')); }, <?php require_once(DIR_FS_CATALOG . DIR_WS_CLASSES . 'zen_colorbox/options.php'); ?>});;

That's all you need to do for wheelzoom to work in colorbox!
If you use img as instructions, when colorbox close so will all images on your site.. Use cboxPhoto instead of img tag.. When I figure out why git cola stopped posting, I'll add it to my github page..

Interesting.. thanks for the share..:smile: Was thinking as I looked this over that this would be nice if this was an admin selectable option.. Maybe I'll give that a play when my time permits..

DivaVocals:

Interesting.. thanks for the share..:smile: Was thinking as I looked this over that this would be nice if this was an admin selectable option.. Maybe I'll give that a play when my time permits..

You make it hard to keep it simple... uploaded my true files.. I was thinking of using both zoom and wheelzoom with a switch, but decided to just do wheelzoom which covers all I needed.

Yes, I did a switch, ZEN_COLORBOX_SCALEPHOTOS its part of the options file on my site.. removed from autoload..

if (ZEN_COLORBOX_SCALEPHOTOS == 'true') {
echo 
', onComplete:function(){ wheelzoom(document.querySelectorAll(\'.cboxPhoto\')); }';
}

davewest:

You make it hard to keep it simple... uploaded my true files.. I was thinking of using both zoom and wheelzoom with a switch, but decided to just do wheelzoom which covers all I needed.

Yes, I did a switch, ZEN_COLORBOX_SCALEPHOTOS its part of the options file on my site.. removed from autoload..

if (ZEN_COLORBOX_SCALEPHOTOS == 'true') {
echo
', onComplete:function(){ wheelzoom(document.querySelectorAll('.cboxPhoto')); }';
}

hahahahaha.. Sorry about that.. It's just that I liked the idea of this as an additional feature, and was gonna incorporate it into the module Then I  thought that in doing so it should be an option that could be turned off..:blush:

I just wondered if there is a way to make Attribute images use the colorbox functionality?

I am using a new install of ZenCart 1.5.5a with the "responsive_classic" template.... and although Colorbox works perfectly on my PC's Product Information Pages, it only shows the picture on a totally blank page when viewed from any mobile device. (phones or tablets). Colorbox did work fine when I had ZenCart 1.5.4 with the "winchester_black" template.

Any ideas on a fix?
Thanks,
Danny::blink:

i just installed Zen Colorbox with the "responsive_classic" template, in step 7 Now paste the sql that you copied in step 5 into the sql area and press send, i clicked send, errors displayed at top:

can anyone please advise how to fix this?

I've not had any problems running jQuery Colorbox on ZC 1.5.5a!!

PHP5.6, jQuery 3.1.1, Colorbox 1.5.14, Wheelzoom 3.0.4, base template (Responsive Sheffield Blue v2.0)

Still in a test environment, just finished converting the template layout and starting the install/upgrading plugins. I use Colorbox for more than images so my install is a bit different as posted on GitHub.

I would suggest running uninstalls or try looking at your database and manually remove lost installs before trying it again. I noticed in RSB, the script for colorbox mobile wasn't where I use mine, but I didn't spend time looking for I removed it and installed my version.

When you refreshed admin, did colorbox config show up! Did you remove Slimbox?

holawill:

i just installed Zen Colorbox with the "responsive_classic" template, in step 7 Now paste the sql that you copied in step 5 into the sql area and press send, i clicked send, errors displayed at top:

can anyone please advise how to fix this?

Have you worked through the issues you were having with installation?

If the sql had been run while under a different template, or if it had been installed into a database that had it installed previously and is now upgraded, or if it was installed and never removed (there is a separate sql query to run) then likely to receive sql errors similar to above, though really should have more information available. If there is a sql install error there is likely also going to be an error log in the logs directory.

After I had some rest and took more care about comparing files for installation (code "commented out" by use of ```

Hi mc12345678,

1. I removed all configuration_key for lightbox, finally i successfully installed colorbox.
2. but under mobile user agent testing, it always shows connecting... and the page does not show correctly, so i followed your advice and checked \templates\tpl_modules_main_product_image.php, and changed "<!--" to "<//!--" on both lines 23 and 28, it works well now on mobile user agent now, but the main image does not show, just additional images display, any ideas?

holawill:

Hi mc12345678,

1. I removed all configuration_key for lightbox, finally i successfully installed colorbox.
2. but under mobile user agent testing, it always shows connecting... and the page does not show correctly, so i followed your advice and checked \templates\tpl_modules_main_product_image.php, and changed "<!--" to "<//!--" on both lines 23 and 28, it works well now on mobile user agent now, but the main image does not show, just additional images display, any ideas?
   So there is/was a misunderstanding of my previous comment. The important thing I noticed was that when merging/inserting the code from tpl_modules_main_product_image.php that all text was important even the text between ```

What you are probably experiencing is a javascript error that is causing the code from includes/modules/pages/product_info/jscript_zen_colorbox.php to error out and not continue processing.

In an effort to add functionality a check was not incorporated for those that don't have the additional code that is sought. I've posted a preliminary solution to this issue at <https://github.com/daniel-hopkins/zen-colorbox/issues/9>. It worked for me where I don't have the extra code, but I don't know if it still works for those that do. Looks like it would, but as they say the proof is in the pudding.

Hi mc12345678,
"What you are probably experiencing is a javascript error that is causing the code from includes/modules/pages/product_info/jscript_zen_colorbox.php to error out and not continue processing."

I can not see any erros in logs. can you please try to provide a solution?

from chrome browser, i can see 1 error and 2 warnings:

i tried old version zen_lightbox-v1.6.4a_1.5, seems a little better, but the top menu does not display correctly.

holawill:

Hi mc12345678,
"What you are probably experiencing is a javascript error that is causing the code from includes/modules/pages/product_info/jscript_zen_colorbox.php to error out and not continue processing."

I can not see any erros in logs. can you please try to provide a solution?

I have posted a change in my github version and I believe a pull request to "the original". It can be found at: https://github.com/mc12345678/zen-colorbox/commit/03bd27343d8294b7431473f8fa4b1bb8dd9f36bc

As discovered after the above message a "log file" is not generated, but when using a desktop browser or any browser with a viewable console that can receive action information the issue can be seen.

danielosko:

I am using a new install of ZenCart 1.5.5a with the "responsive_classic" template.... and although Colorbox works perfectly on my PC's Product Information Pages, it only shows the picture on a totally blank page when viewed from any mobile device. (phones or tablets). Colorbox did work fine when I had ZenCart 1.5.4 with the "winchester_black" template.

Any ideas on a fix?
Thanks,
Danny::blink:

Danny - I have now the same problem.
Did you find a solution ?

Found the solution.
Need to turn off zoom of Image Handler:
Admin>configuration>images:
IH small images zoom on hover: No

Hi
ZC 1.5.5d, Responsive Classic template.

3 days ago I have noticed about a problem with the colorbox popup image on Chrome browser 58.0.3029.96 on mobile/tablet.
I have Image Handler 4 installed as well.
When it popups, it goes to the left and the "background" disppears. Sometimes the popup windows shrank.
The problem does not happen on chrome desktop.
Other operation systems I have checked (like Firefox etc') all is OK even on mobiles.
Do not understand what was changed. The site worked OK with these plugins before.
Maybe the SSL I configured lately.
When removed the "userway" javascript I have on the site, things got a little better but still a problem.
Tried MC code in includes/modules/pages/product_info/jscript_zen_colorbox.php without success.
Tried using JS 1.11.1 instead 1.12.0 and no better results regarding this issue.

Here is the link.
The weird thing is that a similar site link2 works fine and also uses "userway" js, colorbox, image handler4 but on ZC1.5.4.
When compared the files of colorbox / image handler, to see the difference, they look the same.

Not sure if this is your issue - I had a bit of wonkiness when I switched site to full SSL. There were some images in template file that were ref'd http. There weren't many and I found them easily with admin/developers toolbox search.

OK thanks
Will try and update
(starting to hate this SSL)

710 lines in template search
mostly with http://www.zen-cart.com....
but no http pictures links
what else it could be ?