{"id":5140,"date":"2024-11-11T09:00:14","date_gmt":"2024-11-11T16:00:14","guid":{"rendered":"https:\/\/www.whitefirdesign.com\/blog\/?p=5140"},"modified":"2024-11-09T15:27:18","modified_gmt":"2024-11-09T22:27:18","slug":"disabling-pop-up-images-on-zen-cart-websites-product-pages","status":"publish","type":"post","link":"https:\/\/www.whitefirdesign.com\/blog\/2024\/11\/11\/disabling-pop-up-images-on-zen-cart-websites-product-pages\/","title":{"rendered":"Disabling Pop Up Images on Zen Cart Website&#8217;s Product Pages"},"content":{"rendered":"<p>Recently, we were brought in to disable the pop up to show larger images on the product page of a Zen Cart website. Looking around, we didn&#8217;t see information on doing this with more recent versions of Zen Cart. With the default template files of Zen Cart, there isn&#8217;t an option in the admin area to do that. Instead, you need to modify a template file.<\/p>\n<p>If a template hasn&#8217;t been overridden, the file handling this is at \/includes\/templates\/template_default\/templates\/tpl_modules_main_product_image.php<\/p>\n<p>The relevant code is this:<\/p>\n<pre lang=\"php\" escaped=\"true\">    &lt;a href=\"javascript:void(0);\" onclick=\"openModal('imageModalPrimary')\"&gt;\r\n        &lt;?php echo zen_image($products_image_medium, $products_name, MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT); ?&gt;\r\n        &lt;br&gt;\r\n&lt;!--        &lt;div class=\"imgLink center\"&gt;--&gt;&lt;?php \/\/echo TEXT_CLICK_TO_ENLARGE; ?&gt;&lt;!--&lt;\/div&gt;--&gt;\r\n    &lt;\/a&gt;<\/pre>\n<p>What that code does is to create a link that runs JavaScript code that surrounds the image. That would be this part of the code, &#8220;&lt;a href=&#8221;javascript:void(0);&#8221; onclick=&#8221;openModal(&#8216;imageModalPrimary&#8217;)&#8221;&gt;&#8221; and &#8220;&lt;\/a&gt;&#8221;. When the image is clicked, the JavaScript code runs and the pop up appears.<\/p>\n<p>The simplest way to change that is to comment out the lines like one line in the code already was. So it would look like this:<\/p>\n<pre lang=\"php\" escaped=\"true\">&lt;!--    &lt;a href=\"javascript:void(0);\" onclick=\"openModal('imageModalPrimary')\"&gt;--&gt;\r\n        &lt;?php echo zen_image($products_image_medium, $products_name, MEDIUM_IMAGE_WIDTH, MEDIUM_IMAGE_HEIGHT); ?&gt;\r\n        &lt;br&gt;\r\n&lt;!--        &lt;div class=\"imgLink center\"&gt;--&gt;&lt;?php \/\/echo TEXT_CLICK_TO_ENLARGE; ?&gt;&lt;!--&lt;\/div&gt;--&gt;\r\n&lt;!--    &lt;\/a&gt;--&gt;<\/pre>\n<p>You could also remove the code. There also is code above that in the file that loads the larger image, which you could also comment or remove.<\/p>\n<p>Any changes you make to the default template files need to be reapplied when you do <a href=\"https:\/\/www.whitefirdesign.com\/services\/zen-cart-upgrade.html\">an upgrade of Zen Cart<\/a>, if the template files is changed. Or you can use <a href=\"https:\/\/docs.zen-cart.com\/user\/template\/template_overrides\/\">template overrides<\/a> to handle the changes instead modifying default files.<\/p>\n<p>If you need help handling something like this with your Zen Cart website, <a href=\"https:\/\/www.whitefirdesign.com\/services\/zen-cart-support.html\">we are available to help<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Recently, we were brought in to disable the pop up to show larger images on the product page of a Zen Cart website. Looking around, we didn&#8217;t see information on doing this with more recent versions of Zen Cart. With the default template files of Zen Cart, there isn&#8217;t an option in the admin area &hellip; <a href=\"https:\/\/www.whitefirdesign.com\/blog\/2024\/11\/11\/disabling-pop-up-images-on-zen-cart-websites-product-pages\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Disabling Pop Up Images on Zen Cart Website&#8217;s Product Pages&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[30],"tags":[],"class_list":["post-5140","post","type-post","status-publish","format-standard","hentry","category-zen-cart"],"_links":{"self":[{"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/posts\/5140","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/comments?post=5140"}],"version-history":[{"count":5,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/posts\/5140\/revisions"}],"predecessor-version":[{"id":5146,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/posts\/5140\/revisions\/5146"}],"wp:attachment":[{"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/media?parent=5140"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/categories?post=5140"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.whitefirdesign.com\/blog\/wp-json\/wp\/v2\/tags?post=5140"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}