# Custom Component (AI Generated) - Feedback wanted! 💡

**URL:** <https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533>\
**Category:** Archived Announcements\
**Tags:** ai, layout, components\
**Created:** [July 2, 2024, 1:49am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533 "2024-07-02T01:49:43Z")\
**Posts on this page:** 20\
**Page:** 3

<div class="post-metadata">

**Author:** ![kabookie](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kabookie/32/10994_2.png) [@kabookie](https://community.glideapps.com/u/kabookie)\
**Post date:** [July 6, 2024, 4:20pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/42 "2024-07-06T16:20:21Z")

</div>

I used Elfsight for a while, but left due to the inability to insert a variable in Glide to modify the results. This may send me back for a second look.

---

<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:** [July 6, 2024, 9:16pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/43 "2024-07-06T21:16:02Z")

</div>

Was just about to post about Elfsight! Ya—works quite well.

---

<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:** [July 7, 2024, 12:13am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/44 "2024-07-07T00:13:41Z")

</div>

CLICKABLE status progressions!  
 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/0/2/028b5bf369e38713bd5daf5d5bc684c9edbddb5e.png)

https://www.loom.com/embed/d26336f77d28438fa05931201e1844b8

```auto
Create a responsive horizontal status progression bar that displays the labels.

Highlight the statuses prior to the Order. Connect all circles with a horizontal line in the background. Font size: 8px.
Labels and statuses include:
1 (New Inquiry)
2 (Call Booked)
3 (Wants Bid)
4 (Has Bid)
5 (Sold)

Each circle should be clickable. No hover or onclick styling.

Trigger the action that corresponds to the Order number value. Prevent any numbers greater than the Order from being clicked.

```

---

<div class="post-metadata">

