Zen Colorbox

[mc12345678]

I was working with the tpl_footer.php and added the following code:
<script>
jQuery(function($) {
$("#productMainImage").click(function(){
var sty=$( "#productMainImage" ).attr( "style" );
$("#cboxContent").attr("style", sty);
})
})
</script>

This seems to do the trick
Any thoughts
Thanx
Mike

So I think the colorbox code adds some amount of style information to the displayed image. I would think that the background image would be added to that information rather than replace it. The other thing was that I was thinking that perhaps the executed code loaded from the footer might be better suited in a colorbox "event" loader. At least then it may stay together with the colorbox files and logic. If not done that way, would still suggest "testing" for the existence of #cboxContent to be sure that at some future point this additional code wouldn't cause a javascript error that could affect site operation.

Just my two cents worth.

[swguy]

The image I get when I install this on a fresh 1.5.6 cart and click the product info page's main image is super small. Is there a step I missed?

[mc12345678]

The image I get when I install this on a fresh 1.5.6 cart and click the product info page's main image is super small. Is there a step I missed?

Sorry for the delay, really should wait a little longer to answer, but two things come to mind, one is that the image is originally really small, the other is if the site at some point in the past had installed colorbox previously. In the case of the second situation, have found that executing the uninstall sql two or more times in a row (without other navigation) may resolve the issue. Still looking at this for ZC 1.5.7 which is why I don't have much more of an answer at the moment, though am pretty sure it's discussed elsewhere here.

[swguy]

1.5.7 answer will no doubt apply to 1.5.6. Thanks for investigating, let's see what you find. Could be that it just needs tweaking for tiny images.

[Mattie C]

I just noticed that there is a PHP Warning in vanilla Zen Cart versions 1.5.6c and 1.5.7 (PHP Version: 7.3.20) and Zen Colorbox-2.1.2 because of undefined constants LARGE_IMAGE_WIDTH and LARGE_IMAGE_HEIGHT

[07-Aug-2020 20:50:53 UTC] Request URI: /zen-cart-v1.5.7/index.php?main_page=product_info&cPath=2_20&products_id=23, IP address: 00.000.000.000
#1 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_modules_main_product_image.php) called at [public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_product_info_display.php:58]
#2 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_product_info_display.php) called at [public_html/zen-cart-v1.5.7/includes/modules/pages/product_info/main_template_vars.php:153]
#3 require(public_html/zen-cart-v1.5.7/includes/modules/pages/product_info/main_template_vars.php) called at [public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/common/tpl_main_page.php:177]
#4 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/common/tpl_main_page.php) called at [public_html/zen-cart-v1.5.7/index.php:94]
--> PHP Warning: Use of undefined constant LARGE_IMAGE_WIDTH - assumed 'LARGE_IMAGE_WIDTH' (this will throw an Error in a future version of PHP) in public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_modules_main_product_image.php on line 24.


[07-Aug-2020 20:50:53 UTC] Request URI: /zen-cart-v1.5.7/index.php?main_page=product_info&cPath=2_20&products_id=23, IP address: 00.000.000.000
#1 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_modules_main_product_image.php) called at [public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_product_info_display.php:58]
#2 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_product_info_display.php) called at [public_html/zen-cart-v1.5.7/includes/modules/pages/product_info/main_template_vars.php:153]
#3 require(public_html/zen-cart-v1.5.7/includes/modules/pages/product_info/main_template_vars.php) called at [public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/common/tpl_main_page.php:177]
#4 require(public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/common/tpl_main_page.php) called at [public_html/zen-cart-v1.5.7/index.php:94]
--> PHP Warning: Use of undefined constant LARGE_IMAGE_HEIGHT - assumed 'LARGE_IMAGE_HEIGHT' (this will throw an Error in a future version of PHP) in public_html/zen-cart-v1.5.7/includes/templates/responsive_classic/templates/tpl_modules_main_product_image.php on line 24.

[swguy]

Fix for that issue: run this in Admin > Tools > Install SQL Patches

INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, date_added) VALUES ('Product Info - Image Width', 'LARGE_IMAGE_WIDTH', '150', 'The pixel width of Product Info images', '4', '80', now());
INSERT INTO configuration (configuration_title, configuration_key, configuration_value, configuration_description, configuration_group_id, sort_order, date_added) VALUES ('Product Info - Image Height', 'LARGE_IMAGE_HEIGHT', '120', 'The pixel height of Product Info images', '4', '81', now());

[davewest]

The image I get when I install this on a fresh 1.5.6 cart and click the product info page's main image is super small. Is there a step I missed?

Adding this into the bottom of colorbox.css file well effect the initial size of your image

#cboxLoadedContent img {width:70vw !important; height: auto !important;}

sets the image width to 70% of viewable window while keeping it some what responsive on height. #cboxContent auto expands to meet the new image size.

[mc12345678]

Adding this into the bottom of colorbox.css file well effect the initial size of your image

#cboxLoadedContent img {width:70vw !important; height: auto !important;}

sets the image width to 70% of viewable window while keeping it some what responsive on height. #cboxContent auto expands to meet the new image size.

Thing about the "expansion" is that yes the image shown as a demo is super small... I've actually had difficulty in using the ZC default product to find images that are expected to be relatively realistic to the everyday site owner. The images are initially super small and there is nothing to which to enlarge really. An alternative has been to disable the text for such images or to possibly hop into some of the code's events for such small images (at last review one would have to identify the need for this by manual/coded method).

I haven't actually tried your suggestion, but I know that I spent several hours mucking around with just this type issue when I was last working on adjusting the responsive design portion of it. In fact I don't know why I led swguy on to thinking that there was anything different expected than what was shown in the previously attached image other than the site on which I've been testing this against 1.5.7 keeps indicating that I am cross domain requesting content which is why I indicated that I'm still working on it. Not sure if the server/computer was having a day or what, but I was getting a hard fail at anything javascript or primarily ajax...

[Brent]

Any chance someone could post the amended 1.5.7 version of core override please?

1_Installer_Files\includes\templates\YOUR_TEMPLATE\templates\tpl_modules_main_pr oduct_image.php

I'm not sure if the changes made to the core code between V1.5.6 and V1.5.7 also need to be made in the Colorbox insertions.

[mc12345678]

Any chance someone could post the amended 1.5.7 version of core override please?



I'm not sure if the changes made to the core code between V1.5.6 and V1.5.7 also need to be made in the Colorbox insertions.

Umm, there is nothing that really changed other than some comment characters were removed more for "consistency" than for functionality.

E.g. where the pairings of '<!--' and '//-->' were previously used, they have been removed. Otherwise no change in the code since ZC 1.5.5.