Forums › Forums › Search & Filter Pro › how can i search elemntor column while retaining the design of that column?
- This topic has 3 replies, 2 voices, and was last updated 5 years, 7 months ago by Trevor.
-
Anonymous(Private) April 30, 2019 at 6:01 pm #209717
HI, I am currently working on a website in there i have a search form, under the form i have a section with 4 column. i will add multiple section later. how can i make the search work so that if i search for eg. column1 it will show the result but with same format and style. please check the image. thanks
Trevor(Private) May 1, 2019 at 10:28 am #209754Did you follow our guide for using 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 HTML widget, in the Text view tab), it needs the
<script>.....</script>
tags around it. You can often place the form shortcode, the linking filter_next_query action shortcode, and the script all in one text module. So, the entire code block might look like this:[searchandfilter id="25413"] [searchandfilter id="25413" action="filter_next_query"] <script>(function ( $ ) { "use strict"; $(document).on("sf:ajaxfinish", ".searchandfilter", function(){ elementorFrontend.hooks.doAction('frontend/element_ready/posts.classic', jQuery('.elementor-widget-posts')); }); }(jQuery));</script>
-
AuthorPosts