Ok, Im not a newbie, but I also not sure how to accomplish what I am looking for so reaching out to the community. I see that there is a means to inject css for the accordions content, but is there a way to inject css for the header. This would useful when trying to independently trying to them the headers of the Accordion. Any one can help me? For example. I have accordion headers, would like to apply a radius to the first and last accordion to give a less than blocky look to my accordions.

Comments

NeoID’s picture

NeoID commented

You can copy the entire theme_horizontal_accordion_style_render_panel function to template.php and change the output to: $output .= '<div class="header nav_'. strtolower($content->title) .'"><a href="#">';. That would add the title of the node as class to each header. Customize as you see fit. :)

mikeaja’s picture

mikeaja commented
Title: Theme individual Accordian header » Theme individual Accordian header - [Solution]
Version: 6.x-1.1 » 6.x-1.x-dev
Category: support » task
Priority: Normal » Major

I would consider this issue to be a bug / or important task, as at present there is no way to identify the accoridon header based on the individual panel.

I've found, I hope, a solution to this, making a small change to accordion.inc. After the change, each h3 header will include the class name of the panel it is attached to.

If this change is ok, I strongly suggest this is included in the next update, as styling may depend on the individual panel (for example, using icons).

Here's my modification, made in line 136 in accordion.inc:

if (!empty($content->title)) {
	$output .= "<h3 class=\"pane-title\"><a href=\"#\">$content->title</a></h3>\n";
}

to

if (!empty($content->title)) {
	$output .= "<h3 class=\"pane-title $content->css_class\"><a href=\"#\">$content->title</a></h3>\n";
}
davidburns’s picture

davidburns
he/him
Primary language English
Location Philadelphia
commented
Status: Active » Closed (fixed)

I went ahead and pushed this change into the dev branch.