# Pro Gallery - Categories/Filters?

**URL:** <https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866>\
**Category:** Ask the community\
**Created:** [October 29, 2021, 6:41pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866 "2021-10-29T18:41:23Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![evantaylorstudios](https://avatars.discourse-cdn.com/v4/letter/e/6bbea6/32.png) [@evantaylorstudios](https://forum.wixstudio.com/u/evantaylorstudios)\
**Post date:** [October 29, 2021, 6:41pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/1 "2021-10-29T18:41:23Z")

</div>

Hi all!

I’m a Photographer and I want to have a Gallery where visiting users can click separate categories/filters on the left hand side. (See below for Example)

[https://static.wixstatic.com/media/a27d24\_f87695ed1a72490ba7d3ddd7aebc9ace~mv2.png(image larger than 4 MB)](https://static.wixstatic.com/media/a27d24_f87695ed1a72490ba7d3ddd7aebc9ace~mv2.png)

When they click a category, a new gallery appears with images specific to that category.

What is the easiest way of doing this without sending them to a completely separate page? I’d like to keep it all on one “page”.

I can only seem to figure out how to get one gallery at a time.

Thank you!

---

<div class="post-metadata">

**Author:** ![jim75924](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/jim75924/32/17468_2.png) [@jim75924](https://forum.wixstudio.com/u/jim75924)\
**Post date:** [October 29, 2021, 9:05pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/2 "2021-10-29T21:05:15Z")

</div>

I suspect that there’s someone here who can suggest an elegant solution. FWIW, I can suggest a crude solution that makes sense only if the number of categories is rather small.

That solution would involve creating one pre-defined gallery for each category and setting it as ‘collapsed’ (except, perhaps, for one gallery that would be the default, visible gallery when the page is loaded).

Then turn each category into a button that would run some Velo code to (1) expand the gallery for that category and (2) collapse any other expanded galleries.

---

<div class="post-metadata">

**Author:** ![idoh](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/idoh/32/24194_2.png) [@idoh](https://forum.wixstudio.com/u/idoh)\
**Post date:** [October 29, 2021, 9:59pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/3 "2021-10-29T21:59:55Z")

</div>

Hi @evantaylorstudios ,

So here is the solution I found for filtering a pro gallery, I made a video that explains it, basically you are using the content manager to populate your gallery and using a dataset to filter it, its in this video here:

[https://www.screencast.com/t/q3UUW0Fx](https://www.screencast.com/t/q3UUW0Fx)

Here is the code:

```javascript

import wixData from 'wix-data';

$w.onReady(function () {

    $w('#dataset1').onReady(() => {
        $w('#button1').onClick((event) => {
            let filter = event.target.label;

            if (filter === 'All') {
                $w('#dataset1').setFilter(wixData.filter())
            } else {
                $w('#dataset1').setFilter(wixData.filter()
                    .eq('category', filter)
                )
            }

        })
    })

});

```

hope this is useful to you!

---

<div class="post-metadata">

**Author:** ![jim75924](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/jim75924/32/17468_2.png) [@jim75924](https://forum.wixstudio.com/u/jim75924)\
**Post date:** [October 29, 2021, 11:09pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/4 "2021-10-29T23:09:11Z")

</div>

Hi, @idoh . What a terrific, clear video.

I’m not the OP, but your video helps me with something I’m working on, too. Thanks so much!

---

<div class="post-metadata">

**Author:** ![evantaylorstudios](https://avatars.discourse-cdn.com/v4/letter/e/6bbea6/32.png) [@evantaylorstudios](https://forum.wixstudio.com/u/evantaylorstudios)\
**Post date:** [November 2, 2021, 9:59pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/5 "2021-11-02T21:59:33Z")

</div>

@idoh - Thank you for the detailed video. Running through it now!

---

<div class="post-metadata">

**Author:** ![flood-jesse](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/flood-jesse/32/33145_2.png) [@flood-jesse](https://forum.wixstudio.com/u/flood-jesse)\
**Post date:** [April 21, 2022, 6:48pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/6 "2022-04-21T18:48:47Z")

</div>

@idoh i’m trying to create the same filtered interface as is detailed above. Is there a way now to achieve this without code, or is it still a custom code process? Unfortunately the link to that screencast is now broken.

Any help much appreciated. Thanks.

---

<div class="post-metadata">

**Author:** ![Rob](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/rob/32/84134_2.png) [@Rob](https://forum.wixstudio.com/u/Rob)\
**Post date:** [April 22, 2022, 4:01pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/7 "2022-04-22T16:01:23Z")

</div>

@flood-jesse So currently this exact setup with text/buttons filtering the gallery, would require the use of code.

If you’re not well-versed in code, you can use dropdowns to filter by user-input. [https://support.wix.com/en/article/filtering-content-based-on-user-selection](https://support.wix.com/en/article/filtering-content-based-on-user-selection)  
There’s a feature request for more options from more user-input elements like selections tags that were probably used in the example. [https://support.wix.com/en/article/request-filtering-collection-content-from-a-selection-of-user-input-elements](https://support.wix.com/en/article/request-filtering-collection-content-from-a-selection-of-user-input-elements)

[There is an option to make sub-galleries for a gallery too](https://support.wix.com/en/article/wix-pro-gallery-creating-sub-galleries) .

---

<div class="post-metadata">

**Author:** ![deeperjk0901](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/deeperjk0901/32/36402_2.png) [@deeperjk0901](https://forum.wixstudio.com/u/deeperjk0901)\
**Post date:** [February 2, 2023, 2:14am UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/8 "2023-02-02T02:14:28Z")

</div>

Hi could you reupload the video? The link is broken. Thank you!

---

<div class="post-metadata">

**Author:** ![evesilberx](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/evesilberx/32/34338_2.png) [@evesilberx](https://forum.wixstudio.com/u/evesilberx)\
**Post date:** [February 6, 2023, 2:02pm UTC](https://forum.wixstudio.com/t/pro-gallery-categories-filters/47866/9 "2023-02-06T14:02:21Z")

</div>

Hi @deeperjk0901 , I tried to create a video for you showing how to filter a Pro Gallery. I hope this is of help: [https://www.screencast.com/t/roAyz8xnHO](https://www.screencast.com/t/roAyz8xnHO)

Here is the code I used:

import wixData from ‘wix-data’ ;

$w . onReady ( function () {

```
$w ( '#dataset1' ). onReady (() => { 
    $w ( '#dropdown1' ). onChange (( event ) => { 
        let category = event . target . value ; 

        $w ( '#dataset1' ). setFilter ( wixData . filter () 
            . eq ( "category" , category ) 
        ) 
    }) 
}) 

```

});
