SOLVED: Gutenberg Blocks with Query shows in Editor but not on Frontend

Hey @matjaz sorry to bother you again, but I’m facing a Problem which I can’t solve myself!

I’m working on the same project with the jobs as yesterday. Now I wanted to create a few different Blocks showing Posts (with WP_Query), such as Grid, Sliders and so on. So I’ve started to create the posts-grid element. However, the Element shows up nicely in the Gutenberg-Editor but on Frontend it doesn’t show anything. Also the “no Posts found” message doesn’t come up there.

I’ve checked the generated PHP Code of the query and everything seems to be fine. I’ve also recreated the query in a quick shortcode for debugging it and there it also worked. Is there anything I am missing on how to set that up correctly?

It is probably something very obvious I’m overseeing here. But I’m fighting with it the whole morning now and I seem not to be able to find the missing puzzle-part!

My Setup:

How it Looks inside Gutenberg:

How it Looks on the frontend:

And last but not least the shortcode which outputs all IDs (same query args as pinegrow generated):

One further information:
It works on the default post-types: pages/posts …so i thought maybe I have to go with the main query, but that also didn’t solve the problem.

I’ve also registered another post-type in which the query isn’t shown either. So the problem has something to do with custom post-types. What’s strange is that even if it doesn’t find any results it kind of stops the whole blog from outputting. The static heading and subheading aren’t shown and also the “no posts found” message is not shown too (which is all shown on pages/posts when i play around there)

I’ve wasted now over a 3/4 of a day to find a solution for that and the problem was that there was some kind of incompatibility with the existing theme. Don’t know exactly where it comes from but when I activate twenty-twenty-two everything works. So I probably have to overwork the whole template part of that theme to make it work! At least I know where it comes from and I know that Pinegrow is solid rock in its output! :slight_smile:

1 Like

@Wolfgang.Hartl glad to hear you solved the mystery :slight_smile: That would explain why the front end image shows three empty bullet points, indicating that the query did return three posts but there is a display issue.

Yeah, it is really a pain to work with such a theme. I’ve now ended up creating my own custom single.php file which works, but yeah - not really fun! :wink:

Noo the 3 bullet-points really come from an empty core/list element, which get placed there via a template. Was just too lazy to fill there something in!

I can’t explain why it was really completely empty. Only the standard HTML-Comment of the Gutenberg-Blocks was outputted there. No hint or any other DOM-Element why it didn’t work. Really strange.

But let me tell you one thing, after two days of working with pinegrow now, i really think i fell in love. It has, as you mentioned in your videos, a steep learning curve. But as I start to feel comfortable with the basics there are more and more features I’m exploring UI-wise, which i totally love. Such as the “focus” thing for example! :slight_smile:

4 Likes