This is a desktop-only theme component that adds the ability to open iframes in lighboxes
https://github.com/hnb-ku/discourse-iframe-lightboxes
This component adds an “expand” button on top of iframes you enable it on:
Clicking the button will open the iframe in fullscreen in a lightbox:
Clicking either the dark area around the iframe or the x at the top right corner closes the lightbox. The same way it works for default image lightboxes.
Settings
You target the iframes based on their origin domains in the component’s settings:
Whatever domains you specify here also need to be whitelisted in the
allowed_iframes
setting to show up in posts in the first place.
Usage examples:
Here’s a couple of examples besides the CodePen iframe above
Google forms iframe:
Embedding the entire weather.gov website:
How do I install this?
You install this component just like any other theme. Follow the instructions in the official guide:
Once you’re done, simply add the component to your current theme. Done!
Credit:
This component uses Noël Bossart’s fantastic Featherlight library (MIT license - 3kb gzip)