--- title: "Creating Custom Lightbox Groups" id: "196438" type: "knowledgebase" slug: "foobox-custom-lightbox-groups" published_at: "2026-07-24T09:19:36+00:00" modified_at: "2026-07-24T09:19:36+00:00" url: "https://fooplugins.com/documentation/foobox/block-editor/foobox-custom-lightbox-groups/" markdown_url: "https://fooplugins.com/documentation/foobox/block-editor/foobox-custom-lightbox-groups.md" excerpt: "The Gallery group field can combine separate triggers into one navigable FooBox collection. The triggers do not have to be inside a core Gallery block and may mix Image blocks with image-target Button blocks." taxonomy_knowledgebase_cat: - "Block Editor" --- [Block Editor](https://fooplugins.com/documentation/foobox/block-editor/) # Creating Custom Lightbox Groups ## Related Articles - [Getting Started with FooBox in the Block Editor](https://fooplugins.com/documentation/foobox/block-editor/foobox-block-editor-getting-started/) - [Creating Image Lightboxes](https://fooplugins.com/documentation/foobox/block-editor/foobox-image-lightboxes-block-editor/) - [Creating Gallery Lightboxes](https://fooplugins.com/documentation/foobox/block-editor/foobox-gallery-lightboxes-block-editor/) - [Creating Video and Iframe Lightboxes (FooBox Pro)](https://fooplugins.com/documentation/foobox/block-editor/foobox-video-iframe-lightboxes/) - [Creating Button Lightboxes](https://fooplugins.com/documentation/foobox/block-editor/foobox-button-lightboxes-block-editor/) - [Opening Hidden Block Content (FooBox Pro)](https://fooplugins.com/documentation/foobox/block-editor/foobox-hidden-block-content/) - [Using FooBox with the WordPress Core Lightbox](https://fooplugins.com/documentation/foobox/block-editor/foobox-wordpress-core-lightbox/) - [Opening Shortcodes and FooGallery in FooBox (Pro)](https://fooplugins.com/documentation/foobox/block-editor/foobox-shortcodes-foogallery/) **Need more help?** Browse all documentation or open a support ticket. [All docs](/documentation/) [Support](/support/) The **Gallery group** field can combine separate triggers into one navigable FooBox collection. The triggers do not have to be inside a core Gallery block and may mix Image blocks with image-target Button blocks. ## 1. Choose a group name Use a short, descriptive value such as `nature-collection`. The value is an identifier, not a visible title. ## 2. Apply it to every trigger For each Image or Button: 1. Select the block. 2. Open **Block → Content → FooBox**. 3. Enable FooBox. 4. Set **Gallery group** to exactly the same value. 5. Make sure the trigger has a valid media target. ![An Image block using the shared nature-collection Gallery group](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20840%20920'%3E%3C/svg%3E)The same rule applies to Gallery blocks. Set the value on the outer Gallery and FooBox mirrors it to the child images. ## 3. Mix trigger types if needed This example uses two visible Image blocks and one Button that opens a third image. All three use `nature-collection`. ![A page composed from two Image triggers and one Button trigger](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20800%20650'%3E%3C/svg%3E)Image Buttons work in FooBox Free. A mixed collection may also include Pro content handlers, but every item must be renderable by the installed edition. ## 4. Test the navigation Preview the page and open any item. FooBox should show previous/next controls and a position such as “item 1 of 3.” Navigate through every trigger to confirm that its caption and content are correct. ![FooBox navigation showing the first item in a three-item custom group](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%201440%201000'%3E%3C/svg%3E)## Grouping behavior - Modern block-editor grouping is saved as `data-foobox-group`. - `data-foobox-group` takes precedence over legacy `rel` grouping. - Identical, non-empty values join items into one collection. - A different value creates a separate collection on the same page. - A blank value leaves an item independent unless Gallery conversion generates a group. - Group names are scoped to the rendered page; use clear names to avoid accidental collisions. ## Troubleshooting - **Only one item appears:** compare the Gallery group values for capitalization, spaces, and punctuation. - **Unrelated items are included:** give the intended collection a more specific group name. - **A Button leaves the page:** enable FooBox and verify that its image target is valid. - **A core Gallery is not grouped:** configure the outer Gallery block and save so the value is mirrored to all child images. Resources ## Find the right next step Use this grid for documentation indexes, support routes, account links, affiliate resources, and download pages. ![Image](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)### Documentation Search setup guides, product docs, and troubleshooting articles. [Browse docs](/documentation/) ![Image](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)### Support Open a ticket with product details so we can help quickly. [Get support](/support/) ![Image](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%200%200'%3E%3C/svg%3E)### Licensing Review account, renewal, refund, and license information. [View details](/licensing/)