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

[Robin Macharg]

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 navadd.py 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 trac.web.chrome import INavigationContributor, ITemplateProvider
from trac.util import Markup

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

    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', '%s.target' % 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):
        continue

        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:

[navadd]
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.

[Ryan J Ollos]

The ticket custom fields have a unique id in the ticket box and ticket properties box. The ids for the Trac Release field on this site are h_release and field-release.