Light box pop up for image on landing page

[KristieSan]

Hi there i would like to add a lightbox pop up to an image I have on a landing page - basically a click to zoom funtion. Does anyone know of the best way to do this?

Kristie 

[Stephanie-OG]

As ProGrahamer suggested, a custom module is a good way to go if you're comfortable coding it from scratch. 

Otherwise you can always check out the Marketplace for pre-built templates and modules.

---

Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

If this helped, please mark it as the solution to your question, thanks!

[ProGrahamer]

Hello Kristie.
I suggest creating a module. That way you can reuse the following idea (javascript/css/html) in several different places. There's more on creating modules in HubSpot's academy, but here is a link to how to create said "lightbox" from freecodecamp.org:

https://guide.freecodecamp.org/javascript/tutorials/how-to-create-a-lightbox/

In the module, you'd put the html in the html, the css in the css, and the javascript in the javascript. I then recommend replacing the 'src=' value with a HubL snippet (also, more info on that in the academy).

If you can't get that to work, let me know and I will write it for you.