Tiled Gallery Block

With Tiled Galleries, you can display your image galleries in a tiled mosaic, circular grid, square tiles, or tiled columns. There is also a slideshow option.

Important: Images added to a Tiled Gallery block are automatically served through Jetpack’s Image CDN, even if you have Jetpack’s Site Accelerator feature disabled.

Here are some examples:

Tiled gallery example with a mix of rectangular images of different sizes

Tiled gallery example with 9 equal-sized square images

Requirements

The Tiled gallery block is available on all Jetpack-connected sites. It is a part of the Jetpack Blocks suite and is activated by default. The block remains available even if you disable the Tiled Galleries feature on the Modules Page.

The Tiled Gallery block does not require a paid upgrade to use. See our Jetpack Blocks article to learn about the available blocks and how to activate them.

Jetpack Blocks require the Block Editor (also referred to as the Gutenberg editor). If you’ve installed the Classic Editor plugin, you will need to switch back to the Block Editor either by:

Deactivating the Classic Editor: Go to Plugins → Installed Plugins in your WP Admin and deactivate the Classic Editor plugin.
Enabling both editors: If you prefer flexibility, navigate to Settings → Writing in your WP Admin. Set Allow users to switch editors to Yes.

See Using Blocks and the Classic Editor for more details.
It may happen that an editor that comes with a custom theme or plugin prevents you from using the Block Editor. In that case, please contact the respective plugin or theme author for further assistance.

Tiled Galleries in the Classic Editor

To use Tiled Galleries using the Classic Editor plugin or the Classic Block, please see this guide about Classic Editor and Tiled Galleries.

Create a Gallery

To create a gallery, please follow these steps:

Add a new Tiled Gallery block with either the in-post block selector or the block selector in the post toolbar.
Add images to your gallery by uploading them from your computer, selecting them from your Media Library, or selecting them from an external source.
Once you’ve added images, use the block toolbar and the sidebar to add your customizations.
The toolbar has a change block type button, which you can use to select the type of gallery you’d like to create.
The other buttons on the toolbar allow you to set the alignment for the gallery by selecting the appropriate option. You can use Edit to add and remove images.
Click on the X to deselect any images you don’t want included in the gallery. Then, drag and drop the images to reorder.
Click Add to Gallery to add new images. When you’ve finished making changes to the images in the gallery, click Update gallery.
To position images within your gallery, you can click on an image within the block and use the arrow buttons to move them:

Screenshot of a Tiled Gallery with one image selected. The image has right/left arrows to move it, and an `X` to remove it from the gallery.

Block Sidebar

In the Block sidebar, you can expand the Styles section to change the gallery type and assign link behavior in the Tiled gallery settings section.

Troubleshoot Tiled Galleries

Tiled Gallery options do not appear or do not display correctly

Go to Jetpack → Settings → Performance and make sure the Site Accelerator option is enabled.
Try switching to a different theme to check if your theme is conflicting with Jetpack’s Tiled Galleries.
Disable any other slideshow or gallery plugins to rule out a conflict.
Finally, if you use the Cleaner Gallery plugin or a theme including this functionality, you won’t be able to use the Tiled Gallery features on your site. To solve this conflict, you can install this small plugin to deactivate the Cleaner Gallery.

How to display a single image in a gallery view

To make a single image on a post or page appear in a gallery view, edit the image and set the Link To display setting to “attachment page”. Now, when your image is clicked, it will appear in the gallery overlay view.

Missing Slideshow option

If the Slideshow option is missing, go to Jetpack → Settings → Writing and make sure the Compose using shortcodes to embed media from popular sites option is enabled.

Define a specific width for your gallery

Tiled Galleries are built to fill your theme’s content width. You can define a specific $content_width value by adding the following code to your theme’s functions.php file:

if ( ! isset( $content_width ) ) {    
      $content_width = 800;    
}

Please be aware that code snippets are provided as a courtesy and our support team is unable to offer assistance customizing them further.

If you do not feel comfortable editing theme files, you can also use this plugin: Custom Content Width.

If your theme doesn’t define a content width, Tiled Galleries will default to 500px wide. You can read more about the Content Width theme feature here.

If your theme already defines a $content_width value, but you would like to use a different value for Tiled Galleries only, you can use the tiled_gallery_content_width filter.

Captions do not appear

The Tiled Gallery block doesn’t support captions (either per image or for the whole block) yet. Another alternative is to use the Classic block to add a Tiled Gallery which will allow you to add captions. There is more on how to do that here.

Still need help?

Please contact support. We’re happy to advise.

Privacy Information

The Tiled Gallery block is disabled by default. You can activate Tiled Galleries anytime by following these instructions and clicking “Activate” next to Tiled Galleries.

Data Used
Site Owners / Users None.	Site Visitors None.
Activity Tracked
Site Owners / Users If disconnecting from Google Photos, we track that Google Photos is being disconnected.	Site Visitors None.
Data Synced (Read More)
Site Owners / Users We sync options that identify whether or not the feature is activated and how its available settings are configured.	Site Visitors None.