WordPress.org

Support

Support » How-To and Troubleshooting » [Resolved] Dynamic css class on a Post

[Resolved] Dynamic css class on a Post

  • Hi, I have a masonry layout on my page and I’m using it to preview a blog posts. It has a max width of 300px and everything, of course is 300px in width and it’s working fine. However, I have a class in my CSS called “featured” and it has a width of 600px and I want to put it in whatever post that I want to feature.

    As of the moment, I have “box” class in all of my blog entries and I want to be able to add a “featured” class via wordpress post editor so that the layout will have a 600px box instead of having only 300px. Is this possible? And how would I do this.

    Thanks so much for the help.

Viewing 5 replies - 1 through 5 (of 5 total)
  • various possibilities:

    a – you could use a category or tag ‘featured’ for the post; and add the css class .featured depending on that;

    b – you could use a custom field to mark ‘featured’ posts; and use that to add the css class .featured.

    what is the current code for the post div?

    example for a (assuming the post has the category ‘featured’, and a fairly standard post div with post_class()):

    <div id="post-<?php the_ID(); ?>" <?php post_class(array('box',(in_category('featured')?'featured':''))); ?>>
    <!--whatever post outputs-->
    </div>

    A refined explanation can be found here:

    How to Style Each WordPress Post Differently

    my solution:

    enable your custom field and put a key: class and value: featured
    on your post that you want to feature.

    in your index.php wherever you put your blog listing, do this:

    in your div class, put this:

    <div class=”<?php $value = get_post_custom_values(“class”); if ( is_array($value) ) echo “featured”; else ?> <?php echo ”; ?>”>

    finally, style your .featured

    .featured
    {
    width:500px;
    }

    I think I am asking the same thing, but can you let me know if I am (sorry – it’s been a long day and I’m not particularly tech, but I’m trying):

    I wonder if anyone has any idea how to vary the content width of a post?

    This post, for example, has a long body of text that I would like to make into columns that are the same height as the images (so people don’t have to scroll vertically as well as horizontally).

    http://www.gemmarose.com.au/tanja

    If I make the standard post wider then the other posts with less content are really far away from the images (see here for a post with less content):

    http://www.gemmarose.com.au/red-centre

    Is there a way that I can make the content area dependant on the amount of content – I feel fairly comfortable creating columns, just not varying the content width to suit.

    Otherwise is is possible that I set up different post templates with various widths – so for example if I wanted a four column post I could choose a different template and make the columns myself?

    Thanks,
    Gemma

    @gemmarose

    please start your own topic, as you question is not exactly the same as the current topic.

    Thanks, I will.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘[Resolved] Dynamic css class on a Post’ is closed to new replies.
Skip to toolbar