CSS change based on the_time()?

  • I have been looking for a simple way to change either an entire CSS file, or a piece of the CSS based on the time.

    Looking at 1976 design’s example of attaching the header image to the weather results is fascinating, but really way overboard.

    I’d just like to determine the syntax for calling style sheet # 1 between 6am and 7pm
    and style sheet #2 between 7pm and 5:59am

    there are a lot of javascript snippets out there which promise to use the built in time features of java to place images, I tried changing that code to output a css link, but it doesn’t seem to work.

    There was once a simple solution here in the archives of a great example someone put together for doing exactly this, but either I can’t find it, or it got all cleaned up and is gone.

    Does anyone know how to exploit a conditional for the_time() ?

Viewing 5 replies - 1 through 5 (of 5 total)

  • Are we talking making your entire site appear different at different times of the day? If so, simple PHP will do the trick. No need to use any WordPress functions. ??

    Add this to your header:

    <link rel="stylesheet" href="<?php

    bloginfo('template_directory');

    echo "/";

    // Hours difference (+/-) your blog is from the server's time
    $offsetfromserver = 0;

    $thehour = date('G') + $offsetfromserver;

    if ($thehour >=6 && $thehour < 19) {
    echo 'stylesheet1.css';
    } else {
    echo 'stylesheet2.css';
    }

    ?>" type="text/css" media="screen" />

    Having your posts on the main page have different classes depending on what time they were posted is a different matter. Post is that is really what you meant and I’ll come up with some code for that.

    Thread Starter dss

    (@dss)

    Well, individual control would be really snazzy, but it’s just as easy to come up with a “night time” style sheet.

    Thank you!!!

    Well, basically, it’s the same kinda thing, except you use something like this:

    (this is inside The Loop mind you)

    <div class="<?php

    if (get_the_time('G') >= 6 && get_the_time('G') < 19) {
    echo 'post-daytime';
    } else {
    echo 'post-nighttime';
    }

    ?>">

    Thread Starter dss

    (@dss)

    Actually, this is a lot more interesting, and helpful.

    What changes outside the loop?

    Makes sense, i think, to address an indivicual class to make these changes. thank you so much for your help!

    Nothing is needed outside The Loop except class definitions.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘CSS change based on the_time()?’ is closed to new replies.