By nicolash on

And I'd like to streamline my installation a bit. That means I only want a class or ID on an element if I actually need it.

Some of the output is unnecessarily bloated and most things could easily be achieved with CSS selectors, rather than plonking 5 different classes on every list item.

So something like this is just too much, one might as well design with tables:

<ul class="links primary-links">
  <li class="first menu-1-1-2"><a href="" class="menu-1-1-2">Foo</a></li>
  <li class="menu-1-2-2 active"><a href="" class="menu-1-2-2 active">Foo</a></li>
  <li class="menu-1-3-2"><a href="/drupal/whatson" class="menu-1-3-2">Foo</a></li>
  <li class="menu-1-4-2"><a href="/drupal/living" class="menu-1-4-2">Foo</a></li>
  <li class="menu-1-5-2"><a href="/drupal/dining" class="menu-1-5-2">Foo</a></li>
  <li class="last menu-1-6-2"><a href="/drupal/visitors" class="menu-1-6-2">Foo</a></li>
</ul>

I can't think of anything I couldn't achieve with CSS just as well with:

<ul class="links primary-links">
  <li class="first"><a href="">Foo</a></li>
  <li class="active"><a href="">Foo</a></li>
  <li><a href="/drupal/whatson">Foo</a></li>
  <li><a href="/drupal/living">Foo</a></li>
  <li><a href="/drupal/dining">Foo</a></li>
  <li class="last"><a href="/drupal/visitors">Foo</a></li>
</ul>

Ok, now to the constructive part...I tried to get rid of all the classy stuff by overriding theme functions, but none of them seems to do anything. I tried:

theme_item_list
theme_menu_links
theme_menu_local_tasks

as phptemplate functions in my template.php file.

⋅ Categories: Drupal 5.x

Comments

Steven’s picture

Steven commented

Drupal is not only providing the markup for what it needs, but also for what other themers might want to do. This allows someone to make more advanced themes, without having to write PHP code. Only CSS is needed.

For example, giving each link in all of drupal a unique ID allows you to add icons to any menu item or node/comment link. We also have id's for blocks, so that you can easily style e.g. the navigation menu or log-in block. We allow you to easily style pages based on the path, content based on the type and status (e.g. <div class="node story published">).

Every id or class in Drupal can be put to good use.

We do try to minimize markup as much as is reasonable. For example, rather than <div class="links"><ul>, we'd do <ul class="links">. However, sometimes due to nesting of various small bits of templates, inefficiencies can sometimes arise.

Of course, this is an ongoing process, so feel free to report actually redundant classes or markup. But do keep an open mind :).

--
If you have a problem, please search before posting a question.

nicolash’s picture

nicolash commented

Your point is well taken and I have no doubt the intention behind adding all this markup is to help others. I just think that some of it results from a limited understanding of CSS, though....again, that is certainly no crime. But let me give you an example, based on what I posted above...

<ul class="links primary-links">
<li class="first menu-1-1-2"><a href="" class="menu-1-1-2">Foo</a></li>
<li class="menu-1-2-2 active"><a href="" class="menu-1-2-2 active">Foo</a></li>
<li class="menu-1-3-2"><a href="/drupal/whatson" class="menu-1-3-2">Foo</a></li>
<li class="menu-1-4-2"><a href="/drupal/living" class="menu-1-4-2">Foo</a></li>
<li class="menu-1-5-2"><a href="/drupal/dining" class="menu-1-5-2">Foo</a></li>
<li class="last menu-1-6-2"><a href="/drupal/visitors" class="menu-1-6-2">Foo</a></li>
</ul>

First, there is no point in having unique classes...that is, as you already hinted, only sensible for IDs. That aside, if we assume all the LI elements would have a unique ID, it is unnecessary to repeat this for each nested link. One can reach each individual link via:

UL.primary-links LI#menu-1-2-2 A { whatever css here; }

I think by providing a shortcut to such things results in bloated markup as well as "lazy" css coding - and we all want to improve, right? So if you point me in the right direction I'm happy to try my first patch and write a quick tutorial on how to style it easily, but first I have to find where the code above actually gets generated :)

As I wrote earlier, I think I tried all applicable theming functions?

darumaki’s picture

darumaki commented

I agree with others that Drupal output code is very messy, it should be flexible enough to allow designers to do their own mark-up. A good CMS should separate code from the design process. Modx CMS is a great example of this, Drupal forces you to use their mark-up, sure you might be able to over-ride it if you are a code geek but most are not.

olivierh’s picture

olivierh commented

I completely agree.

It's a shame that it uses so many divs. If you want to stick a completely new interface on it, you have to dig through heaps of unnecessary mark-up and CSS. It's potentially putting me off from using Drupal. Even though I like the admin panel and the community.

An API should free you up, rather than tie you down. In general things seem spaghetti/ravioli coded. It would be a great for to Drupal to implement a strong mvc pattern.

Is there perhaps a good theme that starts clean? That would be a good start.

Regards,
O.