v1.3.9 breaks the products list layout

Resolved madmax4ever
(@madmax4ever)

3 years, 5 months ago

Hello,

I just upgraded to v1.3.9 and discovered that when I select something in my filters, the result is not displayed correctly. I use ajax filtering. And if I refresh the page (i.e. with ?filter_attr=value query on the URL), it is shown as it should.
I use OceanWP theme. In this theme I choose to show 4 items per row. I did not choose a number of item per row inside WPF plugin.
With 1.3.8 everything is fine, but with 1.3.9, classes are not the same and some layout classes are missing from the first element of each row… Thus, the layout is broken. I got the first element in a row, the three others in a second, and so on for every set of four items.

For the moment, I reverted to previous version…

Thanks for your help.

Viewing 3 replies - 1 through 3 (of 3 total)

Plugin Author

Nick McReynolds

(@woobewoo)

3 years, 5 months ago

Hello @madmax4ever,

Please contact our internal support team.
https://woobewoo.com/contact-us/

Thread Starter

madmax4ever

(@madmax4ever)

3 years, 4 months ago

Hello,

In 1.3.9 you commented some jQuery calls. In 1.4.0, they are still commented.
You can see that in line 1382 of frontend.woofilters.js (/woo-product-filter/modules/woofilters/js).

I changed that for the following to make it (more) compliant again with the OceanWP theme:

if ( jQuery('body').find('.products').hasClass('oceanwp-row') ) {
	jQuery('body').find('.products li:first').addClass('col');
	if (jQuery('body').find('.products li').hasClass('span_1_of_1')){
		jQuery('body').find('.products li:first').addClass('span_1_of_1');
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_2')){
		jQuery('body').find('.products li:first').addClass('span_1_of_2');
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_3')){
		jQuery('body').find('.products li:first').addClass('span_1_of_3');
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_4')){
		jQuery('body').find('.products li:first').addClass('span_1_of_4'); 
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_5')){
		jQuery('body').find('.products li:first').addClass('span_1_of_5'); 
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_6')){
		jQuery('body').find('.products li:first').addClass('span_1_of_6'); 
	}
	else if (jQuery('body').find('.products li').hasClass('span_1_of_7')){
		jQuery('body').find('.products li:first').addClass('span_1_of_7'); 
	}

	if (jQuery('body').find('.products li').hasClass('owp-content-center')){
		jQuery('body').find('.products li:first').addClass('owp-content-center'); 
	}
	else if (jQuery('body').find('.products li').hasClass('owp-content-left')){
		jQuery('body').find('.products li:first').addClass('owp-content-left'); 
	}
	else if (jQuery('body').find('.products li').hasClass('owp-content-right')){
		jQuery('body').find('.products li:first').addClass('owp-content-right'); 
	}
}

Hope it helps others.