Basically the tabs look really terrible and and don't render right at all.

I found that the difference is that the links have a ... where as the tabs in themes don't have this.

doing the following in my template.php 

/**
 * Return rendered tabset.
 *
 * @themable
 */
function solar_pay_tabset($element) {
  $output = '<div id="tabs-'. $element['#tabset_name'] .'"'. drupal_attributes($element['#attributes']) .'>';
  $output .= '<ul>';
  foreach (element_children($element) as $key) {
    if ($element[$key]['#type'] && $element[$key]['#type'] == 'tabpage') {
      $output .= '<li'. drupal_attributes($element[$key]['#attributes']) .'><a href="#tabs-'. $element['#tabset_name'] .'-'. $element[$key]['#index'] .'"><span class="tab">'. $element[$key]['#title'] .'</span></a></li>';
    }
  }
  $output .= '</ul>';
  $output .= $element['#children'];
  $output .= '</div>';
  return $output;
}

It would be nice if this would support this in the Zen theme,

Comments

dawehner’s picture

dawehner
Primary language German
commented

so the only difference is that you create a span around the title link?

gordon’s picture

gordon commented
Title: Tabs broken in custom theming » Tabs broken in Zen theme

Basically. Here is updated version which has the the classes 'tabs primary clear-block' add the the ul which fixed up the line under all the tabs.

I have added this to the template.php but I am sure there is a better solution.

/**
 * Return rendered tabset.
 *
 * @themable
 */
function theme_name_tabset($element) {
  $output = '<div id="tabs-'. $element['#tabset_name'] .'"'. drupal_attributes($element['#attributes']) .'>';
  $output .= '<ul class="tabs primary clear-block">';
  foreach (element_children($element) as $key) {
    if ($element[$key]['#type'] && $element[$key]['#type'] == 'tabpage') {
      $output .= '<li'. drupal_attributes($element[$key]['#attributes']) .'><a href="#tabs-'. $element['#tabset_name'] .'-'. $element[$key]['#index'] .'"><span class="tab">'. $element[$key]['#title'] .'</span></a></li>';
    }
  }
  $output .= '</ul>';
  $output .= $element['#children'];
  $output .= '</div>';
  return $output;
}
dawehner’s picture

dawehner
Primary language German
commented

what happens if you remove your custom theming, does the tabs work then?

i suggest you to change your css so you it works without the span.

dawehner’s picture

dawehner
Primary language German
commented
Title: Tabs broken in Zen theme » Tabs broken in custom theming

Changed title

nancydru’s picture

nancydru
she/her/hers
Primary language English
Location Boston
commented

+1 - I'm seeing this too, but in 5.x-1.5 (also Zen Classic).

cbarilla’s picture

cbarilla commented

I have the same problem in a zen subtheme based on classic. As mentioned the problem is that the theme needs a tag around the link text in order to style correctly. I have manually added the tag with developer tools for firefox and it works perfectly. I am just learning drupal so could anyone suggest a way to get the tag added to the generated output.

I am hesitant to make any kind of changes in template.php that may mess with other menus already cusotmized on the page. This would seem to be a matter of just changing some output in the panels_tabs.js file, but I am hesitant to play around in there.

Thanks

slamMan

smoothify’s picture

smoothify commented
Title: Tabs broken in Zen theme » Tabs broken in custom theming
Status: Active » Closed (won't fix)

Marking this as won't fix as this issue has had no comment on for a year and I want to clear up the issue queue. If this issue still persists with the current version, please submit a new issue and I will look at it.