By hquadrat on

Hi there,

I am developing a theme for drupal 4.7x... (actually I am porting a layout from openwebdesign.org).
Currently I try to theme the navigational menu through block.tpl.php where I define different styles for each of the different block-types. So if the "user-block" (the user's navigation) is created, I use a different layout as if I display e.g. the calendar-block, the loginblock or whatever. This point is clear to me so far.
Now, as indicated, the problem is the nav-menu. how can I change the actual html output of the menu-module? I supposed to find a function in menu.module, but I did not yet find what I am looking for.

To become more precise: the menues are currently output as:

<ul class="menu">
<li class="leaf"><a href="/#">Link 1</a></li>
<li class="collapsed"><a href="/#" title="">Collapsed Menu-Link</a></li>
<li class="expanded"><a href="/#" title="">Expanded Menu-Link</a>
<ul class="menu">
<li class="leaf"><a href="/#">Child Menu-Link</a></li>
</ul>
</li>
<li class="leaf"><a href="/#">Link2</a></li>
</ul>

But, using my own wanted css-definitions, this collides with the css-definitions of drupal.css (as I suppose). So I wondered, if it would make sense to change the html output something like:

<dt><a href="/#">Link 1</a></dt>
<dt><a href="/#">Collapsed Menu-Link</a></dt>
<dt><a href="/#">Expanded Menu-Link</a></dt>
  <dd><a href="/#">Child Menu-Link</a></dd>
<dt><a href="/#">Link 2</a></dt>

This is at least, how the template I use for my theme defines a menu structure, styled through css then.
Is this possible at all? I just don't know where to look for a drupal-function I could modify/override through template.php... (yes, it is supposed to become a phptemplate-theme)

Any helping comment would be very welcomed...
Thanks, hQuadrat

PS.: Hope I could make clear what I wanted to do with my poor english... if not or if details are missing, please ask, I'll watch this thread... :)

⋅ Categories: Drupal 4.7.x

Comments

styro’s picture

styro commented

to change the menu HTML:

http://api.drupal.org/api/4.7/function/theme_menu_tree
http://api.drupal.org/api/4.7/function/theme_menu_item

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

hquadrat’s picture

hquadrat commented

Hi styro,

thanks so far. I think that should help me getting to the point :)

--
www.hquadr.at

hquadrat’s picture

hquadrat commented

Hmmm, ok. So far I got it managed to theme the "normal" menus... but how can I do exactly the same with the primary- or secondary-links if I want to display the children-items of the primary links too??

The problem is the following: with

<?php if (is_array($primary_links)) : ?>
<ul id="primary">
<?php foreach ($primary_links as $link): ?>
<li><?php print $link?></li>
<?php endforeach; ?>
</ul>
<?php endif; ?>

I get something like:

<ul id="primary">
<li><a href="http://www.hquadr.at" title="zurück zur Hauptseite">Home</a></li>
<li><a href="/node/482" title="">Über den Autor</a></li>
<li><a href="/image" title="zur Bildergallerie">Galerie</a></li>
<li><a href="/contact" title="Falls Sie mir etwas zu sagen haben...">Kontakt</a></li>
<li><a href="/impressum" title="Impressum">Impressum</a></li>
</ul>

This would be actually exactly as I wanted the html-output to be (just the normal <li></li> Tags), exept that I cannot display the submenus of $primary_links.
With the function to be found here: http://drupal.org/node/68578 I will get a primary-links menu as desired (also showing the subitems respectively the "childrens"), but then I get a "normal" menu tree as if I definded any other menu within the theme - that means that I get automatically the classes "active", "expanded" and "leaf" like by default menus. So it is quite impossible to style the primary- (or secondary-)links different from the other menus in css, as they get the same classes...

Is it somehow possible to get an output as the first snipplet provides (without the css-classes or at least with modified names of these classes) but also displaying the children-items defined in admin-->menus??
This is where I got stuck at the moment and I don't have an idea how to combine the two solutions that just solve my problem partially...

Thanks very much for any suggestions...

hQuadrat
--
www.hquadr.at

styro’s picture

styro commented

are produced by this function:

http://api.drupal.org/api/4.7/function/theme_menu_links

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

hquadrat’s picture

hquadrat commented

