topic Re: How to create modal/popup for external video in CMS Development

How to create modal/popup for external video

MattOnce — Thu, 17 Sep 2020 06:22:10 GMT

I'm quite new to this platform, and I'm having trouble finding information about actually implementing a modal popup that displays an external video.

Could someone point me to a tutorial or explain what I need to do to create the popup and then trigger it when an <a> link is clicked?

Thanks

Re: How to create modal/popup for external video

Katelyn_Eklund — Thu, 17 Sep 2020 09:12:13 GMT

Hi @MattOnce ,

There is no default module currently available on the HubSpot CMS for a pop-up modal so this is something that would best be built within a custom module.

By building a custom module you will be able to specify some JavaScript that will display/hide your pop-up on a certain click.

If coding is not your thing however you could always have a look through our Asset Marketplace to see if you can purchase a ready-built module that suits your needs. Here is one option that I found on a quick search!

I hope this helps 🙂

Re: How to create modal/popup for external video

MattOnce — Thu, 17 Sep 2020 09:24:55 GMT

Thank you! I will definitely consider the ready-built module if trying my hand at a custom module doesn't go my way.

Re: How to create modal/popup for external video

jonchim — Thu, 17 Sep 2020 12:12:55 GMT

Hey @MattOnce,

This javascript plugin is fairly easy to setup and has great documentation. http://fancyapps.com/fancybox/3/

Besides videos in popups you can create gallerys, lightbox, etc. as well

It should be pretty easy to setup, my colleague recently wrote a blog post on building a custom module. https://www.moreycreative.com/blog/building-your-first-hubl-custom-module The module mentioned in the blog actually uses the plugin above.

IF you have any questions on setting it up please feel free to shoot me a message

Re: How to create modal/popup for external video

MattOnce — Thu, 17 Sep 2020 20:06:46 GMT

Thank you! I will check both of these links out, and I'm sure that between this and the above response, I'll come right.