AnonymousInactive
Ah, well that would explain it. It is a widget made by Elementor. Is it something I need to reach out to them about?
I can see what is happening. The javascript that is styling the menu is also being re-triggered when Elementor runs the Ajax.
Is the menu made by Elementor?
At the moment you are using our Shortcode display results method. You have two alternatives:
#1 Use the Elementor Post grid. Our plugin will integrate with this (to show any Post Type) to allow you to show results in a grid. Our guide for Elementor:
https://searchandfilter.com/documentation/3rd-party/elementor/
Even if you do not have Masonry enabled (it might not even be an option), use the guide for Masonry & Ajax, but, instead of this code:
(function ( $ ) {
"use strict";
// detects when the ajax request has finished and the content has been updated
// re-init the layout scripts from Elementor
$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
elementorFrontend.init();
});
}(jQuery));
Use this code:
(function ( $ ) {
"use strict";
// detects when the ajax request has finished and the content has been updated
// re-init the layout scripts from Elementor
$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
elementorFrontend.hooks.doAction('frontend/element_ready/posts.classic', jQuery('.elementor-widget-posts'));
});
}(jQuery));
Note, if you are placing the code inline on the page (in a widget), it needs the <script>.....</script>
tags around it. You can often place the form shortcode, the linking filter_next_query action shortocde, and the script all in one text module.
#2 Use our integration with the free Post Grid plugin. See here:
https://searchandfilter.com/documentation/3rd-party/post-grid/
You may need to change the Ajax Container to:
.elementor-widget-container > .woocommerce
Once we have fixed this, we need to look at the arrows problem.
AnonymousInactive
Here’s a screenshot of how I have my shortcodes setup in Elementor:
If you are using this combination, then it should be set up as this post describes:
https://support.searchandfilter.com/forums/topic/search-and-filter-pro-woocommerce-elementor-pro/#post-206659
And make sure that the Elementor archive template display condition is set to “Shop” and not category
AnonymousInactive
I’m using Elementor + WooCommerce + s&f pro. I’ve got everything displaying properly however when I select an option in my filter instead of it refreshing my results using Ajax it redirects the page to the category. To see what I’m talking about go to https://nextdaycontacts.com/shop and click on “Acuvue” in the filter to the left. You’ll notice when you select Acuvue it just redirects the page to my Acuvue category instead of just narrowing down my results.
AnonymousInactive
Thanks for the info Trevor! I was able to get everything showing. I had to set my Elementor archive template display condition to “Shop” instead of category to get it to show correctly.
AnonymousInactive
I have a Woo Commerce filter set up for within Elementor and the filter is working great. The problem I am seeing is that within the footer I have some nav menus, and the 1st nav menu when the S&F plugin is being used will show all the products in that 1st menu, and not the actual menu I wish to use.