Tagged: description, Lightbox, woocommerce
-
AuthorPosts
-
December 4, 2013 at 7:01 pm #196317
First: thanks for helping me out with my first lightbox issue (found here). But I just found another issue regarding the lightbox, that only happens inside the woocommerce product gallery. Normally the “alt” text field is displayed above and the “description” text is shown below the photo. But with woocommerce the “description” gets swapped with the photo “title”.
This inconsistant behaviour is really a problem for me as I use the same photos for both pages/posts and products. To be more detailed I did put some copyright information inside the photo description. These infos are missing when viewing the photo inside a product gallery – which is quite a big issue in my case.
- This topic was modified 10 years, 11 months ago by StuWeTueHo.
December 6, 2013 at 2:17 pm #196982Hi StuWeTueHo!
We’ll change this with the next theme version. For a quick fix open up and replace
setTimeout(first_load_amount, 10); $('body').bind('added_to_cart', update_cart_dropdown);
with
setTimeout(first_load_amount, 10); $('body').bind('added_to_cart', update_cart_dropdown); $('.single-product-main-image .images a').each(function(index,value){ var $this = $(this), title = $this.attr('title'), img = $this.find('img'), description = img.attr('alt'); $this.attr('title', description); img.attr('alt', title); });
Cheers!
PeterDecember 17, 2013 at 5:40 pm #201169Hey Peter,
thanks for having a look into this topic. I waited for the theme update, but unfortunately the update didn´t do as expected. Maybe I wasn´t clear with my previous description.
This picture shows how the photo meta should be displayed: “alt” text above and “description” below the picture (at least this is the normal behaviour within this theme).
But with product images it is totally different – and even worse after the update:
With enfold 2.4.3 the “title” is shown above the image instead of the “alt” text.
And instead of the “description” below the photo, the “alt” text is displayed.Thanks for your help!
December 18, 2013 at 9:58 am #201456Hi!
Ok, the problem is that WooCommerce doesn’t use the description field. To fix the issue add following code to functions.php
if(!function_exists('avia_woocommerce_post_thumbnail_description')) { add_filter('woocommerce_single_product_image_html','avia_woocommerce_post_thumbnail_description', 10, 2); function avia_woocommerce_post_thumbnail_description($img, $post_id) { global $post, $woocommerce, $product; if(has_post_thumbnail()) { $image_title = esc_attr(get_post_field('post_content', get_post_thumbnail_id())); $image_link = wp_get_attachment_url( get_post_thumbnail_id() ); $image = get_the_post_thumbnail( $post->ID, apply_filters( 'single_product_large_thumbnail_size', 'shop_single' ), array( 'title' => $image_title ) ); $attachment_count = count( $product->get_gallery_attachment_ids() ); if ( $attachment_count > 0 ) { $gallery = '[product-gallery]'; } else { $gallery = ''; } return sprintf( '<a href="%s" itemprop="image" class="woocommerce-main-image zoom" title="%s" rel="prettyPhoto' . $gallery . '">%s</a>', $image_link, $image_title, $image); } return $img; } } if(!function_exists('avia_woocommerce_gallery_thumbnail_description')) { add_filter('woocommerce_single_product_image_thumbnail_html','avia_woocommerce_gallery_thumbnail_description', 10, 4); function avia_woocommerce_gallery_thumbnail_description($img, $attachment_id, $post_id, $image_class ) { $image_link = wp_get_attachment_url( $attachment_id ); if(!$image_link) return $img; $image = wp_get_attachment_image( $attachment_id, apply_filters( 'single_product_small_thumbnail_size', 'shop_thumbnail' ) ); $image_title = esc_attr(get_post_field('post_content', $attachment_id)); $img = sprintf( '<a href="%s" class="%s" title="%s" rel="prettyPhoto[product-gallery]">%s</a>', $image_link, $image_class, $image_title, $image ); return $img; } }
and in /wp-content/themes/enfold/config-woocommerce/woocommerce-mod.js remove
$('.single-product-main-image .images a').each(function(index,value){ var $this = $(this), title = $this.attr('title'), img = $this.find('img'), description = img.attr('alt'); $this.attr('title', description); img.attr('alt', title); });
We’ll update this with the next theme version.
Best regards,
PeterDecember 18, 2013 at 10:36 am #201467WOW – that fix came quick and yes it works. Your support is awesome.
Edit:
I`m sorry to bother you again, but I found another slight problem. While the solution works perfectly with the featured image, it doesn´t seem to work with product gallery images.- This reply was modified 10 years, 11 months ago by StuWeTueHo.
December 19, 2013 at 11:12 am #201974Hey!
I extended the php code here: https://kriesi.at/support/topic/woocommerce-lightbox-problems-with-description/#post-201456 – does the new code solve the issue?
Best regards,
PeterDecember 19, 2013 at 11:58 am #201983Yes it works! Thanks a lot for your (very fast) help.
As this probably is my last post for this year (am about to leave the office in an hour), I want to thank you and all other support members for your amazing theme support. While the theme itself is great, it is even more awesome with all of your help. I am looking forward to see what you guys have planned for the next year to take enfold to the next level.
Enjoy your Christmas time!
December 19, 2013 at 12:44 pm #201996Hey!
Thank you for the kind words. A happy user is always a pleasure for me :)
Best regards,
Peter -
AuthorPosts
- The topic ‘woocommerce lightbox – problems with description’ is closed to new replies.