How to add tabs in Photo Gallery

Ask the Community General Questions
1

To showcase projects of different types, tabs or groups added to the Photo Gallery. Like the Team Showcase

3

Hi there, @Eddie_Thomson :waving_hand:

I am glad to say that this option is already supported in the Photo Gallery. You just need to create categories and assign them to the photos

image
image336Ă—487 25.9 KB
image
image330Ă—270 4.38 KB

image
image332Ă—441 8.7 KB


To display Categories, please enable Filters on the Layout tab:

image
image332Ă—802 12.2 KB
image
image1603Ă—519 91.7 KB


Check it out and let me know if it helped :wink:

4

Hi Max. I can’t believe I didn’t notice that before. Thank you! Just one more thing, is there a way to hide “All”?

5

Yep, we’ve got a custom solution for this!

Please add this code to the Custom CSS field on the Style tab of your widget’s settings to hide the All tab:

.eapp-photo-gallery-category-list-item:first-child {
  display: none;
}

And this script will help you open the 1st category instead of the All tab by default:

util
  .waitForElement('.eapp-photo-gallery-category-list-item:nth-child(2)')
  .then((elem) => elem.click());

This script should be added to the Custom JS field on the Style tab of your widget’s settings. Custom JS scripts don’t operate in the editor or preview mode, so you’ll see how it works after publishing the widget on your website :slightly_smiling_face: