Get some posts on the home bigger than the other

  • Hi everyone!

    I’m trying to develope my one wordpress theme, and i can’t figure out how i should do to make some posts on the home page bigger than the rest.

    Lets say that i want to display 15 posts on the home page.

    The latest post should be big. Something like, 550px in width, and 300px in height.

    Then i want to make post nr 2 to 4 like 550px and 200px..

    And finaly, i want the rest of the posts (10 posts) in the size 550x100px.

    Is this possible? And, can someone help me?

    Best regards,
    Fredrik Jonsson

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter jonssondesign

    (@jonssondesign)

    Anybody?

    I’ve never had to do something quite like that before (beyond modifying just the first post, where I used this technique).

    This depends on whether you want to change only the look or the actually output of these (e.g. are you showing thumbnails and an expert in only some of the posts).

    If you’re using the same content and just changing the styles, I would probably use the :nth-child CSS selector. As an example:

    .post {width: 550px; height:100px;} /* the default height */

.post:first-child { height:300px; } /* overrides height of first article */

.post:nth-child(2),.post:nth-child(3),.post:nth-child(4) { height:200px; } /* overrides height of articles 2-4 */

    If you actually need to modify the output, I would probably use query_posts (and the offset parameter) to run three loops based off the main home page query and then alter the content and classes of each to allow CSS styling of the different sections.

    Good luck!

    Thread Starter jonssondesign

    (@jonssondesign)

    @mrwweb Well, i think what you explaned will work.. I will try this and come back to confirm it!

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Get some posts on the home bigger than the other’ is closed to new replies.