Page 1 of 2
adding a body ID as css hook
Posted: Sat 18. Aug 2007, 08:36
by beat
I have a site with seven main navigation points. each of this seven should get a seperate header image. An easy way would be, to be able to set a body ID to have kind of a hook to add a css role to like
Code: Select all
#bodyHome #header {
background-image: url(bgHome.gif);
}
#bodyProd #header {
background-image: url(bgProd.gif);
}
Another way could be to have seven templates with seven different #headers, but this is not really dynamic.
However I have not found a way to add an ID to the body tag.
Is there a smart way to solve this issue?
Posted: Sat 18. Aug 2007, 13:12
by update
A dirty one:
open index.php
go to line ~140
replace the line
Code: Select all
$content['page_start'] .= '</head>'.LF.'<body>'.LF;
with
Code: Select all
$content['page_start'] .= '</head>'.LF.'<body id="'.$alias=$GLOBALS['content']['struct'][($GLOBALS['aktion'][0])]['acat_alias'].'">';' >'.LF;
The result in your html source will be:
Code: Select all
<body id="whatever_category_alias">
Now in your css you can trigger somthing:
Code: Select all
body#whatever_category_alias #my_bg_header_pic {
background-color: #99FF66;
background-image:none;
}
Perhaps kind of ugly, but seems to work...
Good luck
claus
EDIT is really dirty - some > too much (but is working. Perhaps some one could clean it a little bit

Posted: Sat 18. Aug 2007, 13:16
by update
BTW:
It would be nice to have the possibility to pass some rules over to the body element in the backend page structure section ---
hasn't this been possible some year ago? At least I couldn't find it...
claus
Posted: Sat 18. Aug 2007, 13:59
by update
I'm just wondering if this can be extended:
if you don't have a css rule defined for a certain alias then everything does a fallback to the standard template definition.
So passing classes and ids to the body - depending on the aliases (coming article aliases! too) you have to have exactly only one template. The rest is done within a css file...
The more I'm thinking about that the more it seems to be exciting - or am I completely on the wrong track?

Any comment on this?
claus
Posted: Sat 18. Aug 2007, 14:57
by update
I have corrected the above a little bit and added the class
Code: Select all
$content['page_start'] .= '</head>'.LF.'<body id="'.$alias=$GLOBALS['content']['struct'][($GLOBALS['aktion'][0])]['acat_alias'].'" class="'.$alias=$GLOBALS['content']['struct'][($GLOBALS['aktion'][0])]['acat_alias'].'">'.LF;
Now the result is reading
And this is working really cool

Posted: Sat 18. Aug 2007, 20:16
by beat
Claus thanks
just came back, was away the whole day. However I will have a look at this. Seems to be what I am looking for, especially the last part. I was also thinking of having a cp, but I am not sure if this works.
my Idea is that all files in one level will get the same ID for example.
Products
-- product 1
-- product 2
-- product 3
will have a the ID bodyProducts
Services
-- service 1
-- service 2
-- service 3
will have the ID bodyServices
and so on.
I will try your solution tomorrow.
Thanks so far.
Posted: Sat 18. Aug 2007, 21:54
by beat
Hi claus
just tried your solution. I guess it it is the way to it but I get for each navigation a new ID and class.
Well a class is actually not needed (not for now, but to have it makes sense) as you can trigger all css commands via the body id. what would be important is that the body id remains the same as the main navigation. for example for products and its child sides or services and its child sides.
Hope you understand my bad english, but yes this is the way.
Posted: Sun 19. Aug 2007, 11:18
by update
I get for each navigation a new ID and class.
Yes, that's a pity indeed...
This solution gathers the active level alias (only) by now, but I'm no programmer at all, so I didn't succeed in calling the main level only (the one below home) yet - had a lot of error screens while putting this one together
But while digging into it I collected some ideas about an extension to the backend to have this feature

beeing selectable via page layout / page template setup....
I hope that some really skilled ones will give a feedback on it because I still believe that it really could come in handy ...
claus
Posted: Mon 20. Aug 2007, 17:41
by update
Hey hey - just detected the new index.php of the today's trunk. There it reads:
Code: Select all
// inject body tag in case of class or id attribute
$body_inject = '<body';
if($content['body_id'] !== false) {
if(!empty($template_default['body']['id'])) {
$body_inject .= ' id="'.$template_default['body']['id'].$content['body_id'].'"';
}
if(!empty($template_default['body']['class'])) {
$body_inject .= ' class="'.$template_default['body']['class'].$content['body_id'].'"';
}
}
$content['page_start'] .= $body_inject.'>'.LF;
Just installing - like christmas - will have a look

claus
Posted: Sun 26. Aug 2007, 12:07
by Oliver Georgi
was made for beat's needs
Oliver
Posted: Sun 4. Nov 2007, 23:57
by update
Played a little bit with this one and here is my suggestion:
What about to have an input possibility in the backend in structure part:
Code: Select all
[] class [ _____ ]
[] id [ _____ ]
as a possibility to put into every structure item on demand...
Then we would be able to have
only one template for
all our needs, steering all column numbers and each structure oriented output via css by defining some extra ids and/or classes, depending on structure levels...
And for some defaults we have the inject_body_id.php and conf.template.default.inc.
Do you get the picture? What do you think?
some 4 cents
claus
Posted: Mon 5. Nov 2007, 00:45
by Oliver Georgi
have a look at
Code: Select all
$template_default['body']['id'] = 'myid_';
$template_default['body']['class'] = '';
in conf.template_default.inc.php
I will not implement additional backend fields.
Oliver
Posted: Mon 5. Nov 2007, 09:02
by update
Oliver,
thought it over and over again this night - my post has been really short-thought...
I will not implement additional backend fields.
Had a look at your quoted code and again a look at inject_body_id.php.
As a default we have: ids based upon the main structure with a parent -> child dependency. This is cool!
What I want to try is some additional parent-child behavior within the deeper levels. I know that this could be done with the aforementioned "inject_body_id.php" - but how.
One example might explain it perhaps: At the third level there is a branch with pictures with id=20 and I want to be able to hand over some css right to this one and its childs
Might be that I'm on the wrong track, but would you mind giving an example for inject_body_id.php how this has to be defined, basically?
Thank you
Posted: Mon 5. Nov 2007, 09:52
by Oliver Georgi
sorry, no time to do so.
Oliver
Posted: Mon 5. Nov 2007, 10:40
by Oliver Georgi
Ähm, by the way - you can change these values
Code: Select all
$template_default['body']['id'] = 'myid_';
$template_default['body']['class'] = '';
at any time by overwriting these values in the structure level editor:
These custom template default are stored in
template/inc_settings/template_default
Use the values you want to overwrite only. For your solution it might be:
Code: Select all
$template_default['body']['id'] = '';
$template_default['body']['class'] = 'level1 sublevel3';
Oliver