DIVI – Blog module grid

Trevor

#98318

Hi

Can you take a look at this thread:

https://support.searchandfilter.com/forums/topic/how-do-i-stop-sf-generating-its-own-posts/

The private posts contain nothing of relevance.

Anonymous

#98544

Hi I checked the post and problem is I’m a bit beginner with code and I prefer visual and drag and drop 🙂

I’ll try to tell you what I need in more detailed way.

1. I use DIVI theme
2. I need to display posts on non archive page with post made with divi grid module (divi shortcode via Divi builder)
3. I made grid with posts and I need to filter them on the same page
4. My page is: http://new.pravenacepu.cz/na-cepu/

How should I set it up? If you want I can give you credentials.

Trevor

#98642

OK. We will try this by steps.

Step #1. Make a form (keep it simple for now) and set the Display Method to Custom and enter the full URL of your page as the Results URL.

Step #2. Add that form to the page by using the form shortcode (paste it into whatever content module Divi has for shortcodes).

Run the page. Does the form appear? It will not work yet. If it appears, send me the link for the page so I can see.

Anonymous

#98744

Ok, now I created form with default setting, only set to Custom and add url http://new.pravenacepu.cz/na-cepu and inserted shortcode. Form is showing.

Trevor

#98834

This reply has been marked as private.

Anonymous

#98924

This reply has been marked as private.

Trevor

#99013

This reply has been marked as private.

Anonymous

#99050

This reply has been marked as private.

Trevor

#99081

Hi Jan

I will do this tomorrow as it is getting late here. The good news is that for the other person who wanted this, we have now worked out how to get it working.

Trevor

#99184

OK

Hopefully it now works. But how?

In the page (ID #78) there are three content elements above the grid:

#1 is a Code Element, containing this:

<script>(function ( $ ) {
  "use strict";
  $(document).on("sf:ajaxfinish", ".searchandfilter", function(){
    console.log("ajax complete");
    var grids = document.getElementsByClassName('et_pb_blog_grid');
    salvattore['register_grid'](grids[0]);
  });
  
}(jQuery));</script>

This reworks the grid after filtering is done by Ajax

#2 The form shortcode:

[searchandfilter id="178"]

#3 The shortcode to filter the results in the Divi query/grid:

[searchandfilter id="178" action="filter_next_query"]

Then in the form.

I have set Auto Count (both settings) to ON
The Display Results Mode is set to Custom
The Ajax container is set to .et_pb_blog_grid

and, because you are searching Posts and Pages, in the Posts settings, I have excluded page ID #78 (otherwise the search form is a result in the grid!!).

Does that work OK for you, and if so, can I close this thread?

EDIT: If the above does not work, Divi have a habit of changing their code, so instead of et_pb_blog_grid (used in the form and the javascript) try using et_pb_salvattore_content instead.

[Author]

Posts