Opened 5 years ago

Last modified 7 months ago

#5544 assigned enhancement

Feature request: Custom class and id attributes to enable CSS styling

Reported by: robin.macharg@… Owned by: rjollos
Priority: low Component: NavAddPlugin
Severity: trivial Keywords: navigation, css,
Cc: Trac Release: 0.11


I use the Agilo plugin for Trac which provides icons for the main navigation items. It would be nice to be able to provide custom icons for any additions I make using the navadd plugin. A couple of minor tweaks to allow this, namely extracting the DOM class and id from the Trac config for a navigation item and adding them into the link:

from trac.core import *
from import INavigationContributor, ITemplateProvider
from trac.util import Markup

class NavAdd(Component):
    """ Allows to add items to main and meta navigation bar"""

    nav_contributors = ExtensionPoint(INavigationContributor)

    # INavigationContributor methods
    def get_active_navigation_item(self, req):
        return ''
    def get_navigation_items(self, req):
    add = self.env.config.get('navadd', 'add_items', ''). \
        replace(',', ' ').split()
    items = []
    for a in add:
        title = self.env.config.get('navadd', '%s.title' % a)
        url = self.env.config.get('navadd', '%s.url' % a)
        perm = self.env.config.get('navadd', '%s.perm' % a)
        target = self.env.config.get('navadd', '' % a)
            dom_class = self.env.config.get('navadd', '%s.dom_class' % a)
            dom_id =  self.env.config.get('navadd', '%s.dom_id' % a)

        if perm and not req.perm.has_permission(perm):

        if target not in ('mainnav', 'metanav'):
        target = 'mainnav'

# change &lt;, below, back to a '<' - Trac antispam kicked in.

        items.append((target, a, Markup('&lt;a href="%s" id="%s" class="%s">%s</a>' % (url, dom_id, dom_class, title))))
    return items

The [navadd] section would provide suitable entries:

add_items = mynav
mynav.title = whatever
mynav.dom_class = myNav
mynav.dom_id = myNavID

A suitable site CSS would then provide a background image location for e.g. the class:

.group li a.myNav 
    background-image: url("/trac/chrome/site/images/your_custom_icon.png"); 

The image would be placed under your Trac htdocs/images directory in this case. The above code can be polished a bit to not include empty class or id attributes.

Attachments (0)

Change History (1)

comment:1 Changed 7 months ago by rjollos

  • Owner changed from otaku42 to rjollos
  • Status changed from new to assigned

Add Comment

Modify Ticket

as assigned .

E-mail address and user name can be saved in the Preferences.

Note: See TracTickets for help on using tickets.