Lightbox with Text or Webflow Buttons

I would love to be able to use the lightbox component with regular text or buttons made in webflow, especially to show videos on sites. Right now I’m guessing I will need to turn my text into images

1 Like

To do that just create a new <div></div> element and inside put all the things you want. The initial appearance to this element must be display: none; Then asign a trigger to a button or link like click or hover to open de <div></div> element you just created. Choose Affect different element and write the name of the “invisible” div. Then on first click choose Display: block; and the second click left empty. Then create a button to close the popup and asign the trigger on click: Display: none; and thats all.

6 Likes

But will there ever be away to call a Lightbox via text?

Of course, you can asign the triggers to any element: text, div, buttons, etc.

There is an easy way how to solve that:
Insert a new Element “Litebox Link” > go to Inspector and you can see clear structure here - there is the thumbnail image subordinated to “Litebox link” element. Delete the thumbnail image and insert your TextLink element instead.

@YdUX: I believe that is erroneous information. If you insert a Lightbox Link, then go to Navigator (I think that’s what you meant instead of Inspector) you do see the Image element under Lightbox Link. However, if you select Image and delete it, the entire Lightbox Link element will also be deleted. Conversely, attempting to drag a text link into the Lightbox Link before deleting the image will cause an error message saying you cannot nest a link within a link.

If I have misunderstood what you’ve outlined, please let me know.

If you insert a “text block” in the lightbox link first you can then delete or “hide” the image.

2 Likes