PhotoView.io
Articles & Tutorials
Photographers9 min readBy PhotoView.io

Photographers: 3 Ways to Embed a Live Gallery on WordPress

Three photographer-ready methods to embed galleries in WordPress: native Gallery block for self-hosted sets, Custom HTML for live, auto-updating...

Featured photograph for Photographers: 3 Ways to Embed a Live Gallery on WordPress

Photographers: 3 Ways to Embed a Live Gallery on WordPress

Live photo gallery displayed on website screen

The three ways to embed a gallery in WordPress are the native Gallery block, a Custom HTML embed for third-party portfolios, and the legacy [gallery] shortcode. Use the Gallery block for quick, self-hosted image sets inside a post. Use a Custom HTML embed when you want a live, auto-updating portfolio from a platform like PhotoView. Reach for the shortcode only when you’re maintaining older templates or pulling images by attachment ID.

TL;DR:

  • The WordPress native Gallery block is best for quick, self-hosted image sets on a single site, supporting custom columns, resizing, and flexible links without extra plugins.
  • Use Custom HTML embed blocks when integrating live, auto-updating portfolios from external platforms like PhotoView, which automatically reflect new images without re-publishing.
  • The legacy [gallery] shortcode is mainly useful for maintaining older templates or pulling specific images by attachment ID, but lacks visual editing and flexibility of the block editor.
  • Optimizing gallery speed involves compressing images, using descriptive ALT texts, relying on native lazy loading, and selecting appropriate image sizes for mobile responsiveness.
  • Native Gallery blocks generally outperform third-party embeds in SEO and load speed, though embeds offer a “set-and-forget” workflow for frequently updated portfolios.

Table of Contents

How to Add a Gallery Block in WordPress

The Gallery block is built into every modern WordPress editor, and it’s the fastest way to display photos hosted on your own site. You don’t need a plugin, and you don’t need to touch code.

Here’s the process from an empty post to a published gallery:

  1. Open the post or page editor, click the block inserter (the plus icon), and search for “Gallery.” You can also type /gallery directly in the editor to pull it up instantly, according to WFU’s WordPress documentation.
  2. Upload new images or select existing ones from your Media Library, then click “Create gallery.”
  3. Reorder images by dragging thumbnails, and set your column count in the block settings panel on the right.
  4. Choose a link destination for each image: media file (opens the full-size photo), attachment page (opens WordPress’s built-in image page), or none.
  5. Add ALT text and captions to each image before publishing.
  6. Click “Publish” or “Update.” To edit later, click into the gallery and adjust settings the same way.

The Gallery block’s official documentation confirms it supports custom column counts, image resizing, and flexible link destinations directly in the settings panel, no extra plugin required.

Behind the scenes, the block saves as static HTML with <figure> and <img> tags for each photo. The core block reference documents this markup structure if you ever need to inspect or customize it with custom CSS.

How Do You Embed a Third-Party Gallery With Custom HTML?

If your photos live on an outside platform, a photography portfolio site, a proofing tool, a presentation dashboard, you don’t use the Gallery block at all. You use the Custom HTML block instead.

Most presentation platforms give you an embed code, typically an iframe or a short script snippet, from a “share” or “embed” menu in their dashboard. Copy that code, then follow these steps:

  • Open your WordPress page and insert a Custom HTML block (not Gallery).
  • Paste the embed code directly into the block, exactly as provided.
  • Preview the page to confirm the gallery renders and resizes properly.
  • Check whether the platform offers auto-resizing iframes; if not, you may need to set a fixed height manually.

This is the correct block for the job. According to Harvard’s WordPress documentation, third-party embed code belongs in a Custom HTML block, and mixing it into the Gallery block can break responsive behavior entirely.

A few practical embeds—including those from platforms like Fotify—support auto-resize and live updates, meaning new photos you add on the source platform appear on your WordPress page without republishing anything.

Pro Tip: Always test an embed on mobile before sharing the page link. An iframe that looks perfect on a desktop monitor can crop badly on a phone if the source platform doesn’t handle responsive scaling.

Watch for mixed content warnings if your site runs HTTPS but the embed code points to an HTTP source, and avoid stacking multiple heavy third-party scripts on one page, since each one adds load time.

What Is the [gallery] Shortcode and When Should You Use It?

The [gallery] shortcode predates the block editor, and while it’s no longer the default method, it still works in classic themes, custom templates, and some page builders.

Basic syntax looks like this: [gallery ids="123,124,125"], where the numbers are Media Library attachment IDs.

  • The include attribute lets you display specific images by ID, even ones not attached to the current post, according to the WordPress Codex.
  • This makes it useful for pulling a consistent set of images across multiple posts or pages.
  • Its main limitation: no visual drag-and-drop reordering, no live settings panel, and no attachment-page linking options as flexible as the block editor offers.

