Dynamic Data, Query Loops, & Image Blocks

This is a groundbreaking release with tons of awesome new features that really take GenerateBlocks to the next level.

Dynamic Data

You can now apply dynamic data to our blocks!

This allows you to return dynamic content in your Headline and Button blocks, and even add dynamic links to them. Post titles, dates, meta, lists of categories, and much more can now all be displayed inside your Buttons and Headlines with only a couple of clicks.

In our Container block, we can apply dynamic data to your background images so you can use data like featured images and post meta as your backgrounds.

Being able to use dynamic data like this is incredibly powerful and leads us to our next set of features.

Query Loops

Back in December of 2021, we made an announcement on our WP Show Posts site that we were going to discontinue the plugin and merge its functionality with GenerateBlocks. Well, it’s here now! This update includes a new Query Loop block that allows you to build complex lists of posts (of any post type) right inside the editor.

The beauty of this block is that it uses all of our own blocks that you already know and love. Display your posts in columns (or not) with our Grid block, and display all of your post data (titles, dates, excerpts) with our Headline and Button blocks.

Headlines and Buttons handle all of your dynamic content, but we were missing a way to display dynamic images. That leads up to our next new block!

Images

We needed an image block that does things the GenerateBlocks way to really polish off this release, so we built it! Our new Image Block should feel very similar to the core Image block, but with a GenerateBlocks twist.

Options like padding, margin, border radius, and borders are now available for your images. If you’re using GenerateBlocks Pro, you can now use options like Effects and Custom Attributes directly on your images.

For captions, we use our Headline block so you have full control over the styling of them.

And of course, you can build dynamic images that grab the featured image, author avatar, or even an image from your post meta!

New Components

In order to pull this update off, we had to rebuild a lot of components throughout the plugin. Since we were overhauling the code anyways, we ended up improving almost everything GenerateBlocks-related in the editor.

Color Picker Component

Our Color Picker Component has been completely rebuilt from scratch. We no longer rely on core components here – it’s all GenerateBlocks.

Number Component

We built a brand new Number Component that can include presets to save you time. These presets are filterable if you want, and you can also completely bypass the presets by clicking the custom input icon. When you use the custom input we remember your preference so the next time you go to edit a similar option (font size for example), the custom input will show by default.

Dimensions Component

Our Dimensions component has also been completely rebuilt. It now feels much better (less lag when fields are synced) and the syncing feature works a lot better (empty values are now synced).

Inline Background Images

You can now choose to output your background image URLs directly in the HTML instead of in the external CSS. This allows caching plugins to preload your background images and even convert them to other image formats if requested.

Panel Memory

In an effort to improve the overall usability of our blocks, we implemented a memory for which panels you have open between our blocks. For example, if you’re editing the Spacing inside the Headline block and you switch to another Headline block, the Spacing panel will be open and ready just where you left it in the other Headline block.

Default Container Width

For our users who use GeneratePress, the default Container width is controlled using the Container Width option in the Customizer. However, users using different themes can now alter the default Container Width directly in the Settings area of our plugin.

Full Changelog

  • New: Dynamic data
  • New: Query Loop block
  • New: Image block
  • New: Add inline background image option
  • New: Add default container width option
  • New: Number component
  • New: Block icons in the editor
  • Fix: Button link redirecting outside editor
  • Fix: Nested block post excerpts
  • Fix: Button block causing window confirm on refresh
  • Fix: Shape panel spacing issues
  • Fix: Headline link hover color in editor
  • Fix: Outer container width in editor
  • Fix: Error in FSE when adding a Container to the front page
  • Fix: Color picker autocomplete when typing in color
  • Fix: Inherit box-sizing on gb-inside-container in editor
  • Tweak: Full code refactor in the editor
  • Tweak: Move button URL options to toolbar
  • Tweak: Switch all blocks to apiVersion 2
  • Tweak: Require WordPress 5.6
  • Tweak: Rebuild color component
  • Tweak: Rebuild dimensions component
  • Tweak: Rebuild typography component
  • Tweak: Add memory to open editor panels
  • Tweak: Make device buttons sticky
  • Tweak: Improve container width label
  • Tweak: Use compiled assets in script registration
  • Tweak: Improve button CSS selectors in the editor
  • Tweak: Allow more decimal places in background image opacity

