How to Create Dynamic WordPress Image Galleries and Sliders With Toolset Blocks

If you purchase through a link on our site, we may earn a commission. Learn more.

Looking for a more flexible way to work with images in the new WordPress block editor? In this post, we'll show you how you can use Toolset Blocks to create your own static or dynamic image sliders and galleries in the block editor.
Table of Contents

Looking for a more flexible way to work with images in the WordPress block editor?

In this post, we’ll show you how you can use Toolset Blocks to create your own static or dynamic image sliders and galleries in the block editor.

If you’re not familiar with Toolset, it’s a suite of tools that help you work with custom content and dynamic WordPress sites.

Toolset Types can help you create custom post types, custom fields, and more. And with Toolset Blocks, you can display them on your site using the native WordPress block editor.

WP Mayor readers can get an exclusive 20% discount when they purchase Toolset.

Below, we’re going to focus on one specific part of Toolset Blocks – images.

Keep reading to learn how it works and how it can help you build better WordPress sites.

How Do Toolset Blocks Help With WordPress Images?

Toolset Blocks helps you display your WordPress site’s content using the native WordPress block editor – no code required.

We previously wrote about Toolset Blocks here.

You might be saying, “Colin, the block editor already lets you display content – that’s the entire point!”

The difference with Toolset Blocks is that it also helps you display custom content, like custom fields and taxonomies that you’ve added with Toolset. You can even use the block editor to design the templates for any custom post types that you’ve created.

I’m getting a bit off track, though, because this post is about images.

With Toolset Blocks, you get access to two image-focused blocks:

  • Gallery – create grid, masonry, or collage galleries.
  • Image Slider – create sliders and carousels with different layouts, captions, and more.

Both of these blocks let you create galleries or sliders from a static set of images, along with plenty of options to control the style and layout of your galleries/sliders.

However, where these blocks get more useful, and where they differentiate themselves from other gallery and slider block plugins, is that you can also dynamically insert images into your galleries and sliders from anywhere on your site.

You could upload images using a custom field that you’ve added with Toolset and then automatically insert those images in a gallery. You could even create a template for a custom post type that you’ve added and then automatically fill the gallery that way.

For example, on a real estate website, you could create a “House” custom post type with an image repeater field to upload images of each house’s interior. Then, you could use those images to dynamically populate a gallery that appears as part of each house’s listing.

Cool, right? I’ll show you how this works in the next section.

How to Use the Toolset Image Blocks With Static Content

Now, I’ll show you step-by-step how to use the Toolset Gallery and Image Slider blocks.

For each block, I’ll start by showing you how to use it with a static set of images. This will give you a good idea of each block’s capabilities.

Then, in the next section, I’ll show you how it works to dynamically populate your galleries and sliders.

When you insert the Gallery block, you’ll be able to choose from three different layouts:

  1. Grid
  2. Masonry
  3. Collage
Gallery layouts

Once you choose your layout, you’ll be able to add images by:

  • Uploading new images
  • Choosing existing images from your Media Library
  • Dynamically populating them from custom fields added to this post (or any other post)

I’ll save the dynamic content for the next section, so let’s just upload some new images for this example:

Image sources

And voila – you’ve got a gallery. You can then use the block sidebar on the right to configure:

  • Styles for your layout, like how many columns to use in a grid or masonry gallery.
  • Captions for each image.
  • Whether or not to open images in a lightbox.
Masonry gallery example

The grid and masonry layouts are fairly self-explanatory, but the collage layout includes a neat feature that lets you choose from pre-made collage layouts or design your own:

Collage layouts

If you design your own layout, you can use a grid system to configure the size and placement of each gallery item, which is really cool:

Custom collage
Software: Snipaste

Image Slider Block

The Image Slider block functions similarly to the Gallery block. 

When you create a new image slider, you’ll be able to choose from the same three sources:

  • Upload
  • Media Library
  • Dynamic Sources

Then, you can use the options on the side to:

  • Change the number of columns. One column would be a traditional slider, while you can create carousels by adding multiple columns.
  • Choose different slider styles.
  • Control styles.
Image slider example

Now that you know the basics, let’s get into the more advanced use for these two widgets and I’ll show you how you can dynamically populate your galleries and sliders.

How to Use the Toolset Image Blocks With Dynamic Content

While these Toolset blocks are useful with static images, there are already lots of blocks that can help you create static galleries and images.

