web2feel.com – Free wordpress themes – Tutorials – Tips and tricks

Free WordPress Themes for everybody

Categories

Normally on a blog every post is styled uniform. But wont you think it would be nice if you could style these posts differently. One way to do it is to retrieve the post-ID and then apply style to it. But it is a painstaking process and you would have to repeat the css edit every time a new post is made. Here I am concentrating on a different method. It is by exploiting the post_class(); feature added to WordPress since 2.7. The post loop markup using post_class(); features is given below.

<div> id="post-"&gt;</div>

The post_class() generates dynamic class names for each post. They are,

  1. .post ( default class assigned to posts)
  2. .hentry ( hAtom microformat pages)
  3. .sticky
  4. .category-x ( x is the category slug )
  5. .tag-x ( x is the tag name )

For example ,if you have a post assigned to a category named “games”, that particular post will have a generated class called .category-games. You can style all posts belonging to the “games” category with a different style.

.category-games{
      background:#fff;
      border:1px dotted #ff0000:
}

Following the same example you can style all your sticky posts and post with tags differently. I am using a similar techniques on my site to give different color ribbons on posts.

Leave a Reply

  1. bb says:

    That’s really useful, thanks.
    Keep on updating.

  2. rbl says:

    that is what I looking for
    thank you!

  3. JC says:

    Thank you Jinsona
    keep up the updates and happy you got your website up and running again

  4. Thank you for the details

  5. Lewis says:

    That’s really useful. I might try to implement this on my site.

    If I have a category named Love & Relationships with a slugline love-relationships then what do I use for the class name

    e.g. Is it: .category-love-relationships
    .category-love&relationships
    .category-love-&-relationships

    This is probably a stupid question but I am STUPID when it comes to CSS.

  6. Cdinsky says:

    Great suggess. Thanks!

    It would be great to be able to create posts / pages that dont’ have left or right columns. Large space for big images. : )

    Your themes are some of the best ever. But someone says there’s possibly malware in the footers according to Google… Hope they’re wrong!

    Happy New Year All!

  7. Ajay Patel says:

    yes yes … i want that ….. really gr8….

    keep updating this type tips….

    its really help full

  8. zerbbi says:

    hi, is this possible to do with pages? so one page can have different style than other?

Feature your theme here

Sponsors

  • Theme forest
  • Gator
  • Your Ad Here
  • Your Ad Here
  • Your Ad Here

Recent Uploads

Wow!!! Browser giant Mozilla caught pants down plagiarizing MetaLab's design.

Contact Me

Your Name (required)

Your Email (required)

Subject

Your Message

4+1=?