Community & Support

How do I add a target="_blank" attribute to menu items?

Basically, I want one of my menu items, to link to a new page, as opposed to opening in the present page. Is there a way to do this?

Comments

By theming

The only way I can think of is to do it by theme in block.tpl.php.

You insert target="_blank" in each a tag that does not contain a link inside your site (everything unlike '/path/to/node' and 'http://www.yoursite.com/').

page.tpl

This thread (http://drupal.org/node/64892) might help show you what code and where to insert it in the page.tpl.php file of your site's theme. But most page templates deal only with the $primary_links and $secondary_links variables and might not cover menu items with external links that you want to create. You might have to look elsewhere to make changes. I'm looking into this myself and here are some Drupal theming pages that I'm looking at:

Use jQuery instead

Hey, instead of using target="" which breaks XHTML validation, use JavaScript instead.

Find out what the class or ID of your link is. For example, if it's menu-1-2 then use the below code:

<?php
drupal_add_js
('$(document).ready(function(){$("a.menu-1-2").click(function() { window.open(this.href); return false; }    ); } );', 'inline' );
?>

You can insert this in your template.php file.

not working?

Hallo,

I tried this code, but it doesn't seem to work... I use Drupal 5. Maybe something changed?

Koen

Seems to work in 6

Although I'm not sure this is really preferable, considering that for any link that I need to open, I'll need to specify the ID/class separately. Furthermore, with the menu build, there's no guarantee that I'll have a unique ID/class to use, which seems a bit strange.

Try this

drupal_add_js ('$(document).ready(function(){$(" #menu-3030 a").each(function(){$(this).attr({ target: "_blank" });}); } );', 'inline' );

It's works in Drupal 6

jrdd

Try this

Try this insted:

drupal_add_js ('$(document).ready(function(){ $(\'a[@href^="http"]\').each(function(){$(this).attr({ target: "_blank" });}); } );', 'inline' );

That will make ANY link that has begins with http, open in a target="_blank".

Great idea, but ...

This doesn't seem to work with the pathauto module, since the generated links contain http.

target=_blank in primary links menu

For adding target="_blank" to primary links menu items in Drupal 5 and 6, see Open link in new window.

The solution uses Drupal's menu_item_link theme hook.

Here is the solution ;-)

Can't figure out a way to to

Can't figure out a way to to it at the module level, but I went for a theme level solution for now...

<?php
function phptemplate_menu_item_link($link) {

  if(
$link['link_path'] == 'http://www.tableausoftware.com/community/forums') {
       
$link['options']['attributes']['target']='_blank';
  }
  return
l($link['title'],$link['link_path'],array('attributes'=>$link['options']['attributes']) );

}
?>

...however, be aware that this does not rebuild using all options that might be on the link... like fragments and queries, etc.

I was shortsighted. Here is the RIGHT WAY in D6.

Here is the proper way to drop in from link overrides for special circumstances. (In my case target="_blank")

<?php
function MY-THEME_menu_item_link($link) {

 
// Just an initializer
 
if (empty($link['localized_options'])) {
   
$link['localized_options'] = array();
  }

 
// If an item is a LOCAL TASK, render it as a tab
 
if ($link['type'] & MENU_IS_LOCAL_TASK) {
   
$link['title'] = '<span class="tab">' . check_plain($link['title']) . '</span>';
   
$link['localized_options']['html'] = TRUE;
  }
 
 
// ALTERING YOUR SPECIAL LINKS. I WAS LOOKING FOR TARGET=_BLANK
  // You can also do this by checking $link['path'] with a substring, but I opted just for integer comparison for now.

 
if($link['mlid'] == 1210) { //http://www.tableausoftware.com/community/forums
       
$link['localized_options']['attributes']['target']='_blank';
  }
 
 
// Proper way to return the link preserving all the extra options.
 
return l($link['title'], $link['href'], $link['localized_options']);

}
?>

This works for me

I should probably test a bit more, but I don't see any issues yet. Thanks doublejosh!

I was shortsighted. Here is the RIGHT WAY in D6.

Whops. double post.

This works, I guarantee you ;-)

go to theme folder and add the following javascript to page.tpl.php file before tag

<script>
window.onload = function() {
   if (!document.getElementsByTagName) return false;
   var links = document.getElementsByTagName("a");
   for (var i=0; i<links.length; i++) {
      if (links[i].getAttribute("href").match('#newpagemenu') == "#newpagemenu") {
         links[i].onclick = function() {
            return !window.open(this.href);
         }
      }
   }
}
</script>

them go the menu and add #newpagemenu to each item that you want to be open in new target, I had test it and it should work

help

Hi
I'm trying to use, but where i have to put newpagemenu ?
If i put in URL field....give me error

Thanks a lot !!! Work perfectly!

add it in the URL field as bookmark

you should add #newpagemenu instead newpagemenu after the link and it should work

Best
Blade

A solution.

For single links you can control target attribute with the following.

<?php
.l('image or text', 'link',   array('html' => TRUE, 'attributes' => array('target' => '_blank')));
?>

Attributes are added to the a tag as if you wrote straight html. Above would output as <a target="_blank">, you can literally add anything to the html. For instance if you input 'attributes' => array('asdfasdf' => 'asdfasdf'), drupal would output <a asdfasdf="asdfasdf">. Full of sweetness.

If you have to open a link in

If you have to open a link in a new browser window you should actually use something like:

<?php
.l('image or text', 'link', array('attributes' => array('onclick' => 'window.open(this.href); return false;')));
?>

target="_blank" is an out-dated practice, it won't validate if you are using xhtml strict and is not allowed in html5.

--
G

Or a simpler method...

bunch of solutions

All solutions are great

I gave a try to the menu attributes and worked just fine, a few months ago I was working in a way to implement keyboard usage in nice menus generated menu items and I created a small script so I could surf the links with the keyboard, I had to tweak nice menus module to be able to add ID's to the menu items so I would be able to surf through them back and forth. I didn't knew about this menu attributes module otherwise I wouldn't spend time on adding Id to the items and sub items in the menus.

Thanks to all

germancito

Exactly what the doctor ordered

Thanks adam_b!

A cleaner solution in my

A cleaner solution in my opinion is to add a piece of jQuery code like this:

      $(document).ready(function (){
        $('a[href][rel="external"]').click(
          function () {
            window.open($(this).attr('href')); return false;
          }
        );
      });

that will search for any [a] tag (that has the attributes html and rel="external") and change its onClick event.
Ex.:<a href="http://www.exemple.com" rel="external">Some external link</a>

---

Perfect Solution

Hi,

put the below line in path & put your desire title

http://#

Thanks,
Amit Garg
amit@highpixel.in
http://highpixel.in