I figured it out. The script needed to relayout masonry is:
(function ( $ ) {
"use strict";
//detects when the ajax request has finished and the content has been updated
// - add scripts that apply to your results here
$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
elementorFrontend.init();
//so load your lightbox or JS scripts here again
});
}(jQuery));
Also, in some circumstances, I noticed there were some pagination issues, these can be fixed by adding this to functions.php (replacing my-posts
, with the slug of the page the posts widget is on):
//fix pagination issues in elementor when using posts widget with S&F
add_action('loop_start', 'elementor_post_widget_pagination_fix', 10);
function elementor_post_widget_pagination_fix($query)
{
if(is_page("my-posts")){
$sf_paged = 1;
if(isset($_GET['sf_paged'])){
$sf_paged = intval($_GET['sf_paged']);
}
set_query_var("paged", $sf_paged); //elementor uses get_query_var to get current page, so lets set it before its performeed
}
remove_action('loop_start', 'elementor_post_widget_pagination_fix', 10);
}
Thanks