Jump to content

[Resolved] Product Images


harrisorganic

Recommended Posts

There is no admin configuration option for this and what is being displayed is the thumbnail of the primary image.  This is useful if you do actually have multiple images as it allows you to switch between all available images but pointless if there is only one image

I don't have access to the foundation skin source at the moment to provide the solution but have created a github issue as I believe this should be changed in the core skin https://github.com/cubecart/v6/issues/1075

Ian

Link to comment
Share on other sites

The concern seems to be a presentation choice rather than a display logic choice. That is, regardless of what skin is to be used, the intent is to not display a Gallery if there is only one member in the Gallery -- assumed to be the Main Image.

The code in Catalogue->_productGallery() returns either an array or false. This function also assigns to the template's {$GALLERY_JSON} a JSON encoded string of Gallery images or a zero-length string. So, it is assumed that skins are coded correctly such that the absence of Gallery members should not cause the area assigned to the Gallery to collapse ungracefully. But we can deal with that if it is a problem. (And hopefully, there is no skin that relies solely on the JSON list of images to populate the main image.)

Fortunately, there is a hook we can use to test the array holding the members of the Gallery. If there is only one array element, we can empty the array.

In admin, Manage Hooks, Code Snippets tab, click Add Snippet.

Enabled: Checked
Unique ID: [email protected]
Execution Order: 99
Description: Sets to false and -zls- json if exists only one member in product image gallery
Trigger: class.cubecart.gallery
Version: 1.0
Author: https://forums.cubecart.com/topic/51197-product-images/
PHP Code:
<?php
  if (is_array($return) && count($return) < 2) {
    $return = false;
    $json = array();
  }
?>

 

Link to comment
Share on other sites

  • 2 weeks later...

Alright... Scrap the code snippet idea. (Unless it will, in fact, work with CC5-style skins such as Kurouto.) Disable that snippet, but do not delete it.

In the template content.product.php, find near line 24:

           <ul data-clearing class="clearing-thumbs small-block-grid-3 medium-block-grid-5 marg-top">
               {foreach from=$GALLERY item=image}
               <li> 

Change to:
           <ul data-clearing class="clearing-thumbs small-block-grid-3 medium-block-grid-5 marg-top">
               {foreach from=$GALLERY item=image}
               <li{if $image@total lt 2} style="display:none;"{/if}> 
 

 

Link to comment
Share on other sites

I'm looking at Plushcatalog. This is the source code of your content.product.php template:

         {if $GALLERY} 
           <ul class="clearing-thumbs small-block-grid-3 medium-block-grid-5 marg-top" data-clearing>
               {foreach from=$GALLERY item=image}
               <li><a href="{$image.source}" class="th"><img src="{$image.small}" data-image-swap="{$image.medium}" data-caption="{$PRODUCT.name}{if !empty($image.description)}: {/if}{$image.description}" class="image-gallery" alt="{$LANG.catalogue.click_enlarge}"></a></li>
               {/foreach}

Comparing just the <li> tag, insert the new code as shown.

<li{if $image@total lt 2} style="display:none;"{/if}>

Remember, if necessary, clear the skin cache.

Link to comment
Share on other sites

I had cleared cache and browser as well, but it didn't work. So I took it off the plushcatalog. I have now added it on the estates site with a test item with one photo.

https://dirtybutterestates.com/test-product.html

{*           <ul class="clearing-thumbs small-block-grid-3 medium-block-grid-5 marg-top" data-clearing>
               {foreach from=$GALLERY item=image}
               <li><a href="{$image.source}" class="th"><img src="{$image.small}" data-image-swap="{$image.medium}" data-caption="{$PRODUCT.name}{if !empty($image.description)}: {/if}{$image.description}" class="image-gallery" alt="{$LANG.catalogue.click_enlarge}"></a></li>
              *}
<ul data-clearing class="clearing-thumbs small-block-grid-3 medium-block-grid-5 marg-top">
               {foreach from=$GALLERY item=image}
               <li{if $image@total lt 2} style="display:none;"{/if}>

{*  BSMITHER ABOVE  *}

I'd like to see a hard coded solution that could be part of 6.0.12. None of our normal estates items are one photo items, but almost all 4k+ items on plushcatalog only have one photo.

Link to comment
Share on other sites

You made the change to the <li> tag, but you also removed the rest of the line.

This is the complete line:
<li{if $image@total lt 2} style="display:none;"{/if}><a href="{$image.source}" class="th"><img src="{$image.small}" data-image-swap="{$image.medium}" data-caption="{$PRODUCT.name}{if !empty($image.description)}: {/if}{$image.description}" class="image-gallery" alt="{$LANG.catalogue.click_enlarge}"></a></li>
               

 

Link to comment
Share on other sites

  • 3 months later...

Revisiting this solution, as I have tried the proposed 6.0.13 code and am having several problems with images. I realize this version has not been released yet, but perhaps you could take a look at https://dirtybutter.com/plushcatalog/1984-card-candle-sweet-love-kids-black-indian-ethnic-doll-w-clothes.html

Hopefully you will see where I have goofed. There are several places with image changes in the current 6.0.13 commit, so I suppose it's possible that the fault is not mine - BUT NOT VERY LIKELY.

I am still using your gallery image code as outlined above, because the 6.0.13 version allows for a click on the single image and I'd rather it didn't. (My issue is there even with the code fix for the single gallery image provided in 6.0.13)

My issue with the 6.0.13 code is that clicking on a multiple image item opens the window with THUMBNAIL size images, not the LARGE it should be. And I'm having a problem on this commit with one plugin that for some reason or another cannot "find" the main image, even though it is definitely there.

I turned on DEBUG momentarily and see that the Large image does NOT have a value.

Quote
 

Value

Array (24)
id => "20686"
product_id => "4860"
file_id => "5090"
main_img => "0"
type => "1"
disabled => "0"
filepath => ""
filename => "1984cardandcandlesweetlovekidsethnicdollsamplerdresspants01.JPG"
filesize => "52869"
mimetype => "image/jpeg"
md5hash => "5345ebe1193137c2e859509368680cf0"
description => ""
source => ""
thumbnail => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
category => ""
subcategory => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
gallery => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
checkout => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
normal => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
enlarge => ""
tiny => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
small => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
medium => "/plushcatalog/images/cache/1984cardandcandlesweetlovekidsethnicdollsamplerdre..."
large => ""

 

Link to comment
Share on other sites

Based on the missing values for the Large image, I decided to try adding the default="noimage.png" /> code to the large image in config.xml. The Large image now shows in Debug, but clicking the product image still pulls up the thumbnail. And the plugin now times out looking for the image, rather than giving an error message that there is no main image.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...