Inserting a Span Tag into links - not into primary links

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
wernerglinka's picture

Does anybody know how to insert span tags into all links on a page the Drupal way? E.g. <a href="">link title</a> becomes <a href=""><span>link title</span></a>. This is easily done with javascript but there must be a way to do this in template.php. Any pointers are appreciated.

Comments

Hi there! Have you already

osman's picture

Hi there!

Have you already checked theme_links function? You can change the output of each link in this function.

http://api.drupal.org/api/function/theme_links/6

Osman

thanks for the reply osman.

wernerglinka's picture

thanks for the reply osman. This seems to be working for primary links only. I tried this and it didn't do anything, maybe because I am using nice menus?

Doesn't make sense from a CSS perspective

gohlkus's picture

It doesn't make sense to insert a span into every link, especially since you will probably end up having links that include block-level elements (and "span" is only supposed to be used around inline elements).

If you want to apply some kind of style to every link, then just use the stylesheet to do so:

a:link { color: #06b; font-weight: bold; text-decoration: none }
a:visited { color: #07a; font-weight: bold; text-decoration: none }
a:active { color: #0b6; font-weight: bold; text-decoration: none }
a:hover { color: #038; font-weight: bold; text-decoration: underline }

a.left:link { color: #ddf; font-weight: bold; text-decoration: none }
a.left:visited { color: #ddd; font-weight: bold; text-decoration: none }
a.left:active { color: #ffd; font-weight: bold; text-decoration: none }
a.left:hover { color: #dfd; font-weight: bold; text-decoration: underline }

The first four apply to all links (of the specified pseudo-classes), and the last four apply to links with the class "left", e.g.

<a href="#blah" class="left">asdf</a>

Hope that helps.

It makes sense if you want to

wernerglinka's picture

It makes sense if you want to apply link treatments that use the sliding door technique. You need a span to do tabs and button in IE.

oh, yeah, look at that.

gohlkus's picture

I don't know how that technique escaped me to this point. Sorry about that; carry on!

Hi, you may find my

coderintherye's picture

Hi, you may find my instructions here to be helpful http://www.nowarninglabel.com/home/Making-a-tab-or-other-menu-link-a-pop...

I talk about how you can add a target="_blank" to every link in Drupal 6. You can use the same method to add a tag around the link although you will have to modify the instructions a bit. Hope that helps. There is also a D5 version linked there if you need for D5.

Cheers.

Drupal evangelist.
www.CoderintheRye.com

So, in your case

osman's picture

So, in your case wernerglinka,

If you put this in your template.php, every single link text should be wrapped with SPAN tag.

<?php
function YOURTHEME_menu_item_link($link) {
  if (empty(
$link['localized_options'])) {
   
$link['localized_options'] = array();
  }

  return
l('<span>' . $link['title'] . '</span>', $link['href'], $link['localized_options']);
}
?>

hi osman, thanks for the

wernerglinka's picture

hi osman,
thanks for the pointer. It does indeed insert a span tag into all menu links except that Drupal shows the span tag in the title field. Looking into the browser source I see for example "<span>Search</span>"
Any idea what went wrong?

It needs html set to true.

wernerglinka's picture

It needs html set to true. here is what works for your reference.

<?php
function YOURTHEME_menu_item_link($link) {
if (empty(
$link['localized_options'])) {
   
$link['localized_options'] = array();
  }
 
$link['title'] = $link['title'] = '<span class="link">' . check_plain($link['title']) . '</span>';
 
$link['localized_options'] += array('html'=> TRUE);
  return
l($link['title'], $link['href'], $link['localized_options']);
?>

span into a link,

wordi's picture

I previously wrote auto about how to insert a span into a link, but after testing this method quickly failed when coupled with the Views module. When a Page view is created and assigned to a node url, everything is fine and dandy. The issues arise when you want a link to use an alias. Luckily, I’ve devised a really simple work around:

use the same code to generate your menu:
1 <?php if (!empty($primary_links)): ?>
2 <?php print theme('links', $primary_links, array('id' => 'nav')); ?>
3 <?php endif; ?>

this calls the links() function inside of includes/theme.inc, which triggers the l() function in the includes/common.inc to write the primary links menu.

this code are wrong! "use the

prolanguages1's picture

this code are wrong!

"use the same code to generate your menu:
1

<?php
if (!empty($primary_links)):
?>

2
<?php
print theme('links', $primary_links, array('id' => 'nav'));
?>

3
<?php
endif;
?>
" or not?

greet

prolanguage from Übersetzungsagentur für Übersetzung Deutsch Polnisch Übersetzung Deutsch Englisch

Hmm the code above works fine

marcweb's picture

Hmm the code above works fine for me. I am currently using it on several Browsergames and there is no sign of an error.

I found this function that

devmobdev's picture

I found this function that put span tag inside anchor tag. But i don’t know how to modify the above function so that to give the desired output.
Here is the function that put span inside the anchor tag.

<?php
function yourtheme_menu_links($links) {
  if (!
count($links)) {
    return
'';
  }
 
$level_tmp = explode('', key($links));
 
$level = $level_tmp<a href="#fn2831159204cca5b92d6850">0</a>;
 
$output = "<ul id=\"links$level\">\n";
  foreach (
$links as $index => $link) {
   
$output .= '<li';
    if (
stristr($index, 'active')) {
     
$output .= ' class="active"';
    }
   
$output .= ">". l("<span>".$link['title']."</span>", $link['href'], $link['attributes'], $link['query'], $link['fragment'], FALSE, TRUE) ."</li>\n";
  }
 
$output .= '</ul>';

  return
$output;
}
?>

jquerymenu override I used - maybe nice menu the same way?

bvirtual's picture

For nice menus perhaps the same method I used for jquerymenus will work. Copy the function out of the nice menu php module, that is, if it's listed as override-able, and paste into your theme's template.php, add the leading theme_ prefix, replacing the word theme with your theme's name. Below is the function definition php line I used, along with some custom code for handling html=true, so it renders properly, but only when the title actually changes, so not all menu items get html rendering, a small speed up, but one I thought 'good' as then only those menu items that are actually changed to html, then have the extra processing, thus plain menu items get expected results (no unexpected results).

Of note, I also used the primary menu as is (bottom navbar, smaller font), not just as a jquery menu (vertical navbar on top left side). template.php had to have overrides for both menus.

function theme_jqmenu_links($title, $path, $options, $state, $classes, $has_children, $editpath = NULL, $edit_text = NULL, $edit_access) {
  global $base_path;
  $module_path = $base_path . drupal_get_path('module', 'jquerymenu');
  $output = '';


  $titleNew=theme_replace_menu_title($title);
  if($titleNew != $title){
    $title=$titleNew;
    $options['html'] = 'true';
  }

...rest of jqmenu function code....

The function 'theme_replace_menu_title' is a custom function, defined in template.php, that tests the title for a 'match' and if matched, span tag is inserted, along with a class and id name, giving more control from the theme.css file. In one case, a menu item is too long, and a br tag followed by 2 nbsp's are inserted to break the long link title to two lines, with the second line indented, so the user knows it one menu item, not two.

I did look for Drupal API for theming links, and I will see if the needed functionality can be coded with that, as it appears to be lower level. Though, I like the idea of the themes folder containing all modifications.

--

OT: What's up with all the spam on this thread? I voted them all down -1. Is there a reporting mechanism to inactivate their login userid? And automatically remove their spam from all of GDO?

Peter

LA's Open Source User Group Advocate - Volunteer at DrupalCamp LA and SCALE

SF Bay Area

Group organizers

Group categories

Resources

user group

Group notifications

This group offers an RSS feed. Or subscribe to these personalized, sitewide feeds: