body IDs and classes

Post by **update** » Wed 2. Apr 2008, 11:09

Just a few thoughts:

It is possible to inject id and class into the body tag now since some year. The code is sitting within index.php and conf.template_default.inc.php
index.php:

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'].'"';
	}
}

and conf.template_default.inc.php

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = 'myid_';
$template_default['body']['class'] = 'myclass_';

The disadvantage with the "out-of-the--box" solution: it is always showing the starting (main / top level) ID only. Example: <body id="myid_11" class="myclass_11"> where 11 is the top level structure ID... never changing at all, no matter where you are surfing the site...

Now someone could need something like this: <body id="myid_11" class="myclass_45"> where 45 is the ID of the specific structure (so changing every time when moving around within the site - when jumping between the structure)
Someone else could need something like this: <body id="myid_11" class="mystructclass_42" class="myclass_45"> where 42 is the second level structure ID (below 11) and the 45 is the (changing as you move within your 42) specific ID below 42

If you have it like this you then can easily target almost anything via CSS
But not out of the box

(at least I didn't find out how)

So I did something I really am hating: fiddling with the source:

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['struct']['class'])) {
		$body_inject .= ' class="'.$template_default['struct']['class'].$GLOBALS['LEVEL_ID'][2].'"';
	}
	if(!empty($template_default['body']['class'])) {
		$body_inject .= ' class="'.$template_default['body']['class'].$content['cat_id'].'"';
	}

}

and

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = 'myid_';
$template_default['struct']['class'] = 'mystructclass_';
$template_default['body']['class'] = 'myclass_';

CSS targeting (example)

Code: Select all

body#myid_11.mystructclass_42 div#extra-fix-bottom {
	bottom:0;
	margin-right:50%;
	right:-47em;
	position: fixed;
	overflow: hidden;
	width: 190px;
	height: 137px;
	background-color: #ff0000;
	z-index: 15;
	background: transparent url(../../pics/3-sektflaschen.png) 0px 5px no-repeat;
}

thus having 3 Sektflaschen displaying nicely below the second level structure of 42 for all pages

Well, as this is not so nice I'd like to know if it can be achieved out-of-the-box without changing the source, perhaps someone amongst you is knowing it better...
If not, this should perhaps become a feature...

Comments, criticism, hints, jokes, helping hands to get me back onto the right way again - all welcome

PS 1st of April is over - so I'm quite serious about that one

EDIT: It would be done better with some RT I know

EDIT: But how? Nobody online??

Jensensen · Post by **Jensensen** » Wed 2. Apr 2008, 15:34

Post by **update** » Wed 2. Apr 2008, 17:28

Thanks for your input

but unfortunately this isn't exactly what I'm looking for..
To try to explain it better:

11 is the starting point ID of my german section (level 1)
-15 (level 2)
-16 (level 2)
--27 (any level X below 16)
---28 (any level X below 16)
150 is the starting point ID of my english section (level 1)
-157 (level 2)
-158 (level 2)
--167 (any level X below 158)
---168 (any level X below 158)

My body tag should look like
<body id="myid_11" class="myclass_16 myclass_67">

Now I can target
myid_11 (the german flag as a background

)
myclass_16 (the level below 11 = "people" one item of my main navi = horizontal in this case with a lot of heads as a background)
myclass_67 (68 89 and so on = any structure ID below 16 with a lot of same heads plus a special one for every structure element below 16)

To achieve this I changed index.php again:

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['struct']['class'])) {
		$body_inject .= ' class="'.$template_default['body']['class'].$GLOBALS['LEVEL_ID'][2].' '.$template_default['body']['class'].$content['cat_id'].'"';
	}
}

and conf.template_default.inc.php

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = 'myid_';
$template_default['body']['class'] = 'myclass_';

to get the required result.
Can you get the picture? And to stick with numbers rather than with aliases: numbered IDs won't change never...

We've had this discussion already: http://forum.phpwcms.org/viewtopic.php?f=1&t=15452& but I haven't been able to follow OGs suggestions

to achieve my goal...
Next step will be to try leaving index.php alone doing it with inject_body_id.php but my first attempts only threw a lot of errors on me

Post by **update** » Wed 2. Apr 2008, 19:16

This is the only change within source code so far:

// 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_class'].'"'; //instead of id
}

}

otherwise the following doesn't work (at all)

Code: Select all

<?php

/*

   just a sample how to inject body ID - i.e. to allow specific CSS based things (or JavaScript stuff too)....
   if you define $content['body_id'] = FALSE body tag injection will be hopped

   sample will set body tag injection based on "main structure"
   if it is in home it will fall back to
   
 */
if(isset($LEVEL_ID[1])) { // lets say it is the main structure root
	$content['body_id'] = $LEVEL_ID[1];
	$content['body_class'] = $LEVEL_ID[2] .' my_thirdlevel_'. $content['body_class'] = $LEVEL_ID[3] .' mysingle_'. $content['cat_id'];
	//;
} else { // do nothing
   $content['body_id'] = false;
}
?>

