By notebene on

Still feeling rather new to this, so bear with me.

I figured out how to make a block-.tpl.php file the will override the default block generation for a given region, but I'd like to put a menu in that block, and I'd like to generate my own output for that menu, rather than spitting the links back in <li>s wrapped with an <lu>.

Personally I'd rather just have the links separated with my own separator.

Alternatively, I suppose if there is a way to do this with CSS, that would work too. The problem I'm having with CSS is I don't want a separator at the beginning or end. So while I can style a border-right or border-left, there's always a leading and trailing border, and it doesn't look right. I'd like:

one | two | three

And using CSS, I get (or it's mirror):

one | two | three |

If I use borders. Images or other list styles seem to suffer from the same thing, unless I'm missing a cool "but don't do the first one" property.

So that go me thinking maybe it would be easier to just override the function that generates the menu, much like we override generating breadcrumbs and their separators, but I'm not finding what function I'd need to override.

[Edited to add <code> and </code> tags; nevets]

⋅ Categories: Drupal 6.x

Comments

TimeBandit’s picture

TimeBandit commented

your list of menu links should always be in list format, because its a list. So it should remain UL/LI format. In your css, apply a background "pipe" image to every LI at the far left and add left padding. Then try a declaration such as:
li:first-child {background:none; padding-left:0;}
(your real code may vary of course since if you want to target this specific list you will need other classes involved)

This should work in FireFox and IE7/8. Other browsers such as IE6 may require other workarounds to listen to the ":first-child" part of the declaration.

You can also do the border-left way suggested below. I offered the pipe option because from years of creating sites I know that often designers do not want the pipe to be the exact height of the list item. This would often lead to extraneous spans just to get the pipe to be the "right" height that the designer wanted (and the client approved). Although a background pipe doesn't scale if the font is resized, it will keep the designers and the clients happy that you "coded it right". If you or your clients aren't picky the border option is easier and scalable.

Way Cool Web Design | Theming Drupal 5

rplanteigne’s picture

rplanteigne commented

cool "but don't do the first one" property:

li { border-left: 1px solid black; }
li:first-child { border-left: none; }
notebene’s picture

notebene commented

Thanks folks, exactly what I was looking for.