Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

For most WordPress sites, the built-in Gallery block is enough to create a responsive image gallery—no plugin required. Add the block, select images, choose a column count that keeps thumbnails legible on phones, and preview the result at multiple widths. WordPress supplies responsive image markup so browsers can choose an appropriate image size; a gallery plugin is worth considering only when you need specific layouts, albums, video, or more lightbox controls.

Build a responsive gallery with the WordPress Gallery block

  1. Prepare your images. Use clear filenames and choose images with a consistent subject focus. Avoid uploading originals much larger than the display context unless visitors need full-resolution viewing.
  2. Add the block. In the editor, open the block inserter and search for Gallery, or type /gallery. Select existing media or upload images. WordPress describes the block as a way to add multiple photos and arrange them in a gallery: Gallery block documentation.
  3. Set columns for the narrowest important screen. Use enough columns to make the gallery compact on desktop, but check that each thumbnail remains recognizable on a phone. There is no single column count that fits every gallery: image subject, theme layout, and screen width all affect legibility.
  4. Add image text. Write alt text that conveys the purpose of each informative image. Leave alt text empty only when an image is purely decorative. Add captions when they supply useful context, and avoid repeating the caption word for word in alt text.
  5. Choose what happens when an image is selected. Set image links to attachment pages or media files if that suits the page, or choose Enlarge on click for a larger view without leaving the page. The exact controls depend on the WordPress version and editor context.
  6. Choose cropping deliberately. A consistent aspect ratio can make a grid look orderly, but use it only when cropping will not cut off important content. Otherwise, preserve each image’s natural composition.
  7. Preview and test. Check phone, tablet, and desktop widths. Confirm that captions fit, keyboard focus is visible, images load as expected, and the gallery does not jump around while loading.

Why WordPress galleries adapt to screen size

WordPress has generated responsive image markup since version 4.4. Its image markup can include srcset, a list of available image widths, and sizes, a description of the space the image is expected to occupy. The browser uses those hints to choose a source suited to the viewport and display density rather than automatically downloading the largest file for every screen. See the WordPress responsive images handbook.

The handbook lists 768 pixels as the default medium_large width and 2048 pixels as the default maximum width used by the max_srcset_image_width safeguard. These are implementation defaults, not guaranteed settings for every site: themes and plugins can change them. Theme developers can also adjust the calculated sizes value with the wp_calculate_image_sizes filter.

Responsive image sources help avoid oversized downloads, but they do not determine whether a gallery looks good. Column count, image crop, captions, and theme styling still need to be checked at the screen widths your visitors use.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.

Choose a lightbox that fits your site

The Gallery block offers Enlarge on click among its image-link choices. The related core Image-block lightbox setting is documented for WordPress 6.4 and later and can be enabled in a theme’s theme.json using settings.blocks.core/image.lightbox.enabled. The available control may vary by version, theme, and block, so verify it in your own editor. See the Theme Handbook lightbox settings.

Whichever lightbox you use, test it with a keyboard as well as a mouse or touchscreen. Visitors should be able to reach and operate its controls, see where keyboard focus is, and close the enlarged view. If the core option lacks a feature you need—such as particular navigation or album behavior—that is a concrete reason to consider a gallery plugin.

When a gallery plugin is worth using

Start with the native block unless you can name a requirement it does not meet. Plugins add features, but also add another component to update and test alongside your theme, caching, and image optimization. Feature descriptions below come from the vendors’ WordPress.org listings; they are not independent performance tests.

Option What its listing describes Consider it when
Envira Gallery Responsive galleries, a responsive lightbox with touch/swipe and fullscreen features, albums, video galleries, lazy loading, image compression, and block-editor integration; the listing also advertises a paid Pro upgrade with additional features. Envira Gallery listing You need its listed lightbox, album, or video capabilities, or want to evaluate the additional Pro features.
FooGallery Seven free layouts, including responsive, masonry, justified, portfolio, single-thumbnail, and carousel; built-in lightbox, albums, block-editor and shortcode support, lazy loading, pagination, reduced layout shifts, and migration from other gallery plugins. FooGallery listing You need a choice of gallery layouts, migration features, or a combination of its listed presentation options.
Modula No-code responsive galleries, custom grid sizing, cropping control, hover effects, watermarking, and optimization extensions. These are vendor-described features. Modula listing You want more control over grid sizing and cropping or need the listed effects and extensions.

Compare candidates against the actual needs of your site: layout control, lightbox navigation, albums or video, migration, optimization, accessibility controls, editor integration, licensing cost, and maintenance effort. The feature listings do not establish which plugin will be fastest on your hosting setup, so do not choose on a universal speed claim; test the finished page with your theme, caching, and optimization enabled.

Special offer. See more information about Outbyte and uninstall instructions. Please review EULA and Privacy policy.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Support on Ko-Fi

Check accessibility and loading behavior

  • Keep image width and height metadata so the browser can reserve space and reduce layout shifts.
  • Use generated image sizes where appropriate, and avoid serving needlessly large files for small gallery tiles.
  • Make sure a chosen crop preserves the subject and captions remain readable on narrow screens.
  • Test keyboard operation and visible focus for any lightbox.
  • Recheck the live page with caching and optimization enabled; plugins can change markup and loading order.

Learn WordPress also describes the Gallery block as responsive and reminds authors to add alt text: Image blocks lesson plan.

Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.