# AI Custom - Picture Search Engine with Dynamic Grid Gallery

**URL:** <https://community.glideapps.com/t/ai-custom-picture-search-engine-with-dynamic-grid-gallery/75876>\
**Category:** Project Showcase\
**Created:** [August 26, 2024, 12:27am UTC](https://community.glideapps.com/t/ai-custom-picture-search-engine-with-dynamic-grid-gallery/75876 "2024-08-26T00:27:46Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Marc-Olivier](https://avatars.discourse-cdn.com/v4/letter/m/ac91a4/32.png) [@Marc-Olivier](https://community.glideapps.com/u/Marc-Olivier)\
**Post date:** [August 26, 2024, 12:27am UTC](https://community.glideapps.com/t/ai-custom-picture-search-engine-with-dynamic-grid-gallery/75876/1 "2024-08-26T00:27:46Z")

</div>

Hey Everyone! 🎉

I just wanted to share my ongoing experience with testing custom components. So far, only the AI component is fully functional, so I decided to try and create a picture search engine using the free API from [Pixabay](https://pixabay.com). Check out the result here: [https://aicustom-gallery.glide.page/](https://aicustom-gallery.glide.page/).

The app is simple to use: based on your input, the search engine retrieves images, and the AI component displays a dynamic grid gallery that you can fully customize. You can, for instance, align the grid with up to 11 columns, using a slider above the gallery that’s connected to the data editor.

You can also tweak the search engine’s settings, such as picture orientation, color preferences, and images per page, etc …

### **Key Takeaways:**

- You don’t always get the same result from the same query.
- It’s better to split your requests into smaller parts.
- Learning Tailwind CSS classes is crucial, just like CSS.
- Always ensure the component stretches across the entire width of its container.
- The console is your friend! Use it to check code, especially for Tailwind classes.
- Use the word “reset” to clear all data.
- Sometimes, it’s necessary to use a private browsing window (navigation privée).
- JSON is by far the best way to bind columns to the component.

It’s been a fun journey! You can download (free) the template for both the starting point and the final version directly from the app.  
Marco

 ![screenK 2024-08-26 à 02.26.33](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/5/6/5606d3f7c5158b517b3f3ae9ecbed83984ad65eb.jpeg)  
 ![screenK 2024-08-26 à 02.26.50](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/5/f5280e02b505506d2b6d9702f8faf60054330ef3.jpeg)  
 ![screenK 2024-08-26 à 02.26.41](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/8/a/8a8122f2f382126f48174fabb626445b206ec677.jpeg)

---

<div class="post-metadata">

**Author:** ![Mark\_Turrell](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/mark_turrell/32/26605_2.png) [@Mark\_Turrell](https://community.glideapps.com/u/Mark_Turrell)\
**Post date:** [August 26, 2024, 8:51pm UTC](https://community.glideapps.com/t/ai-custom-picture-search-engine-with-dynamic-grid-gallery/75876/2 "2024-08-26T20:51:04Z")

</div>

Fabulous - lots of fun, and great demonstration of what can be done with the new tools - congrats!