Treehouse: Grow your CSS skills. Land your dream job.

Last updated on:

ID the Body Based on URL

<?php
	$url = explode('/',$_SERVER['REQUEST_URI']);
	$dir = $url[1] ? $url[1] : 'home';
?>

<body id="<?php echo $dir ?>">

This would turn http://domain.tld/blog/home into "blog" (the second level of the URL structure). If at the root, it will return "home".

Here is an alternate method:

<?php
       $page = $_SERVER['REQUEST_URI'];
       $page = str_replace("/","",$page);
       $page = str_replace(".php","",$page);
       $page = str_replace("?s=","",$page);
       $page = $page ? $page : 'index'
?>

This would turn http://domain.tld/blog/home into "domaintldbloghome", which is far more specific. It also will remove ".php" file extensions and the default WordPress search parameter.

More Secure Method

function curr_virtdir($echo=true){
        $url = explode('/',$_SERVER['REQUEST_URI']);
        $dir = $url[1] ? $url[1] : 'home'; // defaults to this if in the root
        $dir = htmlentities(trim(strip_tags($dir))); // prevent injection into the DOM through this function
        if ($echo) echo $dir;
        return echo $dir; // ie. curr_virtdir(false)
}
function get_curr_virtdir(){
        curr_virtdir(false);
}

Returns the "middle" directory value:

On http://css-tricks.com it would return "home"
On http://css-tricks.com/snippets it would return "snippets"
On http://css-tricks.com/forums/viewforum.php?f=6 it would return "forums"

The strip_tags() and htmlentities() functions prevent malicious code from being insterted into the URL and ran, e.g.

<body id="foo"><script>alert("Booo");</script>

Usage for IDing the body:

<body id="<?php curr_virtdir(); ?>">

Other usage:

<?php
  if ( get_curr_virtdir() == "store" ){
    echo "Welcome to our awesome store !";
  } elseif ( get_curr_virtdir() == "home" ){
    echo "Welcome home :-)";
  } else {
    echo "Welcome on some other page";
  }
?>

Comments

  1. Ant

    Hmm, I used simplier code, without throught on security. I should reconsider this.

  2. Mike
    Permalink to comment#

    This was very helpful. Im using the alternate method (second one from the top). How would I keep the id selector to the first two directories. Say I have: domain.com/products/ramps/singlefoldramps.html
    Would return id=”productsramps” and not use the third dir in the id tag?

  3. Steffen
    Permalink to comment#

    I tend to use the . This also gives a lot of usefull information, similar to theese examples:
    http://codex.wordpress.org/Template_Tags/body_class

  4. Biscutty
    Permalink to comment#

    Getting a syntax error on line6 of the secure version:

    return echo $dir; // ie. curr_virtdir(false)

    Any ideas?

  5. Biscutty
    Permalink to comment#

    Removed the “echo” – seems to have sorted it.

    function curr_virtdir($echo=true){
    $url = explode(‘/’,$_SERVER[‘REQUEST_URI’]);
    $dir = $url[1] ? $url[1] : ‘home’; // defaults to this if in the root
    $dir = htmlentities(trim(strip_tags($dir))); // prevent injection into the DOM through this function
    if ($echo) echo $dir;
    return $dir;

  6. Edmundo Junior
    Permalink to comment#

    None of this tips works for me, can you help me guys?

    My problem is, I have a site with two subdirectorys, I wanna output

    example.com/dir1/dir2
    example.com/dir1/dir2/dir3

    The second and third directories always change. How can the ID be just the second directory (dir2)?

    Thank you in advance!

  7. FragaGeddon
    Permalink to comment#

    Any way to get rid of the .php from the body id?

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in in triple backtick fences like this:

```
<script>
  function example() {
    element.innerHTML = "<div>code</div>";
  }
</script>
```