Grow your CSS skills. Land your dream job.

active state page question (solved)

  • # December 7, 2008 at 11:53 pm

    hello all, the question that i have is in refernce to the following link
    http://css-tricks.com/forums/viewtopic.php?f=2&t=408&p=1930&hilit=wordpress+active+page#p1930

    im basicly trying to do the same thing, the only difference is that im attempting to do this using wordpress with a custom template called photo.php which consist of the following code

    Code:
    < ?php
    /*
    Template Name: photos
    */
    ?>

    < ?php get_header(); ?>

    < ?php if (have_posts()) : ?>
    < ?php while (have_posts()) : the_post(); ?>

    < ?php the_title(); ?>

    < ?php the_content(); ?>

    < ?php endwhile; endif; ?>

    < ?php get_footer(); ?>

    according to the link that i mentioned, chris describes how one first needs to create a body tag in the file. as you can see i included the tag <body="photo">, which im not certain whether the opening and closing are in the right place.

    second, this is the code that i have in my css file

    Code:
    ul.nav li.photos a:hover {
    width: 172px;
    background: url(images/navphotos.jpg) bottom no-repeat;
    }
    ul.nav li.news a:hover {
    width: 133px;
    background: url(images/navnews.jpg) bottom no-repeat;
    }
    ul.nav li.about a:hover {
    width: 148px;
    background: url(images/navabout.jpg) bottom no-repeat;
    }
    ul.nav li.contact a:hover {
    width: 224px;
    background: url(images/navcontact.jpg) bottom no-repeat;
    }

    /* ——————————————————— */

    body#photo ul.nav li.photos a {
    background-position: bottom no-repeat;
    }

    i believe that im referencing the body tag in my photo.php file, yet when i click on the link on the page. it do not remain in the active state color, which i should be referencing by pointing to background-position: bottom.

    is there something that im missing here? my rollover states and all are working fine, im just having problems with this active state page.

    ok after a few hours of searching the forum i finally figured it out. basicly i used the php method that chris did a video on putting this bit of code…

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

    Viewing 1 post (of 1 total)

    You must be logged in to reply to this topic.

Projects

Colophon

CSS-Tricks* is created, written by, and maintained by Chris Coyier. It is built on WordPress, hosted by MediaTemple, and the assets are served by MaxCDN. The fonts are Source Sans and Source Code Pro. It is made possible by viewers like you who subscribe to The Lodge and through advertising for products and services I like.

*May or may not contain any actual "CSS" or "Tricks".