WCFM Store filters are not showing properly

Hello,

I have an issue with WCFM store vendor display page using this shortcode: [wcfm_stores]. I contacted them to help but they said that the problem came from the WOODMART theme (screenshot 3).

As you can see in screenshot 1, when I’m in elementor, the vendor store display filters are showing correctly:
1. The filters above the vendors are not 1 by line but 3 per line.

However, in my main site screenshot 2, the filters are not showing correctly:
1. Only one filter is display by line when I would like 2/3 per line like it is showing in elementor (screnshot 1)

How could I solve that?

Attachments:

You must be logged in to view attached files.

Hello,

Please make the full backup of your site and check the issue on the Storefront theme to detect if our theme causes the problem. Storefront is a free theme developed by WooСommerce.

Best Regards

It is working as it should on storefront. Again, like WCFM said, Woodmart style is causing that and can be fixed by using CSS. Please look at screenshot 3 from previous answer

here is how it looks on storefront!

Attachments:

You must be logged in to view attached files.

Hello,

Please insert the site admin access into the Private content below the message area. We will take a closer look at the case.

Best Regards

sounds good

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .wcfmmp-store-search-form {
	padding: 30px;
	gap: 15px;
}

body .wcfmmp-store-search-form input.wcfmmp-radius-addr, 
body .wcfmmp-store-search-form input.wcfm-search-field, 
body .wcfmmp-store-search-form input#search, 
body .wcfmmp-store-search-form select#wcfmmp_store_category, 
body .wcfmmp-store-search-form select#wcfmmp_store_country, 
body .wcfmmp-store-search-form #wcfmmp_store_state, 
body .wcfmmp-store-search-form .select2-container, 
body .wcfmmp-store-search-form .wcfmmp-search-box, 
body #wcfmmp_store_orderby {
	width: auto;
	flex-basis: 32%;
	margin-right: 0px;
	margin-bottom: 0px;
}

Best Regards

Awesome that works. Just one thing, would it be possible to have 4 filters per line instead of 3? The last filter (choose state) is the 4th one hence at the bottom and taking the whole line. I would like to have all 4 of them on the same line (4 filters per line instead of 3) if possible.

Thank you!

Hello,

Please try to replace the code with this one and check:

body .wcfmmp-store-search-form {
	padding: 30px;
	gap: 15px;
}

body .wcfmmp-store-search-form input.wcfmmp-radius-addr, 
body .wcfmmp-store-search-form input.wcfm-search-field, 
body .wcfmmp-store-search-form input#search, 
body .wcfmmp-store-search-form select#wcfmmp_store_category, 
body .wcfmmp-store-search-form select#wcfmmp_store_country, 
body .wcfmmp-store-search-form #wcfmmp_store_state, 
body .wcfmmp-store-search-form .select2-container, 
body .wcfmmp-store-search-form .wcfmmp-search-box, 
body #wcfmmp_store_orderby {
	width: auto !important;
	flex-basis: 23%;
	margin-right: 0px;
	margin-bottom: 0px;
}

Best Regards

Awesome, that works. Thanks again!

You are welcome! We are here to help.

Wish you a wonderful day!

[Author]

Posts