How do I make a lightbox pop up when button is pressed?

I’d like to use the newer button element, because of its in-depth customization, to open up a video in a lightbox. I’d like to use the newer button because I do not know how to code very well at all and the front end customization for this element in cornerstone helps me out quite a bit.

Hi There,

You need to :

Add a class to your button, the class can be added on the customize tab of the button, you will add for example: light-btn

You will link this button to the content you want to be open on the lightbox.

You will add then a classic raw content element (which will be invisible on the front end) anywhere on your page and will add the ligthbox selector: [lightbox selector=".light-btn"]

Hope it helps!

Hi Joao, thank you for the reply. I was able to get the lightbox to appear, but there is no content inside even though I have linked to the video through the button.

Let me attach some screenshots

Hey There,

Would you mind providing us with login credentials so we can take a closer look? Please provide following information:

Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password
  • Page where you have applied.

All the best!

Put the secure note above

Hi there,

Please try to use the embed URL instead:

https://player.vimeo.com/video/180345455

Hope this helps.

Great it works! Thank you! Can you tell me how to remove the white container around the player, so it’s just the vimeo player that pops up? Also, can you tell me how to make the “close” button bigger?

Hi there,

Please add this code in the custom CSS:

.ilightbox-holder.light,
.ilightbox-overlay.light {
    border: 0;
    background: transparent;
}

.ilightbox-toolbar.light a.ilightbox-close:before {
    font-size: 25px;
}

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.