 one of the first things i do when i am creating the markup for a new site is to set a body id you may wonder what i mean when i say set a body id what i mean is to dynamically check the url to figure out which section you are in this tutorial will show how to do this dynamically using php and also how to integrate it into wordpress why should i set a body id there are plenty of reasons why you should here are a few maybe your design has different colors depending upon which section you are in instead of having to touch the markup you can just modify the css depending upon the id on the body you can control the current states for your navigation maybe the markup on your homepage is a little different than subpages so instead of creating a different template just stick in an if statement setting up the code so typically you setup your navigation to match your directory structure ex top level navigation is about and there is a folder on the root called about so the easiest thing to do is just check the url and determine which section you are in this is the code that sets the body id on my site php function setbodyid $path = $ server request uri if isset $bodyid if eregi about $path == 1 $bodyid = about else if eregi blog $path == 1 $bodyid = blog else if eregi contact $path == 1 $bodyid = contact else if eregi work $path == 1 $bodyid = work else if eregi play $path == 1 $bodyid = play else if $path == $bodyid = home else $bodyid = general return $bodyid sure you could do this dynamically and pull in the top level folder from the url but i have found there are too many situations that arise where you want multiple sections to have the same body id or you want to set other variables section by section so i stick with this method and it has been successful my example my example is going to be a little different because it is in a subsection of my site so here is the code i am using to control setting the body id in the example php function examplesetbodyid $path = $ server request uri if isset $bodyid if eregi play set a body id about $path == 1 $bodyid = about else if eregi play set a body id blog $path == 1 $bodyid = blog else if eregi play set a body id contact $path == 1 $bodyid = contact else if eregi play set a body id work $path == 1 $bodyid = work else if eregi play set a body id play $path == 1 $bodyid = play else if $path == play set a body id $bodyid = home else $bodyid = general return $bodyid $bodyid = examplesetbodyid so in the $bodyid variable you have the value of the body id so just print the variable on the body tag body id= =$bodyid some practical uses as i discussed at the beginning of the post there are a lot of benefits to having a body id set on every page this is the demo section that i am discussing below different colors per section if you click through the navigation in the example you can see the colors are different for each section this can be easily accomplished without changing any markup through the power of descendant selectors here is the part of the css that is controlling the color of the borders div content border 1px solid 000 ul nav border top 1px solid 000 body home div content body home ul nav border color ff6600 body about div content body about ul nav border color 429c19 body blog div content body blog ul nav border color 54d0ed body work div content body work ul nav border color a81919 body play div content body play ul nav border color 400152 body contact div content body contact ul nav border color f8dc0c here is the part that is changing the color of the h1 body home h1 color ff6600 body about h1 color 429c19 body blog h1 color 54d0ed body work h1 color a81919 body play h1 color 400152 body contact h1 color f8dc0c pre code pobviously this is not the most beautiful example but hopefully the idea makes sense p h4current state on navigation h4 pthere are different ways to set the current state on the navigation but by assigning an id to each navigation element you can use descendant selectors again here is the markup p code ul id= nav li id= homenav a href= play set a body id home a li li id= aboutnav a href= play set a body id about about a li li id= blognav a href= play set a body id blog blog a li li id= worknav a href= play set a body id work work a li li id= playnav a href= play set a body id play play a li li id= contactnav a href= play set a body id contact contact a li ul then we use the following css to change the background color and text color when we are in that section body home ul nav li homenav a background ff6600 body about ul nav li aboutnav a background 429c19 body blog ul nav li blognav a background 54d0ed body work ul nav li worknav a background a81919 body play ul nav li playnav a background 400152 body contact ul nav li contactnav a background f8dc0c body home ul nav li homenav a body about ul nav li aboutnav a body blog ul nav li blognav a body contact ul nav li contactnav a color 000 body work ul nav li worknav a body play ul nav li playnav a color fff slightly different homepage markup typically the markup for homepages are slightly different but if you are using one header and footer template for the entire site you probably dont want to create another template just for the homepage so since we have the body id that tells us when we are on the homepage we can just write a simple if statement php if $bodyid == home hellip put your homepage specific elements herehellip php make it work with wordpress so just take the setbodyid function that we defined earlier and add it to your wordpress theme functions functions php after you have added the function we want to add actions to wp head and wp footer for some reason there isnt a wordpress hook reference for wp footer but it is essentially the same as wp head just in the footer here is how we add our function to those hooks add action wp head setbodyid add action wp footer setbodyid then in your header just call the wp head hook and call our function php wp head $bodyid = setbodyid there you have it you have the body id defined in the $bodyid variable and you can do with it what you want other thoughts i think by setting an id or class on such a high level element gives you a lot of control over its descendants another interesting idea that i heard was to use jquery to determine the browser and version that the user is using then add a class on the body that way you could differ your css depending on which class is on the body that idea would eliminate the need for conditional comments at least for users with javascript enabled so hopefully this tutorial shows you an easy way to make some site wide tasks simpler and i am interested to see if other people have ideas for what to do with body ids 