Where Toolset’s image blocks get really powerful (and unique) is when it comes to dynamic content.

You can dynamically populate the content of a gallery or slider with images from an Image custom field that you’ve added with Toolset. You can also use a repeating image field, which lets you add as many images as needed to the custom field.

So…how might this work in practice?

To make this example a little more concrete, I used Toolset Types to create a “House” custom post type. Then, I added a repeating image field where I can upload photos of that house’s interior.

Here’s an example of what the regular repeating image field looks like when I create a new “house”:

Custom field example
Software: Snipaste

Now, I’ll show you how to dynamically pull those images into a gallery or slider.

When you add a Gallery block, you’ll still be able to choose your own layout and use all the other settings that I showed you before.

Only now, when you see the prompt to add images, you’ll choose Dynamic Sources:

Dynamic sources

Then, you’ll be able to choose the repeating image custom field as your source:

Choose custom field

Once you select that source, you’ll see a preview of your gallery using the images from the custom field that I showed you earlier:

Dynamic gallery

If you were to add or remove images from that custom field, those changes would automatically apply to your gallery.

Image Slider

You can use the exact same approach for your image sliders.

When you add an Image Slider block, you can choose Dynamic Sources for your images and then select your repeating image field just as I showed you with the Gallery block:

Dynamic slider

Try Toolset

We’ve teamed up with the team behind Toolset, the page builder which lets you build WordPress sites without coding, to offer you an exclusive 20% discount.

20% Discount

In addition to dynamically inserting images for the post that you’re currently working with, you can also dynamically populate a gallery or slider elsewhere on your site.

For example, let’s say you’re writing a blog post where you want to feature images of a house that you just added to the House custom post type.

To get started, you’d add a new Gallery or Image Slider block to the blog post and choose Dynamic Sources just as before.

Only now, in the Post Source drop-down, you select Other Post. Then, you can search for the post that has the images you want to query. In this example, that’s the “House” listing for “123 WP Mayor St”:

Choose other post

Then, you can select the field that you want to query. And once you’ve done that, you’ll see your dynamically populated gallery just as before:

Dynamic gallery from other post

If you were to update the images in the original post, those images would automatically update in your blog post.

It works the same for the Image Slider block.

You can also use the Gallery and Image Slider blocks in the templates that you create with Toolset, which gives you another way to harness dynamic content. 

For example, you could design the template that you use for the “House” custom post type so that it automatically populates a gallery from each house’s custom fields.

Start Using Toolset Blocks Today

Toolset gives you the power to build custom, dynamic WordPress sites without relying on custom code.

With Toolset Blocks, you can work with your dynamic content right from the native WordPress block editor.

In this post, we’ve highlighted how Toolset Blocks can help you work with images using the Gallery and Image Slider blocks.

In terms of the settings and style options, the blocks are flexible and competitive with other gallery and slider plugins.

Plus, what really sets Toolset Blocks apart is the ability to dynamically populate your galleries and sliders.

You can create repeating image fields using Toolset Types and then use those images to populate galleries and sliders anywhere on your WordPress site, including templates that you create with Toolset.

If you want to see some examples of what Toolset can do and learn how it works, check out the Toolset documentation and reference sites.

And if you want to try Toolset yourself, the link below to get started.

Colin Newcomer

Colin has been using WordPress for over a decade and is on a quest to test all 60,000+ plugins at He has been a Writer and Product Review Expert for WP Mayor since 2017, testing well over 150 products and services throughout that time.

Discover more from our archives ↓

Popular articles ↓

2 Responses

  1. Hi, thanks for this comprehensive and detailed article. It really helped me to explain to my coworker how to build these galleries and add sliders to the website. He is really new to these things and needless to say, he doesn’t hold a lot of knowledge of how things work in the back end. However, your article and the way you explained everything with the help of the images, helped us a lot. WordPress anyway is an amazing platform, really eases up a lot of tasks for you! We are enjoying the fact that you just got to drag and drop a few things here and there and you are good to go!

Share Your Thoughts

Your email address will not be published. Required fields are marked *

Claim Your Free Website Tip 👇

Leave your name, email and website URL below to receive one actionable improvement tip tailored for your website within the next 24 hours.

"They identified areas for improvement that we had not previously considered." - Elliot

By providing your information, you'll also be subscribing to our weekly newsletter packed with exclusive content and insights. You can unsubscribe at any time with just one click.