Modal Dialog on WP Menu link

This cannot be done using the Modal Dialog configuration. Instead, you would need to write a bit of javascript code on your page to capture that event and trigger the dialog opening, something like the following code should do the trick:

<script type="text/javascript">
jQuery( "#menu-item-13874" ).click(function() {
modal_dialog_open();
});
</script>

You could put this code in your page footer template. Let me know if this works. I did not test the code on my side.

Actually, you will need to do a bit more for this to work. First, you would need to make sure that the option ‘Only show on specific pages and single post’ is unchecked. Also check ‘Display on front page’. Then, set the number of times to display to 0. This will make sure that the code for the dialog gets inserted in all pages and that the code above will trigger its action.

I added that script code to above the </body> tag in my WP Footer file, then adjusted my plugin settings to have

Display on front page: checked
Only show on specific pages and single posts: unchecked
Number of times to display / before displaying modal dialog: 0

And it didn’t work when I clicked that link in my menu. Am I missing anything?

When I “View Source” on a page that has that menu link, here is what the code looks like re: modal dialog:

<!-- Modal Dialog Output -->
<a class='inline' href='#inline_content'></a>
<div style='display:none'><div id='inline_content' style='padding:10px;color:#000000;background-color:#FFFFFF'><div id='inline_replaceable_content'>Are you sure you want to leave this page? This will take you to the website Home Page and exit the current program you are working on.</div></div></div>
<div id='md-content'>
<script type="text/javascript">
function modal_dialog_open() {
	jQuery("a.inline").trigger('click')
	cookievalue++;
	jQuery.cookie('modal-dialog', cookievalue, { expires: 365, path: '/'});
}
function set_modal_dialog_content( newContent ) {
	jQuery('#inline_replaceable_content').replaceWith( "<div id='inline_replaceable_content'>" + newContent + "</div>");
};
function set_modal_dialog_web_site_address( newAddress ) {
	jQuery('a.iframe').attr( 'href', newAddress );
};
function modal_dialog_close() {
	jQuery.colorbox.close();
}

var cookievalue = jQuery.cookie('modal-dialog');
if (cookievalue == null) cookievalue = 0;
jQuery(document).ready(function() {
	jQuery("a.inline").colorbox({
		inline: true,
		returnFocus: false,
		overlayClose: false,
		closeButton: true,
		escKey: true,
		width: '200',
		height: '200',
		transition: "fade",
		overlayOpacity: 0.3
	});

	if (cookievalue  < 0)
	{
		setTimeout(
			function(){
				modal_dialog_open();
			}, 2000);
	};
});
</script>
</div>
<!-- End of Modal Dialog Output -->

Can you send me the URL of the site on which you are trying to get this to work? I can check to see if there are any javascript errors or other problems preventing this from appearing.

https://asapportal.ca/courses/planning-essentials-for-classroom-success/

The link that should span the modal dialog is in the footer, right side, “Exit Program”

Oh, I see. When you said a menu item, I did not expect it to be a link to another page. Modal Dialog cannot be used to display a pop-up before exiting a page.

Oh darn. Any suggestions on a plugin that can do that?

Try https://www.ads-software.com/plugins/wbounce/

Thanks for all your help!