Hmm, I still do not know how to address this function (how to call a function like that in page.tpl.php) so that it fits to that what I want to get. I actually want a primary_links-menu that has more than one level (it shall display the childrens) and that just uses the normal <ul><li> tags without classes or classes that are different from "active", "expanded" and "leaf", as I get them with the code in page.tpl.php as posted in the link already linked above: http://drupal.org/node/68578. I'd use that code if I wouldnt get those classes...

All other solutions I found here at the forums, even at german forums lead to that I'll get a themeable primary_links-menu (html different from the normal user-menu in the left or right sidebar), but it just has one level, no childrens of the menu are displayed...

Does not anyone have a solution to that? I'm really desperate from that, as I dont get it, obviously...
--
www.hquadr.at

styro’s picture

styro commented

http://api.drupal.org/api/4.7/function/theme_menu_links takes an array of themed links generated by http://api.drupal.org/api/4.7/function/menu_primary_links and outputs them as a list.

http://api.drupal.org/api/4.7/function/menu_primary_links doesn't just generate the top level primary links - you supply it with level and parent arguments to get what you want out of it. eg the secondary links are just generated by the same function just with different arguments. The docs explain it.

To call a theme function in your templates do something like this:

<?php
$level = 3; // next level in from the secondary menu
$parent = 0; // you could use something else if you don't want the current tree
$links = menu_primary_links($level, $parent);
print theme('menu_links', $links);
?>

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

hquadrat’s picture

hquadrat commented

In Drupal 4.7.x you can define under admin/menu the primary- and the secondary-links menu, simply the same as you define the other menus as e.g. the user-menu. There you can also define sublevels of those menus which are expandable or (as I define it) per default expanded.

now I actually want an output as follows (example) for the $primary_links:

<ul>
<li><a href="http://www.hquadr.at" title="zurück zur Hauptseite">Home</a></li>
<li><a href="/image" title="zur Bildergallerie">Galerie</a></li>
  <ul>
  <li><a href="/gallery1" title="">Galerie 1</a>
  <li><a href="/gallery2" title="">Galerie 2</a>
  [...]
  </ul>
<li><a href="/contact" title="Falls Sie mir etwas zu sagen haben...">Kontakt</a></li>
<li><a href="/impressum" title="Impressum">Impressum</a></li>
</ul>

So the html-output should be basically the same as I get it with any other menu (displaying the sublevels under a new <ul></ul> section, or said in other words, the whole tree), just that I do not want the same classes in the <li class="leaf"></li> tags. I get those sublevels (the whole menu tree) if I use the code linked above as the links are generated through http://api.drupal.org/api/4.7/function/theme_menu_tree (??):

in page.tpl.php:

<?php if (isset($primary_links)) { ?>
<?php print theme('menu_tree',variable_get('menu_primary_menu',0)); ?>
<?php } ?>

Output somethink like:

<ul class="menu">
<li class="leaf"><a href="/#">Link 1</a></li>
<li class="collapsed"><a href="/#" title="">Collapsed Menu-Link</a></li>
<li class="expanded"><a href="/#" title="">Expanded Menu-Link</a>
<ul class="menu">
<li class="leaf"><a href="/#">Child Menu-Link</a></li>
</ul>
</li>
<li class="leaf"><a href="/#">Link2</a></li>
</ul>

but unfortunately I dont know how to get rid of those classes, mentioned above too. Or that I could change the names of these classes solely for the primary_links, as they should get styled different from the menus in the sidebar.

Sorry, maybe my English is a little too confusing, but I hope I could make clearer now what I wanted...

EDIT: With your code, styro, I get again a one-level menu, no "childrens"... or am I doing something really wrong?

--
www.hquadr.at

styro’s picture

styro commented

You want a menu tree made up of nested unordered listed, but styled differently from a normal menu?

Surely that can just be accommodated by CSS selectors in your theme depending on where the menu is located. You shouldn't have to remove classes or anything, although you might have to specify a few more CSS rules than normal to override everything you need to.

If you can't make the CSS selectors specific enough to only apply to that menu, you could always wrap the menu in a div with an id that overcomes that.

--
Anton
New to Drupal? | Forum posting tips | Troubleshooting FAQ

hquadrat’s picture

hquadrat commented

Thanks again for your time and suggestions, styro. I now got it working through optimizing the css-definitions, but I had to change quite a lot css classes and had to define many more attributes to override all drupal.css definitions. I thought in the beginning it then would be faster and easier to change the html-output through some function in template.php but this seems to be much more complicated to realize than I thought....
So, sorry for bothering ;)

hQuadrat
--
www.hquadr.at