Grow your CSS skills. Land your dream job.

Target pages in WordPress?

  • # February 21, 2011 at 1:00 pm

    How can I target pages with CSS in WordPress. I would like to spec different styles in the index.php, single.php, archive.php etc.

    Those pages don’t have a unique opening body tag.

    # February 21, 2011 at 1:09 pm

    Have you set up your body tag like this:

    >

    Because that will spit out all of the selectors you could need.

    # February 21, 2011 at 1:13 pm

    YES!

    How do I get started? I know very little about php.

    # February 21, 2011 at 1:16 pm

    Find your header.php file, that’s where you should have the body tag.

    Simply replace:

    with:

    >

    And check the results on your website.

    # February 21, 2011 at 1:31 pm

    Do I have to target the whole class?

    or can I just use archive or single etc.?

    # February 21, 2011 at 1:42 pm

    You can target whichever you like!

    If you want to target the category “marketingbytes”, for example, you could do this in your css:

    .category-marketingbytes #wrapper #content a {
    color: blue; /* Marketing Bytes links will be blue! */
    }
    # February 21, 2011 at 1:54 pm

    What about just “archive” or “single?”

    .archive h2 {}
    # February 21, 2011 at 1:58 pm

    That would work fine, too.

    So ‘.archive h2′ would target all h2’s within any archive page.

    single.php is used for posts, page.php is used for pages, etc etc.

    # February 21, 2011 at 2:06 pm

    That’s great. Thank you!

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

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