Problems, need help? Have a tip or advice? Post it here.
6 posts Page 1 of 1
Hello,

I'm trying to display the first image of each product's repeatable gallery as a thumbnail to use in the cart.

I've followed the advice given in another topic here: https://www.couchcms.com/forum/viewtopic.php?f=4&t=9245
However the result doesn't show anything at all. If I enclose the code in the pages masterpage tag it works but then shows all product thumbnails instead of just the one relating the product.

The code in shop.php where I have all my products listed.
Code: Select all
<cms:editable name='group_images' label='Images' type='group' order='20' />
      <cms:repeatable name='product_images' label='Gallery Images' stacked_layout='1' group='group_images'>
         <cms:editable
            name='prod_img'
            label='Image'
            show_preview='1'
            preview_width='150'
            type='image' />
      </cms:repeatable>


The code to display the products in cart.php.
Code: Select all
<cms:pages masterpage='shop.php'>
   <cms:show_repeatable "product_images">
       <cms:if k_count='1' >
          <cms:if prod_img>
            <a href="<cms:show link />" class="cart-thumb">
                    <img src="<cms:show prod_img />" width="70" height="64" alt="<cms:show title />">
             </a>
         </cms:if>
      </cms:if>
   </cms:show_repeatable>
</cms:pages>
Hi,

The original code you mentioned was supposed to execute in a 'page_view' so it knew exactly which page to get the repeatable-regions from. You, it appears, are trying to use it in a 'list_view' so it would need explicitly bringing the pages in context - that is what the <cms:pages> block you used is doing.

So, your code should now iterate through *all* the cloned pages in shop.php, fetch the 'product_images' repeatable region from each page and then show the first image from it.
That is to say, you should see as many images as there are cloned pages in your template.

If that is what you are getting, the code is doing what it has been asked to do and perhaps you should revise the logic of what you are trying to fetch.

As an aside, now with Couch v2.1 (viewtopic.php?f=5&t=11105), there is an easier and more optimized way of fetching a particular row from repeatable-regions. Since you are interested in only the first row, the revised code would become as follows (the 'limit' parameter limits show_repeatable to only the first row) -
Code: Select all
<cms:show_repeatable 'product_images' limit='1' >
    <cms:if prod_img>
        <a href="<cms:show link />" class="cart-thumb">
            <img src="<cms:show prod_img />" width="70" height="64" alt="<cms:show title />">
        </a>
    </cms:if>
</cms:show_repeatable>
Thanks for the reply!

Unfortunately your solution didn't work. But it's my fault as I didn't explain my problem very well. What I'm trying to do is display one image for each product in the shopping cart. I'm using the default cart page from the demo here: https://www.couchcms.com/demo/simple/.

Each product has a its own image gallery that uses a repeatable region. To avoid adding another field to specify an image for the cart and doubling up on images, I thought it would be better to just take the first images from the repeatable galleries. However I'm unsure how to do this with repeatable regions within the pp_cart_items tag.

After rereading the documentation, it talks about adding a 'pp_' prefix to any fields you want available in the cart. So I did it to the code like this, but it still doesn't work.

Code: Select all
<cms:editable name='group_images' label='Images' type='group' order='20' />
      <cms:repeatable name='pp_product_images' label='Gallery Images' stacked_layout='1' group='group_images'>
         <cms:editable
            name='pp_prod_img'
            label='Image'
            show_preview='1'
            preview_width='150'
            type='image'
         />
      </cms:repeatable>


Code: Select all
<cms:pp_cart_items>
                                  <tr>
                                      <td class="col-remove"><a href="<cms:pp_remove_item_link />" class="cart-remove" title="Remove"><!--&times;<span class="screen-reader">Remove</span>--></a></td>
                                      <td class="col-desc">
                                         
                                   <cms:show_repeatable "product_images">
                                      <cms:if k_count='1' >
                                         <cms:if prod_img>
                                            <a href="<cms:show link />" class="cart-thumb">
                                               <img src="<cms:show prod_img />" width="70" height="64" alt="<cms:show title />">
                                            </a>
                                         </cms:if>
                                      </cms:if>
                                   </cms:show_repeatable>
                                         
                                          <div class="desc-box">
                                              <a href="<cms:show link />"><cms:show title /></a>
                                              <p><cms:pp_selected_options separator='<br>' /></p>
                                          </div>
                                      </td>
                                      <td class="col-quantity"><input name="qty[<cms:show line_id />]" class="quantity-input" type="number" min="0" step="1" value="<cms:show quantity />" title="Quantity"></td>
                                      <td class="col-price">
                                          <cms:if line_discount><span class="compare-price">$<cms:number_format orig_price /></span></cms:if>
                                          $<cms:number_format price />
                                      </td>
                                      <td class="col-subtotal">$<cms:number_format line_total /></td>
                                  </tr>
                              </cms:pp_cart_items>
Anyone able to point me in the right direction? Is there any more info you need?
Hi,

Repeatable regions are complex data types so simply prefixing them by pp_ will not work.

However, no worries as there are other workarounds of accessing them within <cms:pp_cart_items>. The <cms:pp_cart_items> makes available to us the page_id of every item as a variable named 'id' - we can use that with <cms:pages> to fetch the full page object representing the product item in context e.g. like this (make sure the masterpage is pointing to the right template) -
Code: Select all
<cms:pp_cart_items>
    <cms:pages masterpage='shop.php' id=id limit='1'>
        .. all variables of the item page available here ..
    </cms:pages>
</cms:pp_cart_items>

The following code should then target the repeatable-region (and the first image within it) -
Code: Select all
<cms:pp_cart_items>
    <cms:pages masterpage='shop.php' id=id limit='1'>
        <cms:show_repeatable 'pp_product_images' limit='1' >
            <cms:if pp_prod_img>
                <a href="<cms:show link />" class="cart-thumb">
                    <img src="<cms:show pp_prod_img />" width="70" height="64" alt="<cms:show title />">
                </a>
            </cms:if>
        </cms:show_repeatable>
    </cms:pages>
</cms:pp_cart_items>

Hope it helps. Do let me know.
Hi,

That fix of adding the id to the pages tag worked! Thanks for all your help, really appreciate the support here :)
6 posts Page 1 of 1