Customizing the Primary Navigation menu css

Events happening in the community are now at Drupal community events on www.drupal.org.
pkcho's picture

I want to make each menu item in my Primary menu a different color, but I do not see distinguishing css for any of the individual menu items.

Does anyone have any suggestions on how to do this?

I'm using the two-tiered menu system supplied in OP 2.3.

Thank you and Merry Christmas!
Joe

Comments

Customize Primary Navigation in OpenPublish

GreenSkunk's picture
  1. Copy the openpublish-menu.tpl.php file from sites/all/modules/openpublish_core/openpublish_menu/ to your custom theme folder
  2. Edit your custom theme openpublish-menu.tpl.php

I had added the $class line to the file after the $title_link

$title_link = l($html_title, $top_item->href, array('html' => TRUE,
                                    'attributes' => array('class' => "first-level")));
        $class = ' '.strtolower('menu-item-'.preg_replace("/[^a-zA-Z0-9]/", "", strip_tags($html_title)));

Have fun creating some funky CSS

It is a damn poor day when you don't learn something.

I WAS WRONG!

GreenSkunk's picture

I've stumbled upon this old post and see a big mistake in that code.
Change the line that begins with
<li class="first-level
to
<li class="first-level <?php print strtolower('menu-item-'.preg_replace("/[^a-zA-Z0-9]/", "", strip_tags($html_title)));?> <?php print ($top_item->active ? $top_item->active : "off"); ?> <?php if ($top_item->position_class) print $top_item->position_class; ?>">

It is a damn poor day when you don't learn something.

Does this work with the menu

pkcho's picture

Does this work with the menu system that is included with the OP 2.3 distribution? I tried adding the line, cleared the cache and I didn't see anything change.

I could easily be doing something wrong, as well.

What you can do is take a

resveld's picture

What you can do is take a look at your menu in source code when viewing the page and then assign your own css to it.

-Ronald

Thank you for helping me with

pkcho's picture

Thank you for helping me with this.

When I view the code both in firebug and source, I see that there is no differentiation between menu items. There are only:

<li class="first-level off ">
        <a href="/articles/Business" class="first-level"

The only css classes are "first-level off", "first-level" and "second-level". I don't see a way to make a distinction between each menu item. Each menu item is either first-level off or first-level or second-level. I need "first-level-1", "first-level-2", etc..., don't I?

--Joe

Have you Cleared your cache?

GreenSkunk's picture

From what I can remember the OpenPublish 2.3 openpublish-menu.tpl.php code was the same as the OpenPublish 2.2. Going to check this on a 2.3 beta install as I have some menu item theming to do.

I'll check this within the next day.

It is a damn poor day when you don't learn something.

Exactly the same problem, what's up ?

lektum's picture

Hi,

I have exactly the same problem. I did what you said with the openpublish-menu.tpl.php file, editing the line and clearing cache. But nothing happened. Did someone get new ideas or solutions to fix it ? Thanks.

It is a damn poor day when you don't have an answer to your problem :)

------ edit ------

What is strange is that all kinds of modules dedicated to this task, life Menu Attributes or DHTML Menu (that can do what we need here) don't work in OpenPublish... :(

Menu CSS class attribute

GreenSkunk's picture

You don't see new classes added for your menu items?

It is a damn poor day when you don't learn something.

No, I don't see new classes

lektum's picture

No, I don't see new classes for menu items even with modules like Menu Attributes or DHTML Menu. That's strange ! That's why I would be pleased to know how to get it by editing some tpl.php file or any other method that works ! :) Thanks !

OpenPublish

Group organizers

Group categories

Group notifications

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