# Image Gallery (grid, not carousel)

**URL:** <https://community.glideapps.com/t/image-gallery-grid-not-carousel/70682>\
**Category:** Ask for Help\
**Created:** [February 10, 2024, 8:57am UTC](https://community.glideapps.com/t/image-gallery-grid-not-carousel/70682 "2024-02-10T08:57:36Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Danny\_Nielsen](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/danny_nielsen/32/61765_2.png) [@Danny\_Nielsen](https://community.glideapps.com/u/Danny_Nielsen)\
**Post date:** [February 10, 2024, 8:57am UTC](https://community.glideapps.com/t/image-gallery-grid-not-carousel/70682/1 "2024-02-10T08:57:36Z")

</div>

Hi

Is there a “image grid” function in Glide. I got images stores in array (multible images)

Like this 🙂

 ![](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/1/a/1a56b1f46a85fd98edb94034aba6d5e3cf9bddf9.png)

---

<div class="post-metadata">

**Author:** ![Robert\_Petitto](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/robert_petitto/32/25193_2.png) [@Robert\_Petitto](https://community.glideapps.com/u/Robert_Petitto)\
**Post date:** [February 10, 2024, 4:05pm UTC](https://community.glideapps.com/t/image-gallery-grid-not-carousel/70682/2 "2024-02-10T16:05:04Z")

</div>

So you want a mosaic/masonry view of a list of images? Glide doesn’t have anything native like this. Since you can’t run js on the front end, the best you can do is something with HTML and CSS. Here’s one example, but as you can see, there is vertical gap between photos of different heights:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/4/d4628af89a4f9dcf361d91054c6d5cc387957cb1.jpeg)

---

<div class="post-metadata">

**Author:** ![Danny\_Nielsen](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/danny_nielsen/32/61765_2.png) [@Danny\_Nielsen](https://community.glideapps.com/u/Danny_Nielsen)\
**Post date:** [February 12, 2024, 8:49am UTC](https://community.glideapps.com/t/image-gallery-grid-not-carousel/70682/3 "2024-02-12T08:49:59Z")

</div>

Thanks. I found this solution.

> [@Image Gallery with JavaScript & CSS code](https://community.glideapps.com/t/image-gallery-with-javascript-css-code/68373):
>
> [ezgif.com-resize] Step 1 : Create Multiple Image Column Step 2 : Create Joined List Column [1701764843987] Step 3 : Create JavaScript Column let urls = p1.split(','); let pname = p2; let columns = [[], [], [], [], []]; urls.forEach((url, index) =\> { let columnIndex = index % 5; columns[columnIndex].push(url); }); let galleryHTML = '\<div class="gallery"\>'; columns.forEach((column) =\> { galleryHTML += '\<div class="gallery\_\_column…

Works.

My issue now is, that I wish to store images in Google Drive. But file-links (web-view-link) from GD dont play well with this setup. Guess ill find other database/storage.
