My go-to plugin for lightboxes and popups is usually ARI Fancy Lightbox.
But there could be times when you want more control like wanting to show some content when a button in the homepage hero section is clicked in a popup. Having the plugin load its assets on all the pages throughout the site will then be an overkill.
Magnific Popup is a jQuery script for showing content (single image/gallery, iframe, inline content, other pages in the same site etc.) in a popup.
In this members-only tutorial, I am going to share a few different ways in which Magnific Popup can be used in Oxygen.
The following implementations are covered:
Displaying
page content in a popup
a single image in a popup
a single image in a popup with zoom-out animation
a YouTube or Vimeo video in a popup
a single image with controls to see more (gallery) in a popup
inline content in a popup. Ex. Ninja Forms form
Displaying page content in a popup
Let's say you have a LEARN MORE button in a hero section on your site's front page.
And you would like to display the content of a Page that you visually designed in Oxygen when that button is clicked.
Note: Instead of the above full js file, you may want to use the build tool on Magnific Popup's site to select only the kind of content you want to show in the popup and get smaller js file.
In this example, it would be Ajax.
Step 2
Edit plugin.php and replace the code inside sk_enqueue_files() with