Question

I wants to show a javascript message box when a user clicks on a “FORUM” link on WordPress menu.

The message box should show a message like “You are leaving this website…” and once the user confirms the message box, it should open an external link in a new tab.

I had tried this, but it will fire the message box, when ever I leave the website or reload the page. I just wants this message box on a single WordPress menu item.

I saw some tutorials to do this, but not able to do it on WordPress menu.

WordPress does not recognize javascript:void(0) or any other javascript function on URL part.

Any ideas??

Answer 1

Finally I got it working. I’m explaining it step by step, so someone with similar issue can solve this:

1. Put # in your wordpress menu url in which you want the JavaScript
   Function.
2. Track this menu url (li ID) link from source code. in my case li id
   is menu-item-88. (this id is auto generated by wordpress and
   always unique)
3. Place the following code before the end of head tag (open header.php
   find </head>) of current theme.
4. Don’t forget to change the menu-id menu-item-88 to yours.

<script type="text/javascript">

jQuery.noConflict();
jQuery(document).ready(function(){
var menuID = jQuery('#menu-item-82');

findA = menuID.find('a');

findA.click(function(event){
if(confirm("YOU ARE LEAVING THE WEBSITE" + '\n' + "" + '\n' + "You are about to leaving the website to go to the external forum" + '\n' + "" + '\n' + "The FORUM will open in a new tab")) 
{
window.open('http://www.yourforum.com/','_blank'); //This will open the website in a new tab
}

});
});
</script>

This requires jQuery. So if jQuery is not loaded, add the following line also to your head.

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

This will prompt you that, you are leaving the website. If you clicks OK, it will open the given link in a new tab.

Ok. Thats all.. This will do the magic.