Ismael.

Have been away and just got back. Have now applied this and seems to work great!! See http://www.peter-test1.co.uk/artist-test/.

Just one thing..Is it possible to get the thumbnails sorted by price. so for example when selecting ‘All” on the filter the lowest price is at the left and then increases, then in the current example if you select £500-£1500 we get the thumbnials ordered by prices ie £975, £1,150, £1,200, £1,350

Many Thanks
Pete

hI,
For anyone interested in follwoing the same route as me to serve up double-size retina images with high compression to all devices, here’s what I did.

functions.php in child theme:

// remove "responsive images" functionality in WP 4.4 and higher
add_filter('wp_get_attachment_image_attributes', function($attr) {
   if (isset($attr['sizes'])) unset($attr['sizes']);
   if (isset($attr['srcset'])) unset($attr['srcset']);
   return $attr;
}, PHP_INT_MAX);
add_filter('wp_calculate_image_sizes', '__return_false', PHP_INT_MAX);
add_filter('wp_calculate_image_srcset', '__return_false', PHP_INT_MAX);
remove_filter('the_content', 'wp_make_content_images_responsive');

// Disable loads of Enfold & WP image sizes upon upload
// do image sizes manually, double-size with high compression for retina screens
// use Photoshop to set exact double size and quality between Q30 and Q40
add_action('init', 'remove_enfold_image_sizes');
function remove_enfold_image_sizes() {
// do NOT remove widget size, is used in backend portfolio items!
// remove_image_size('widget');
	remove_image_size('square');
	remove_image_size('featured');
	remove_image_size('featured_large');
	remove_image_size('portfolio');
	remove_image_size('portfolio_small');
	remove_image_size('gallery');
	remove_image_size('magazine');
	remove_image_size('masonry');
	remove_image_size('entry_without_sidebar');
	remove_image_size('entry_with_sidebar');
	remove_image_size('shop_thumbnail');
	remove_image_size('shop_catalog');
	remove_image_size('shop_single'); 
  remove_image_size('shop_gallery_thumbnail');
}
// Remove unneeded WP image sizes
add_filter( 'intermediate_image_sizes_advanced', 'prefix_remove_default_images' );
// Remove default image sizes here. 
function prefix_remove_default_images( $sizes ) {
// do NOT remove small and medium sizes, they are used in backend Media Library!
// unset( $sizes['small']); // 150px
// unset( $sizes['medium']); // 300px
 unset( $sizes['large']); // 1024px
 unset( $sizes['medium_large']); // 768px
 return $sizes;
}

List of Enfold/TopMenu image sizes for different image ratios:

w = standard width Enfold
Rw = doubled Enfold width for Retina
GR = Golden Ratio

ENFOLD WITH Top menu

full width header banner frontpage
w 1519 x 430 / Rw 3040 x 860
>>>>> USE:
4:1 > 3000 x  849

news featured
w 81 x 81 / Rw 162 x 162
>>>>> USE:
1:1 > 180 x 180
1:1 > 360 x 360

portfolio 2 column featured
w 758 / Rw 1516
>>>>> USE:
4:3  > 1600 x 1200
3:2  > 1600 x 1067
16:9 > 1600 x  900
GR   > 1600 x  991

portfolio 3 column featured
w 507 / Rw 1014
>>>>> USE:
4:3  > 1024 x  768
3:2  > 1024 x  683
16:9 > 1024 x  576
GR   > 1024 x  624

portfolio 4 column featured
w 378 / Rw 756
>>>>> USE:
4:3  >  800 x  600
3:2  >  800 x  533
16:9 >  800 x  450
GR   >  800 x  496

portfolio single full width
w 1419 / Rw 2838
>>>>> USE:
4:3  > 3000 x 2250
3:2  > 3000 x 2000
16:9 > 3000 x 1688
GR   > 3000 x 1858

portfolio single 2/3
w 918 / Rw 1836
>>>>> USE:
4:3  > 1920 x 1440
3:2  > 1920 x 1280
16:9 > 1920 x 1080
GR   > 1920 x 1189

portfolio single 3/4
w 1043 / Rw 2086
>>>>> USE:
4:3  > 2500 x 1875
3:2  > 2500 x 1667
16:9 > 2500 x 1406
GR   > 1920 x 1549

gallery with right sidebar
w 986 / Rw 1972
>>>>> USE:
4:3  > 2000 x 1500
3:2  > 2000 x 1333
16:9 > 2000 x 1125
GR   > 2000 x 1239

store multi product
w 320 / Rw 640
>>>>> USE:
4:3  >  640 x  480
3:2  >  640 x  427
16:9 >  640 x  360
GR   >  640 x  396

store single product 1/2
w 667 / Rw 1334
>>>>> USE:
4:3  > 1440 x 1080
3:2  > 1440 x  960
16:9 > 1440 x  810
GR   > 1440 x  892

5 column featured
w 216 / Rw 432
>>>>> USE:
4:3  >  480 x  360
3:2  >  480 x  320
16:9 >  480 x  270
GR   >  480 x  297

3/5 of page
w 817 / Rw 1634
>>>>> USE:
4:3  > 1800 x 1350
3:2  > 1800 x 1200
16:9 > 1800 x 1013
GR   > 1800 x 1115

Hi

I will be unable to test for a couple of days.

Could i also ask about thumbnails – how many does the theme generate, is it about 18?

Regards

Faye

Never mind, I’ve got it solved by using:

// custom script
add_action('wp_footer', 'ava_custom_script');
function ava_custom_script(){
?>
<script>
(function($){
	function h() {
	$('#top .product').each(function() {
		var price = $(this).find('.price'),
			thumb = $(this).find('.thumbnail_container');

		price.appendTo(thumb);
	});
	}

	h();
})(jQuery);
</script>
<?php
}

Yes, I mean the Thumbnails in the masonry shop on the same page.

Hi Ismael,

Thanks for that. The problem now though is that the hover function is also disabled, which means that the thumbnails don’t enlarge when you hover over them.

Hi,

the link is: https://virtualbewerbung.de/shopseite/

I just want to Change the Colour of the marked Areas.
btw one more Question: As I ude the masonry shop, the Thumbnails are really small. Where can I adjust the size?