adding target="_Blank" to a main navigation item

Category: 

  • Question

kiirja@mit.edu

I have one link in the main navigation that needs to open in a new window. If I go to #overlay=admin/structure/menu/item/670/edit there is no capabilty to add "open in new window".
Is there a way to add this?

7/11/14

kiirja@mit.edu

I have one link in the main navigation that needs to open in a new window. If I go to #overlay=admin/structure/menu/item/670/edit there is no capabilty to add "open in new window".
Is there a way to add this?

7/11/14

rjw@mit.edu

Here's one way.

You first need to make sure your theme puts the menu link id on menu items. In the MIT Adaptive Theme settings, this is the Menus checkbox under the CSS Classes tab. You should see something like this in your HTML code:

  • Then you can add some javascript to your site (via JS Injector or a block):

    $("li.menu-item-670 > a").attr('target','_blank');

    • 8/2/14

    rjw@mit.edu

    Drupal ate my HTML code. This is what you should see in your HTML source::

    li class="menu-item-670"

    8/2/14

    kiirja@mit.edu

    The menu items are listed this way in the CSS code:

  • I added the code you suggested to the css injector:
    $("li.leaf menu-item-670 > a").attr('target','_blank');

    [it also didn't work this way: $("li.menu-item-670 > a").attr('target','_blank');]

    The links are not opening in a new tab.
    Suggestions?
    Kiirja

    • 10/20/14

    kiirja@mit.edu

    Any answers for this? The client for this site keeps asking...

    The menu items are listed this way in the CSS code:
    (The // is to prevent Drupal from deleting my sample code here, it is
    not commented out in the actual site.//)

    //li class="leaf menu-item-670"//

    I added the code you suggested to the css injector:
    $("li.leaf menu-item-670 > a").attr('target','_blank');

    [it also didn't work this way: $("li.menu-item-670 > a").attr('target','_blank');]

    The links are not opening in a new tab.

    10/24/14

    kiirja@mit.edu

    The site where this was to be implemented was put on hold, but is now going live. They still need some links in the left navigation to open in a new window. I have put the following code into the CSS injector but it's not working:
    $("li.leaf menu-item-670 > a").attr('target','_blank');

    $("li.leaf menu-item-714 > a").attr('target','_blank');

    /*670 is the link to the other related site*/
    /*714 is the link to another related site*/

    8/24/15