EE Insider Tips
Sponsored by Mijingo's EE 2 Screencasts
ExpressionEngine mini-howtos created by the EE Insider community.
Dynamically Add a Body Id (or class)
- Posted by Trevor Davis
- June 17, 2009
- 5 people have found this tip helpful.
Typically when I am creating a site, I will use an ID on the body to denote which section I am in. Then, I will also add a class of subpage to all subpages as well.
For example, a subpage may look like this:
<body id="about" class="subpage">
And the homepage would look like this:
<body id="home">
So assuming I have a separate header embed that I include into every template, I want to have the flexibility to pass in the body id into the embed or to have it dynamically set depending on the segment_1 variable.
{embed="includes/header" body_id="someCustomValue"}
CODE FOR PAGE HERE
{embed="includes/footer"}
To do this in EE, this is what you need to do:
<body
{if embed:body_id}
id="{embed:body_id}"
{if:elseif segment_1}
id="{segment_1}"
{if:else}
id="home"
{/if}
{if segment_1}
class="subpage"
{/if}
>
Note: Line wrapping was added for legibility.
Here is that line without line wrapping:
<body{if embed:body_id} id="{embed:body_id}"{if:elseif segment_1} id="{exp:php_text_format type="lowercase"}{segment_1}{/exp:php_text_format}"{if:else} id="home"{/if}{if segment_1} class="subpage"{/if}>
That way you can easily use these values in your CSS to differentiate sections.
Email
Print
Post to Twitter
Post to Delicious
luxuryluke — 12:17 on 06.17.2009
YES!
More like this please!
One of the cool things Wordpress started doing years ago is classing the body with all sorts of up to date info, such as time of day, month, year, and all sorts of other random stuff. this opens up worlds of ideas (different css look for night time, holidays, etc.).
More, more!
Add Your Comment?
You must have an EE Insider account to post comments on Insider Tips. It's fast, easy and hassle-free.
Sign up now (or login).