[Drupal] CSS Class voor menu items.

[nerz101]

Ik als CMS beginner ben nu bezig met een proef-site in Drupal 7.0.
Nu was mijn plan om te beginnen met een Zen theme, en volgens de documentatie zelf een template te maken.

Dit lukt redelijk tot nu toe, alleen ben ik nu een beetje vastgelopen want ik wil graag weten hoe de classes geregeld zijn.

HTML:

<div id="navigation"> <div class="section clearfix">

<h2 class="element-invisible">Main menu</h2>

<ul class="links inline clearfix" id="main-menu">

<li class="menu-324 first"><a title="over ons............" href="/drupal-7.0/node/3">About us</a></li>

<li class="menu-325"><a href="/drupal-7.0/node/1">Contact</a></li>

<li class="menu-198 last active"><a class="active" href="/drupal-7.0/">Home</a></li>

</ul>
        
      </div>
</div>

Dit is wat ik zie in Firebug, nou snap ik dus niet precies hoe die classes worden gegenereerd en hoe ik de CSS hierop moet toepassen.

Ik zie dus "menu-324" en dan "first" "last" of "active".

Ik heb al wel geprobeerd "li a" te stylen maar dat is natuurlijk ver van handig aangezien dan alle listed links dan de zelfde style krijgen (in het navigation.css bestand).

Dus mijn vraag is, kan iemand mij duidelijk maken hoe ik de CSS hierop toepas?

[ Voor 7% gewijzigd door BtM909 op 03-05-2011 10:52 ]

[Bosmonster]

De standaard (CSS)meuk die Drupal genereert moet je gewoon voor 90% negeren. Dat is gebouwd door mensen die geen idee hebben waar ze mee bezig zijn en die beter kunnen blijven PHP'en.

Wat voor menu's van belang is is eigenlijk alleen de "active" class (en eventueel de active-trail).

[ Voor 6% gewijzigd door Bosmonster op 03-05-2011 10:35 ]

[Croga]

Bosmonster schreef op dinsdag 03 mei 2011 @ 10:33:
De standaard (CSS)meuk die Drupal genereert moet je gewoon voor 90% negeren. Dat is gebouwd door mensen die geen idee hebben waar ze mee bezig zijn en die beter kunnen blijven PHP'en.

Je kunt het niet negeren aangezien de bruikbare classes gegenereerd worden door Drupal. Je zult dus moeten werken met wat er aangeboden wordt.

Wat voor menu's van belang is is eigenlijk alleen de "active" class (en eventueel de active-trail).

Als je alleen de "active" class aanpast wordt alleen het uiterlijk van de actieve link in het menu aangepast. De rest van het menu gebeurt niets mee. Het is dus niet echt een optie om de rest te negeren.

TS;

Alles is embedded in een UL met ID "main-menu" wellicht kun je daar wat mee?

[ Voor 5% gewijzigd door Croga op 03-05-2011 10:43 ]

[nerz101]

@ Croga

de main-menu ID had ik over het hoofd gezien, daar moet het mee lukken. Bedankt!

code:

#main-menu li a
{ 
}

[Bosmonster]

Croga schreef op dinsdag 03 mei 2011 @ 10:39:
[...]

Je kunt het niet negeren aangezien de bruikbare classes gegenereerd worden door Drupal. Je zult dus moeten werken met wat er aangeboden wordt.
[...]

Als je alleen de "active" class aanpast wordt alleen het uiterlijk van de actieve link in het menu aangepast. De rest van het menu gebeurt niets mee. Het is dus niet echt een optie om de rest te negeren.

TS;

Alles is embedded in een UL met ID "main-menu" wellicht kun je daar wat mee?

Dat je de rest van het menu, bijvoorbeeld a.d.h.v. de ID of een omliggende container, kunt stylen lijkt me een no-brainer... Waar het om gaat is dat je de overige classes kunt negeren voor styling.

edit: Blijkbaar was dat niet zo'n no-brainer als die ID werkelijk de oplossing was

[ Voor 6% gewijzigd door Bosmonster op 03-05-2011 10:55 ]

[nerz101]

Dit was inderdaad stom van mij dat ik niet direct heb geprobeerd om die ID te aan te passen.
Dit komt door verwarringen die ik af en toe heb omdat ik zoals hier al een class zie die al verbonden is.

In ieder geval allebij bedankt, heb ik weer wat geleerd!