The Featured Item layout pairs one large hero image with a compact grid of supporting items, the composition familiar from property listings and product pages. When a Gallery holds more images than fit in the composition, a button appears that opens the full set in an overlay.
Location Gallery Settings → Layout → Layout Type → Featured Item
How it works #
Featured Item shows one large image beside a small grid of the next few items. The large image is the Gallery’s featured image when one is set, or the first item otherwise. The grid then fills with the following items in order, skipping the featured one so it is not repeated.
Every part of the composition — the hero and each grid tile — behaves like a normal item. Clicking a tile runs that item’s own action, such as opening the Lightbox or following its link. The grid tiles are not navigation: clicking one does not swap the hero image. There are no arrows, dots, or pager.
When the Gallery holds more images than the hero and grid show inline, a **Show all** button appears over the composition. Clicking it opens an overlay that lists every image in the Gallery, so visitors can browse the whole set even though only a handful are shown on the page. The button appears only when there are extra images to reveal; if everything already fits inline, it stays hidden.
Featured Item is available for Galleries only, not Albums.
When to use it #
Featured Item is built for a hero-plus-supporting-set composition: a property listing with a main shot and a grid of rooms, a product with a primary photo and detail views, a portfolio piece with a cover image and a taste of the rest. It is the layout to choose when one image should lead and the others should support it.
Layout settings #
Featured Image Side
Which side the large image sits on; the grid fills the other half.
| Setting | Featured Image Side |
| Options | Left Right |
| Default | Left |
Grid Items
How many items the grid shows beside the featured image.
| Setting | Grid Items |
| Options | 4 6 9 |
| Default | 6 |
The count sets the grid’s shape: 4 makes a 2×2 grid, 6 makes a 3×2 grid, and 9 makes a 3×3 grid.
Item Aspect Ratio, Item Fit, and Item Spacing
Featured Item uses the same shape and spacing controls as the Grid: Item Aspect Ratio (default 4:3), Item Fit (default Cover, shown when a ratio is chosen), and Item Spacing (default 10 / 8 / 5 px across devices).
Show All button settings #
The Show all button has its own settings, split into a General subtab and a Styling subtab.
General
Button Label
| Setting | Button Label |
| Default | Show all images |
Button Position
Which corner of the composition the button sits in.
| Setting | Button Position |
| Options | Top Left Top Right Bottom Left Bottom Right |
| Default | Bottom Right |
Edge Offset
How far the button sits in from the edges of the composition.
| Setting | Edge Offset |
| Range | 0–48 |
| Units | px |
| Default | 12 |
Styling
The Styling subtab covers the button’s typography, shape, and colours.
Typography is set with Font Family, Font Weight, and a responsive Font Size. Shape is set with Border Radius and Border Width:
| Setting | Border Radius |
| Range | 0–40 |
| Units | px |
| Default | 4 |
| Setting | Border Width |
| Range | 0–10 |
| Units | px |
| Default | 0 |
Padding is a responsive, four-sided control for the space inside the button.
Button States
Colours are set for two states. **Regular** is the resting button and **Mouseover** is how it looks under the cursor. Each state has Background Color, Text Color, and Border Color.
| Setting | Regular — Background / Text / Border |
| Default | White at 80% opacity Black text Transparent border |
| Setting | Mouseover — Background / Text / Border |
| Default | Solid white Black text White border |
How this layout affects other settings #
Featured Item is a fixed composition rather than a browseable grid, so a couple of settings do not apply and are hidden when it is selected:
- Pagination — the layout shows a set composition with the Show all overlay handling the rest, so there is no pager and the Pagination settings are hidden.
- Filtering — a filter bar over a hero-and-grid composition has nothing to narrow, so Filtering is hidden.
Both are also enforced when the Gallery renders, so they never appear on the page. Sorting stays available and matters here, since it sets the order the grid tiles follow after the featured image. The Lightbox, Captions, item styling, and Hover Effects all apply to the hero and tiles as normal.
No matter how few items show inline, opening the Lightbox from the hero or any tile lets visitors step through every image in the Gallery, not just the ones in the composition.
Tips and recommendations #
Set a featured image on the Gallery to choose the hero deliberately. Without one, Featured Item uses the first item, which may not be the shot you want leading the composition.
The Grid Items count changes both how much of the set shows inline and when the Show all button appears. With 6 grid items, the button shows once the Gallery passes seven images; with 4 or 9, it shifts accordingly. Pick the count that frames your hero well, and let the Show all overlay carry the rest.
Style the Show all button to sit comfortably on your images. The default semi-transparent white reads well over most photos, but if your hero images are light, raise the contrast through the Mouseover state or a solid background so the button stays legible.