If you’re not managing a legacy theme, the Gallery block will almost always be the more practical choice.

How Do You Optimize a Gallery for Speed and SEO?

A gallery that loads slowly loses visitors before they see a single photo. Small adjustments make a real difference in both load time and search visibility.

  1. Pick a column count (3 or 4 works well for most themes) and avoid uploading images larger than your display size actually needs.
  2. Write descriptive ALT text for every image, not just “photo1.jpg,” since ALT text feeds both accessibility tools and image search results.
  3. Compress images before upload using a tool like TinyPNG or your editing software’s export settings.
  4. Rely on native lazy loading, which WordPress applies automatically to images below the fold, so photos load only as visitors scroll to them.
  5. Use responsive image sizes (srcset) so mobile visitors download smaller files than desktop visitors.

Page speed carries real weight in Google’s ranking signals, so a gallery-heavy page is exactly where compression and lazy loading pay off. After publishing, run a quick mobile check and a Lighthouse score to catch any image that slipped through uncompressed.

Gallery Block or Third-Party Embed: Which Should You Choose?

The honest answer depends on what the gallery is for, not which method is technically “better.”

Native Gallery blocks give you tighter SEO control and faster load times, since everything is hosted on your own server with no external requests. Third-party embeds trade a little of that control for a real workflow advantage: update your photos once on the source platform, and every page embedding that gallery updates automatically.

  • Use the Gallery block for article-focused posts, blog content, and one-off image sets tied to a single piece of writing.
  • Use a Custom HTML embed for portfolio landing pages, ongoing client galleries, or any collection you update often.
  • Experts generally agree that native blocks win on speed and SEO, while embeds win on a “set-and-forget” workflow.

This is exactly the gap PhotoView is built to close. Photographers publish directly from Lightroom, choose from responsive templates, and keep a live embed on their WordPress site synced automatically, no republishing, no re-uploading. For a deeper look at the tradeoffs, see this comparison of gallery platforms.

Pro Tip: Before sending a client link, open the embedded gallery in a private browser window. It’s the fastest way to catch a privacy setting you forgot to update.

A Practical Workflow for Embedding Galleries

My workflow for any gallery, client-facing or editorial, follows the same four steps: curate the images down to the strongest set, optimize file sizes and ALT text, choose the embed method that matches the page’s purpose, then test the live result before sharing.

Before publishing, run through this: ALT text on every image, a mobile preview check, and a confirmed privacy setting if the gallery involves client work. Skipping any one of these is how broken embeds and public-when-they-shouldn’t-be galleries happen. For a full walkthrough of embedding a live portfolio into an existing site, this step-by-step embed guide covers the process in more detail.

— Mitch Russo

Keep Your Portfolio Live Without Touching Your Site Again

PhotoView is the alternative to manual gallery updates for photographers running a WordPress site. Instead of re-uploading images every time a shoot wraps, you publish once from Lightroom, and your embedded portfolio updates itself.

PhotoView

The platform’s embed feature places a responsive, template-styled gallery directly on your existing WordPress pages, so your site keeps its own domain and design while the gallery content stays managed from one dashboard. Choose from mobile-ready templates, mix photos and video in one portfolio, and set private sharing for client work without building separate password-protected pages by hand. If you’re weighing a site-hosted proofing gallery against an external portfolio, this comparison breaks down which setup fits your kind of work.

Ready to see it live on your own site? Embed a photography portfolio on your existing website and get your first gallery synced today.

Sources

For hands-on reference, bookmark the Gallery block documentation, the core block reference, and the Custom HTML block guide for embed troubleshooting.

FAQ

How Do I Insert a Gallery in WordPress?

Open the block inserter, search “Gallery,” then upload or select images from your Media Library and click “Create gallery.” No plugin is required for basic use.

What Is the Best Gallery Plugin for WordPress?

WordPress’s native Gallery block handles most self-hosted needs without a plugin at all. For a managed, embeddable portfolio with templates and Lightroom publishing, a platform like PhotoView covers what plugins like Envira or NextGEN aim for, without the plugin maintenance.

How Do I Embed a Slideshow in WordPress?

Copy the slideshow’s embed code from your presentation platform, insert a Custom HTML block on your page, and paste the code in directly rather than using the Gallery block.

How Do I Embed a Picture?

For a single self-hosted image, use the Image block and upload directly. For a picture hosted elsewhere, paste its embed code or direct URL into a Custom HTML block.

Recommended