Skip Navigation

[Resolved] Set up a custom Gallery for Custom Post Type

This support ticket is created 2 years, 11 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

This topic contains 2 replies, has 2 voices.

Last updated by christophS-4 2 years, 10 months ago.

Author
Posts
#2280167

Tell us what you are trying to do?
I want to make a custom gallery like on airbnb.
x number of images are visible and the others opening in lightbox.

Is there a similar example that we can see?

hidden link

#2280453

Nigel
Supporter

Languages: English (English ) Spanish (Español )

Timezone: Europe/London (GMT+00:00)

This is an example of a gallery where you have multiple images coming from a single post, yes?

The available options for the ready-made gallery layouts can be found in the Gallery block (grid, masonry, collage).

There isn't the option to show only some of the images in the gallery, and include all the rest in the lightbox.

Views let's you generate HTML markup with dynamic content, so it would be possible to create such a gallery, but it is something you'll need to design yourself. You'll need to decide on a lightbox solution. You could enqueue the lightbox files which Toolset Blocks uses, which are located at vendor/toolset/public/blocks/vendor/lightbox/. For implementation details see hidden link.

Whichever solution you use, try creating a mockup with static markup (using something like Codepen), and once you have it working how you need, identify the repeating and dynamic parts of the HTML, which you can generate with shortcodes.

In particular, note how you can use the wpv-for-each shortcode to loop over repeating custom fields (i.e. your image field which accepts multiple values).

https://toolset.com/documentation/programmer-reference/views/views-shortcodes/#wpv-for-each

If you are not very strong working directly with HTML you may need to recruit a developer to help.

#2286511

My issue is resolved now. Thank you!