Making a tab or other menu link a popup in Drupal 6

 Contrary to what you might think, making a menu item/link a popup link is no easy matter in Drupal. However, it's not too difficult either. Below I will show you the way to make your links be popups in Drupal 6. If you want to do this in Drupal 5 then please see here: http://www.nowarninglabel.com/home/make-a-tab-a-popup-drupal-5

See, a menu link is not like a link in a node. It isn't possible to just easily change the source code for a link. If one were to dig deep enough, eventually the code for generating the HTML for a menu link will come back to the theme_menu_item_link() in menu.inc.

To make a link a popup follow these steps:

  1. Open up your template.php file in your themes folder. If you don't have a template.php or need help with this step then see this post at drupal.org 
  2. In this file you will insert the following code:

    function yourthemename_menu_item_link($link) {
      if (empty($link['localized_options'])) {
        $link['localized_options'] = array();
      }
      if($link['href']) {
        $href_array = explode('/', $link['href']);
        if($href_array[1]) {
          $link_href_popup = array_pop($href_array);
          if($link_href_popup == 'edit') {
            if(!empty($link['description'])) {
              $link['localized_options'] = array('attributes' => array('target' => '_blank', 'title' => $link['description']));
            }
            else {
              $link['localized_options'] = array('attributes' => array('target' => '_blank'));
            }
            return l($link['title'], $link['href'], $link['localized_options']);
          }
        }
      }    
    return l($link['title'], $link['href'], $link['localized_options']);
    }
  3. Note that you will need to change 'edit' to the title of your link. For example, to make the 'view' tab a popup then change it to 'view'. Of course you could leave it as edit and then the edit tab will be a popup. 
  4. You will also need to change yourthemename_menu_item_link to be the use the name of your theme, so say you were using the zen theme, then zen_menu_item_link. 
  5. Note: The code is quite verbose, but it is meant to be a learning example. You could make it more efficient if you wanted to. 
  6. Find me on drupal.org or contact me if you would like to see this made into a module so that you could just install the module instead of having to deal with code. 

 

Add new comment

  • No HTML tags allowed.
  • Web page addresses and e-mail addresses turn into links automatically.
  • Lines and paragraphs break automatically.

Comment using an existing account (Google, Twitter, etc.)