and in conf.template....

Code: Select all

// this is used to inject <body> Tag by attribute "id" and/or "class"
// if value is empty '' body tag will not be injected, otherwise it will use
// current category "valueID"
$template_default['body']['id'] = 'my_mainid_';
$template_default['body']['class'] = 'my_secondlevel_';

this will give an output similar to

Code: Select all

<body id="my_mainid_11" class="my_secondlevel_14 my_thirdlevel_29 mysingle_98">

Perhaps somebody has a better idea so come on

Jensensen · Post by **Jensensen** » Wed 2. Apr 2008, 23:26

claus wrote:...My body tag should look like
<body id="myid_11" class="myclass_16 myclass_67">...

why?
sorry --> too much numbers here?!?!?

In German: Hier legste aber einen vor?!?! Da steig ich nicht mehr durch....
(mein tipp: vergiss den sh..it mit den ID's bzw. Nummern - wirste bekloppt bei...)

You just want --> flags [any different #ID style] --> for the --> german --> english --> or else --> pages???

Jensensen · Post by **Jensensen** » Fri 4. Apr 2008, 19:06

Jensensen · Post by **Jensensen** » Fri 4. Apr 2008, 21:27

Jensensen · Post by **Jensensen** » Fri 4. Apr 2008, 22:54

Hmm, I worry that otherwise you'll "overkill" your CSS:

#myid_11.myclass_16.myclass_67 { styles: here; }
#myid_11.myclass_16.myclass_66 { styles: here; }
#myid_11.myclass_16.myclass_65 { styles: here; }
#myid_11.myclass_16.myclass_63 { styles: here; }
#myid_11.myclass_16.myclass_62 { styles: here; }
#myid_11.myclass_16.myclass_61 { styles: here; }

#myid_38.myclass_14.myclass_28 { styles: here; }
#myid_38.myclass_14.myclass_27 { styles: here; }
#myid_38.myclass_14.myclass_26 { styles: here; }
#myid_38.myclass_14.myclass_25 { styles: here; }
#myid_38.myclass_14.myclass_8 { styles: here; }

#myid_38.myclass_19.myclass_53 { styles: here; }
#myid_38.myclass_19.myclass_54 { styles: here; }
#myid_38.myclass_19.myclass_55 { styles: here; }
#myid_38.myclass_19.myclass_56 { styles: here; }
#myid_38.myclass_19.myclass_57 { styles: here; }
...

Post by **update** » Fri 4. Apr 2008, 23:49

what a lot of overwhelming work you do

To clarify again (this time some typografically one):
imagine different backgrounds:

Code: Select all

home---shoes---trousers---hats---punching balls---lecker-eis   [main level, these and all below these do have the same color]
white   green   reddish   red-   clear-yellow-   rainbow
  |        |      |         |          |           | 
  |        |      |         |          |           |__ erdbeer --> pink [this one is the only one]
  |        |      |         |          |           |__ vanilla ---> yellowish [this one is another only one]

Post by **update** » Fri 4. Apr 2008, 23:52

Jensensen · Post by **Jensensen** » Sat 5. Apr 2008, 00:27

Jensensen · Post by **Jensensen** » Sat 5. Apr 2008, 13:27

Tip for CSS
might be that you have to write it like this:

body#myid_7.oneclass.moreclass { styles: here; }

Post by **update** » Sat 5. Apr 2008, 13:49

claus wrote:We've had this discussion already: viewtopic.php?f=1&t=15452& but I haven't been able to follow OGs suggestions to achieve my goal...

Well it would be rather kind of optimal

if I could call the classes without changing the id into class (in index.php). but perhaps I don't get the picture Oliver is drawing

Jensensen wrote:apply to the site structure level which holds 'hats' (and all its subcats)
a) without change of index.php
$template_default['body']['class'] = 'hats my_class_id_';

Will that not render id into the root id thus rendering it into id_useless

Boy this is rendering myself into some kind of

now

Jensensen · Post by **Jensensen** » Sat 5. Apr 2008, 23:53

[EDIT]re-edited[/EDIT]

wie bei den öffentl-rechtl. --> leider nur 7 tage lang einsehbar.

pepe · Post by **pepe** » Sun 6. Apr 2008, 00:05

Hi Jensensen,

KEEP COOOOL!

Nicht den Nerv verlieren, nur weil jemand deinem Gedankenfluss nicht "ganz so leicht" folgen kann!
Ganz unberechtigt ist der Einwand ja nun nicht ... aber wer wird denn da gleich "das Gewehr in's Getreide" schmeissen???

Jetzt singen wir erst mal gemeinsam: "We shall overcome"... und dann ist doch auch wieder alles OK

body IDs and classes

body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes

Re: body IDs and classes