102 thoughts on “Dynamic Data, Query Loops, & Image Blocks”

  1. It’s great! I’m totally excited to receive updates so that I can make my home page complete with more recent and classified post blocks.
    Thank you for your effort and great work.
    Keep it up!

    Reply
    • Manuel, when you have the Query Block selected, click on the Add Parameter button on the right side settings. Under the Pagination settings choose Offset and set it to 1. This will exclude the latest post from the query block results.

      Reply
    • Thank you for the answers. I think I didn’t express myself precisely enough. A client of mine offers 8 services and counting. Each service has its own page. All pages with a service are assigned to the “Service” category. All services except the current one should be displayed in the sidebar on these pages. Is that possible?

      Reply
    • Thank you for the answers, Vitor and Mike.
      I think I didn’t express myself precisely enough.
      A client of mine offers 8 services (and growing). Each service has its own page. All pages with a service are assigned to the “Service” category. All services except the current one should be displayed in the sidebar on these pages. Is that possible using querry loop?

      Thanks in advance

      Reply
  2. Well done! First test: works excellent.
    What a lot of possibilities for creativity… exciting. – Thank you.

    Reply
  3. When I read the following regarding inline background images, I smiled so hard. This could be a game changer in so many ways I haven’t even thought of yet.

    “You can now choose to output your background image URLs directly in the HTML instead of in the external CSS.”

    Reply
  4. This is fantastic! Loving the new options here. Question on the query block: Is there a way for this to pull popular posts?

    Reply
  5. Excited about the query loops! Still two important features I need from WP Show Posts:

    1. Exclude current (in WP Show Posts, this is a separate setting and works differently than offset)
    2. Carousel

    Reply
  6. Love the new Image block, it was much needed! I do have a question about the new dynamic meta data. It doesn’t seem to pull from custom field plugins such as ACF. Is this planned for the full release? Keep up the great work!

    Reply
    • For meta fields to show in the dropdown they must be enabled on the REST API. For now, plugins like ACF won’t show the live preview in the editor. We’ll be adding better ACF support in GB Pro 🙂

      Reply
  7. this isn’t really working for me – eg I put a headline block – as soon as I hit dynamic data I get an error: “this block has encountered an error and cannot be previewed.” – checking the error console I see the following error: “TypeError: undefined is not an object (evaluating ‘e.title.raw’) – react-dom.min.js.

    what am I missing

    Reply
  8. Wow. Just Wow. The possibilities are almost unlimited with this update. I’m looking forward to replacing Elementor completely with GB. Thanks so much for this amazing Update!

    Reply
  9. Fantastic work! I love all of the updates.

    I have two feature requests for GBP that I have been looking for since ditching Beaver Builder for GP & GB.

    – Add a related posts query parameter to Query Loop Block – I want to display posts with a post to post relationship to the current post (created by ACF or Meta Box).

    – Display global meta using Dynamic Data – I want to display meta beyond meta that is related to the current post. For example, Meta Box allows you to create a settings page with custom fields. It would be amazing if we could display this meta in a GB block. This would be great for Notification/Alert Banners or other block elements

    Reply
  10. Hey Tom,
    Really excited about this release! I can finally ditch WP Show Posts on a few sites.

    Also, the inline background image is a nice addition. This makes it a lot easier for lazy loaders, preloaders, etc. to better optimize the images.

    Keep up the great work!

    Reply
  11. I’ve been playing around with this new release, and LOVING it. Thank you!

    One issue I’ve run into, though. Trying to add a dynamic background image to the query loop. No matter whether I use the original dynamic data method or the new dynamic data method, the element pulls the featured image from the CURRENT post rather than the post within the query loop.

    See screenshots: https://drive.google.com/file/d/1Ttp0aWyUAHW6ncvsCAvzz102FWhvA7PJ/view?usp=sharing, https://drive.google.com/file/d/1w53No7Cj39OxktJk6hOotSrzOI-SPi5o/view?usp=sharing

    Reply
  12. I’ll surely give this a try on the blogs that I run GeneratePress on.
    Hope i’d be able to create a grid layout on the homepage with news from a specific category.

    Reply
  13. Hey guys,

    I´m looking so much forward for that release because of the Query Loops.
    One important point for me would be: Will it be possible to make the whole blog-card as one clickable? I want to avoid repeating the same link on image, headline and the read more button. But instead I would prefer to make the card as one (even the paragraph and so on) clickable with the same link in as a target. Will that be possible without changing s.th. in php?

    Thank you guys 🙂

    Reply
  14. Interesting! Two questions about the scope of the new features:

    * Is it possible to insert the entire body of a post into a query block, or just an excerpt?

    * Is it possible to replicate the “Masonry” layout of WP Show Posts?

    Thanks so much!

    Dan

    Reply
    • I’ve a use case for the post body insertion! With some other ideas.

      So, I have posts that contain testimonials in category “testimonial”. Each post has one testimonial built with GB.
      Then I created a page on which I want to display one testimonial randomly (or round-robin, etc.) every time the page is loaded.

      To be able to build the above, Dynamic Data would need a possibility to select a category from which posts are selected and use those posts as a source for data, parsing the post contents on the way.

      Currently, I’m doing that with a PHP snippet plugin in a very naive way, so I’d love this improvement 🙂

      All the best,
      Kamil

      Reply
    • The core “Post Content” block should work for displaying the entire content.

      Masonry is something we have planned for the Grid block in Pro.

      Reply
  15. I might have to bite the bullet and install the Beta on live sites. Elementor is causing havoc on two of my sites (where it’s used only for the homepage and one EAT page). I have an unlimited lifetime subscription PostX too, but I have a bunch of stuff already built in Generate Blocks and I don’t want to add more plugins that offer the same basic functionality.

    Reply
  16. Hi Tom

    Brilliant update and looking forward to using it. Will it be possible to add the same ‘remove container’ if no post meta condition that elements has?

    Thanks!

    Reply
  17. I just tried ‘order by’ -> ‘Menu order’ and got “No results found” using a CPT.
    Order by anything else works.

    Is this a known issue?

    Reply
  18. GB 1.5 Beta, only shows the new Query Loop under Elements Block. So can’t use it on say the Home page by inserting a Query Block. Will it only work under Elements?

    Reply
  19. Hey Tom, love GenerateBlocks!

    Trying out the latest RC and just noticed something. Within the WordPress backend, the container block no longer has the ID that is defined under the advanced tab and instead has a generated ID such as “id=block-85f52caa-4464-4100-b46b-b43873185089”. I sometimes use the ID I’ve defined to tweak editor styling so that it matches more closely to the actual site. Hoping we can bring that back 🙂

    Reply
    • This is likely the block editor taking over the ID attribute for their own reasons – I don’t believe there’s anything we can do about it on our end, unfortunately. Could you use a class name, instead?

      Reply
      • Thanks for getting back to me Tom. It’s definitely a change that happens when updating from GenerateBlocks 1.4.4 to 1.5.0-rc.1. I tested it a few times to be sure.

        Here’s an example of how the markup changes on the editor side.

        I think it’ll be super helpful to be able to target elements consistently on both the front-end and the editor-side with either a class or id 🙂

        Reply
      • My example code got stripped out of my reply. What is the best way to provide some example html markup to help provide some feedback on the latest release candidate?

        Reply
  20. My blogging and news clients are going to be so in love with this more optimized and future proof transition of show posts. Thank you so much. I can’t wait to switch!

    Reply
    • Ok, just figured it out and probably a bug as well.
      I have GP 1.5 installed.
      I had GB pro 1.2.0 RC1 installed and there was no template library.
      I uninstalled GB pro 1.2.0 and deleted it.
      I then installed GB pro 1.1.2 instead.
      The template library is now there. I repeated this twice to be sure, and yes, when I put 1.2.0 back in, the template library again disappears. Not sure if it is 1.2.0 or 1.5 GP since I know this is in beta.
      Thanks,
      Doc

      Reply
  21. Awesome, thanks! Now I tried to figure out the differences between the free & pro version, but find it difficult. Can you please provide a table or anything, where the differences are stated more clearly?

    Reply
  22. There is a bug
    On the home page, I used containers to create a grid with fast query, full width layout, and imitation blog In Google’s page header, two posts are queried under a single post on the right. The homepage page is scrolled infinitely. When I click infinite scrolling, it will display the page under the query block on the right side of the grid. However, it does not scroll to the next page in the page section

    Reply
      • I’m sorry I didn’t publish it in the relevant position. In China, there is a great wall firewall. We can’t go to other countries’ networks. We have been trained into a bull and horse. In the marketing topic, I created a container including query cycles on the home page. When I click infinite scroll, it will be loaded in the container, but not under the page.

        Reply
  23. First of all: I love Generateblocks! But two questions i have concerning the update. 1. Is ist possible to set all background images from css to html in one step? If not, will it be possible anytime? Would be handy, to not enable this for every background-image. 2. Is it planned for the query block to have taxonomy or search filters for the frontend, so that a visitor can filter posts?

    Reply
  24. First of all, you’ve done a great job with this new version. I’ve been waiting for a long time and I love it.

    On the other hand, is there any way to exclude the current post from the Query Loop Builder? I can’t find how to do it. Thank you.

    Reply
      • That’s just what I was looking for. I want to build the related posts with generateblocks.

        When do you think this new feature will be implemented? 👏👏

        Thanks Tom.

        Reply
  25. Any advice or update on how to make it so that latest posts from only a specific post category are shown in a dynamic data block?

    It seems at this point it’s only possible to list the latest posts regardless of category.

    I have a podcast, so our posts are split into two categories: artickes and podcast episodes.

    So, I want two different dynamic block sections on my homepage, one to display the 3 latest articles, while the other displays the 3 latest podcast episodes.

    Any help, advice, or information on this would be greatly appreciated, thanks in advance.

    Reply
  26. My Query Loop with Pagination is located toward the end of a long page of content. Clicking on Next Page etc refreshed the URL which feels wrong for the UX. Did I miss some sort of Live Ajaxy style setup documentation to make Pagination feel more up-to-date?

    Reply
  27. Hello!
    I think the Query Loop Block is fantastic!
    What I am trying to do is: display posts from a custom post type via categories, BUT I need to have an “AND” logic for the chosen categories. As I understand it, the query works with an “OR” operator, so the posts displayed can be labeled with “Category A” OR “Category B”. I would need to display the posts labeled with “Category A” AND “Category B”.
    Is this achievable with the Query Loop Block?
    Thank you very much!

    Reply
  28. Hey, i cannot find on the query loop the no results section (as found in the gutenberg built in query loop ), do you have support for it, or how to enable this section?

    Reply

Leave a Reply to Mr. KingsHOK Cancel reply