Ajax Modal
CMS
Javascript
GSAP

Add to before </body> tag in page or project settings

copy

Apply the required attributes

This lightbox div contains the close link and modal div

Set to display none, position fixed, and 100vh height, 100% width, and a high z-index

tr-ajaxmodal-element = lightbox

Clicking this close link block will exit the lightbox

Should be inside lightbox and above modal

tr-ajaxmodal-element = lightbox-close

This empty modal div will get the cms page content

Apply a width & height. Set to overflow auto. Don't place anything inside this.

tr-ajaxmodal-element = lightbox-modal

Clicking on this cms link will open the lightbox

Should be linked to a collection page

tr-ajaxmodal-element = cms-link

This collection page div will be copied into the modal

Can't be a direct child of the body

tr-ajaxmodal-element = cms-page-content

copy
copy
copy
copy
copy
copy