I had a few clients who needed to launch some pop up lightbox content from a link on the site. In this case it was a menu item. I was using a child theme of Enfold in both cases, which I know already has Magnific Pop up in it so I wanted to simply leverage that. Here’s how it went. If you don’t have Enfold as your theme, you can get magnific (or another lightbox system) and do a similar thing.

This is one of the sites: bluboxrooms.com. Notice the Contact link in the menu, it launches a popup lightbox with their MailChimp signup in it.

In the functions.php file, put some code to tell the site to use the rel tag to activate the magnific (the first snippet) and then write a function to create the content that will pop up.

//Pop up handler
add_action('wp_head','enfold_customization_add_magnific_handler');
function enfold_customization_add_magnific_handler() {
	?>
	<script type="text/javascript">
	jQuery(document).ready(function() {
	    jQuery('a[rel=magnific]').magnificPopup({
	        type:'inline',
	        preloader:false,
	    });
	});
	</script>
	<?php
}

function add_popup_content(){ ?>
     <div id="popup" class="white-popup mfp-hide lightbox-added">
          <!-- HTML of Pop up Here --!>
     </div>
<?php }
add_action('ava_after_main_menu', 'add_popup_content');

Inside the #popup div, I pasted the HTML of the MailChimp embed code, which I tweaked and styled to suit the site. On another site, that was simply an image with a link to one of their other pages (where they were doing a giveaway/signup). You could also show an iframe in the pop up of course. In the case of Enfold+Magnific, it’s important to have the classes on the #popup div to work properly and that’d be true of prettyPhoto or another lightbox too.