**Author:** ![Rares](https://avatars.discourse-cdn.com/v4/letter/r/8e7dd6/32.png) [@Rares](https://community.glideapps.com/u/Rares)\
**Post date:** [July 7, 2024, 12:07pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/45 "2024-07-07T12:07:19Z")

</div>

Super awesome! I am dreaming of an ai tool to support creating complex tasks, formulas and design, too

---

<div class="post-metadata">

**Author:** ![Luca\_Dipa](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/luca_dipa/32/67530_2.png) [@Luca\_Dipa](https://community.glideapps.com/u/Luca_Dipa)\
**Post date:** [July 8, 2024, 10:40am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/46 "2024-07-08T10:40:09Z")

</div>

With Generator HTML, how can I link the actions to buttons for example? Is there a class that I have to add?

---

<div class="post-metadata">

**Author:** ![kabookie](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kabookie/32/10994_2.png) [@kabookie](https://community.glideapps.com/u/kabookie)\
**Post date:** [July 8, 2024, 4:05pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/47 "2024-07-08T16:05:26Z")

</div>

Has anyone been able to ask it to display a photo? Was hoping to find a clickable gallery solution but I can’t get an image displayed with a prompt, even if the image column is pointed to.

Also trying to create the elusive floating button with a prompt - haven’t given up on that one yet.

---

<div class="post-metadata">

**Author:** ![Vitor\_Guimaraes](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/vitor_guimaraes/32/39703_2.png) [@Vitor\_Guimaraes](https://community.glideapps.com/u/Vitor_Guimaraes)\
**Post date:** [July 8, 2024, 5:27pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/48 "2024-07-08T17:27:47Z")

</div>

This is just amazing!

Is it consuming the update quotas or is it free for experimenting?

---

<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:** [July 8, 2024, 5:41pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/49 "2024-07-08T17:41:05Z")

</div>

> [@Vitor\_Guimaraes](#):
>
> free for experimenting

Free to experiment!

---

<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:** [July 8, 2024, 5:41pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/50 "2024-07-08T17:41:38Z")

</div>

It doesn’t work with computed columns yet

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [July 8, 2024, 11:34pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/51 "2024-07-08T23:34:27Z")

</div>

> [@kabookie](#):
>
> Has anyone been able to ask it to display a photo? Was hoping to find a clickable gallery solution but I can’t get an image displayed with a prompt, even if the image column is pointed to.

Can you describe more on this? So you have a list of photos and want it to be able to display a clickable gallery?

> [@kabookie](#):
>
> Also trying to create the elusive floating button with a prompt - haven’t given up on that one yet.

Can you define “elusive” here with an example?

---

<div class="post-metadata">

**Author:** ![kabookie](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kabookie/32/10994_2.png) [@kabookie](https://community.glideapps.com/u/kabookie)\
**Post date:** [July 9, 2024, 12:50am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/52 "2024-07-09T00:50:04Z")

</div>

I know we can make a gallery, but with the current version of Glide, you can’t select a photo to view it larger (like opening the url). This means photos with text (like a menu) cannot be viewed in a gallery on mobile in any useful way. Hoping that this fix is in the pipeline as we were able to do this with the old Glide and I do know it is possible to generate a url for each image in the gallery - the data is there, but the functionality is out of reach. So I was hoping that maybe this new AI prompt would find a way to make it work.

---

<div class="post-metadata">

**Author:** ![david](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/david/32/62831_2.png) [@david](https://community.glideapps.com/u/david)\
**Post date:** [July 9, 2024, 1:26am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/53 "2024-07-09T01:26:25Z")

</div>

The HTML mode uses [Alpine.js](https://alpinejs.dev/) – check it out for details.

Use `@click` to connect a click to an action in Glide

 ![CleanShot 2024-07-08 at 18.26.09@2x](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/8/d/8d2a49c1574023bea40b9b0f77d11d067e480d6f.jpeg)

---

<div class="post-metadata">

**Author:** ![tj\_talusan](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/tj_talusan/32/23565_2.png) [@tj\_talusan](https://community.glideapps.com/u/tj_talusan)\
**Post date:** [July 9, 2024, 6:44am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/54 "2024-07-09T06:44:29Z")

</div>

These are random results from trial and error 🙂

---

<div class="post-metadata">

**Author:** ![Rien\_Dumore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/rien_dumore/32/79283_2.png) [@Rien\_Dumore](https://community.glideapps.com/u/Rien_Dumore)\
**Post date:** [July 9, 2024, 7:33am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/55 "2024-07-09T07:33:20Z")

</div>

This is completely bonkers, Super awesome. Thanks for this 😱 😲

---

<div class="post-metadata">

**Author:** ![doslab](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/doslab/32/76547_2.png) [@doslab](https://community.glideapps.com/u/doslab)\
**Post date:** [July 10, 2024, 8:05am UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/56 "2024-07-10T08:05:51Z")

</div>

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/f/1/f119ad5c1d69d500ca4f8b1664d50bf83b56348b.jpeg)

Is there a way to pass the “Data” to the HTML using {{curly\_brackets}} or $variables?

---

<div class="post-metadata">

**Author:** ![Simon\_Hill](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/simon_hill/32/94730_2.png) [@Simon\_Hill](https://community.glideapps.com/u/Simon_Hill)\
**Post date:** [July 10, 2024, 3:43pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/57 "2024-07-10T15:43:47Z")

</div>

Strange. I was playing around and added a banner with scrolling text. Works perfectly in the App editor. However, users report blank screens… when I deleted the component normal service was resumed, without the new feature of course…

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/6/6650c3b5c389ada434e6659ea53ef024cc368a02.jpeg)

Anything I am missing that might be causing this issue?

---

<div class="post-metadata">

**Author:** ![kabookie](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/kabookie/32/10994_2.png) [@kabookie](https://community.glideapps.com/u/kabookie)\
**Post date:** [July 10, 2024, 3:55pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/58 "2024-07-10T15:55:56Z")

</div>

Well, I hate to confirm that you are correct. I sent the link to my phone and any screen that includes this test component just displays as a black blank screen, no matter what the display settings are set at. I do get a flash of the theme color before going dark. I added a normal tab at the beginning and it works fine. Made the app public/no login so that is not it.

That is the fun of these previews - keeping us guessing

---

<div class="post-metadata">

**Author:** ![Simon\_Hill](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/simon_hill/32/94730_2.png) [@Simon\_Hill](https://community.glideapps.com/u/Simon_Hill)\
**Post date:** [July 10, 2024, 5:38pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/59 "2024-07-10T17:38:38Z")

</div>

Did you try the new feature on a live published App? A couple of us just get white screens when included. Maybe this is just for sandpit work in the editor for now?!

---

<div class="post-metadata">

**Author:** ![Joe\_Gabriele](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/joe_gabriele/32/57595_2.png) [@Joe\_Gabriele](https://community.glideapps.com/u/Joe_Gabriele)\
**Post date:** [July 10, 2024, 5:59pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/60 "2024-07-10T17:59:50Z")

</div>

I have a custom component on a live app. Does come with a white background that I cant get rid of but does work

---

<div class="post-metadata">

**Author:** ![david](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/david/32/62831_2.png) [@david](https://community.glideapps.com/u/david)\
**Post date:** [July 10, 2024, 6:21pm UTC](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533/61 "2024-07-10T18:21:01Z")

</div>

@doslab the data names are exposed to Alpinejs. Try this:

```auto
<p x-text="Name"></p>

```

[Previous page](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533.md?page=2)

[Next page](https://community.glideapps.com/t/custom-component-ai-generated-feedback-wanted/74533.md?page=4)
