WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] anyone ever seen a blog where posts displayed inline 3 in a row? (27 posts)

  1. flush
    Member
    Posted 7 years ago #

    I'm trying to have a page where posts would display inline, in lines of 3, then drop and start a new line. (its to display images, all of the same size)
    Has anybody seen something like that? I'd like to talk to someone who's actually done it.
    Thanks

  2. Nebelmond
    Member
    Posted 7 years ago #

    you can float them and clear the float after every third post

  3. flush
    Member
    Posted 7 years ago #

    Thanks Nebelmond,
    Have you actually seen it working on someone's blog?

  4. whooami
    Member
    Posted 7 years ago #

    ive seen it done. more than once, and its not hard to do. Its all CSS.

    You dont need to talk to someone, you need to learn how how to utilize CSS

  5. flush
    Member
    Posted 7 years ago #

    Do I need to create a style sheet specifically for this page or can I insert the style of this page in the original style.css?

  6. samaritan
    Member
    Posted 7 years ago #

    Flush:

    I am interested in the same thing, and I was about to *ahem* flush out the details. I don't think it is a matter of only CSS, so I will post back here if I find anything.

  7. whooami
    Member
    Posted 7 years ago #

    it is most certainly a matter of just CSS. the wordpress loop, for instance, has absolutely nothing to do with display, just content. What you use to display whats inside the loop is controlled by CSS.

    Take a gander at some of the photo sites that use wp -- quite a few of them utilize horizontal posts and in fact, Ive seen atleast two that actually scroll horizontally. Thats just CSS.

    doesnt matter whats "in" the loop -- content is content, whether its an image or an essay.

    there is a difference between structure and style.

  8. flush
    Member
    Posted 7 years ago #

    Yes but for example css won't control the clearing of the floating of the divs after every third post to start a new line. I have to do that in a new php page template I suppose?
    I think that what I'm trying to get is more difficult than just a horizontal scroll.
    Samaritan, Doodlebee has given me some advice in a previous post that might be to you (there are still things I don't understand because I don't know css)
    http://wordpress.org/support/topic/85451?replies=16#post-438200

  9. vkaryl
    Member
    Posted 7 years ago #

    Huh? All you do is set up a clearer class and add it to that particular post element. It's still just css.

  10. flush
    Member
    Posted 7 years ago #

    oh... ok... a clearer class.
    Hadn't thought of that. So I could end every third post with that.
    How do I include the css in my style.css to have it apply to that particular page template only?

  11. vkaryl
    Member
    Posted 7 years ago #

    Well, yah.... for stuff like this kind of css specific info, you really need to google css help or something like and try some of the sites returned.

  12. flush
    Member
    Posted 7 years ago #

    Yes I'm doing that too.
    If I clear the divs by calling a css class at the end of every third post, I don't need to put anything regarding the clearing in the page template's php file?

  13. samaritan
    Member
    Posted 7 years ago #

    Flush:

    Yes, I looked at that. I am still not sure that will do exactly what we want. I am looking at this:

    http://rhymedcode.net/1001-wordpression-loops/grouped-by-category/

    But using the same category for each, and adding an offset to the get_posts() call for each subsequest row. In order to display all posts, you would need to continue incrementing a counter, and I am not sure how to do that in php yet.

    It is frustrating that other commentors continually assert that it can be done, and easily, but cannot provide any examples to work with. The one that you link to is basic, but does not acually show how it could be done in WordPress. The part that is not being explained is how to actually output 3 post groups in the template, since the loop handles one. The alternatives that I have seen for controling the number of posts are being used for displaying multiple categories, not for formating a number of posts in the same category.

  14. flush
    Member
    Posted 7 years ago #

    Wouldn't another solution be like Vkaryl said to force manually to start a new row by calling a clearer class in the last post of the row? (does that make sense?)
    That would bypass the 3 post problem, wouldn't it?
    But I thought Doodlebee dealt with this issue in his example by naming post1,2,3 and then clearing the divs in the custom php page template, so that normally every 3 posts, the divs would be cleared and a new row would begin (...in a theoretical Wonderland of course, reality might not be that simple)

  15. moshu
    Member
    Posted 7 years ago #

    Just for the record: I don't think anything trying to show more than ONE would work in a Page template. Pages are meant to display only one single "content".

  16. samaritan
    Member
    Posted 7 years ago #

    How does the class="post < ? php whatever the post code is here ? > " > do anything? It might number the post, but how does it actually make the post output a new post? That is the part that seems to be a problem. How do you format three different posts if your loop only outputs one?

    In my case, I am using a category template to display the excerpt image for posts in a given category. The excerpt links to the post.

    Again, I think the problem is in the loop, and the fact that the standard loop only formats one post at a time. This is why I think a modified loop that grabs 3 posts at a time, and uses offsets might work better, although it would add complexity to the code.

    If I am totaly wrong, please provide examples of a standard loop allowing formatting of a specific number of posts (ie. inserting a seperator between posts 5 and 6, or hilighting every 8th post).

    I think we have made it clear that we are trying to do something we are not sure how to do, so telling us that it can be done is just not quite enough. The original post asks for examples of blogs that do this, and so far no one has been able to point to any.

  17. flush
    Member
    Posted 7 years ago #

    Yes, all I have found were horizontal layouts, not once have I found a blog where the horizontal line dropped to start a new line.

  18. samaritan
    Member
    Posted 7 years ago #

    I am going to start working on a modified loop category template, that displays 3 thumbnail images in a row, and has 12 items on a page. It will use 4 (or less, depending on the number of posts in a category) get_posts(“category=10&numberposts=3″) calls with each next call including "&offset=x" where x is the number of posts that have already been output.

  19. Chris_K
    Member
    Posted 7 years ago #

    @samaritan
    If I am totaly wrong, please provide examples of a standard loop allowing formatting of a specific number of posts (ie. inserting a seperator between posts 5 and 6, or hilighting every 8th post).

    You mean like the countless examples of Loops that insert adsense code after every x posts? For instance: http://www.tamba2.org.uk/wordpress/adsense/

    Adding a counter and if statement is all that's going on there. You don't need to fetch x articles at a time.

  20. samaritan
    Member
    Posted 7 years ago #

    Thank you! That is what I was looking for. In that case, I could find out if postnum is devisable by 3 and add a CSS clear element. Right?

  21. samaritan
    Member
    Posted 7 years ago #

    Or, I suppose that if the postnum == 3 it could be reset to 1, rather than continually incrementing.

  22. samaritan
    Member
    Posted 7 years ago #

    I set $postnum = 1; $columns = 3; after header, but before have_posts().

    After the post itself, I have:

    if ($postnum == $columns) {
    echo '
    < css clear element using hr >
    ';
    $postnum = 1;

    } else $postnum++;

    (enclosed in php script tags, of course)

  23. samaritan
    Member
    Posted 7 years ago #

  24. samaritan
    Member
    Posted 7 years ago #

    I have a gallery_item class in my stylesheet:

    #content .gallery_item {
    float:left;
    width:185px;
    }

    At some point I may add a gallery specific id and move the gallery_item class

  25. flush
    Member
    Posted 7 years ago #

    Finally solved this issue that turned out to be simple thanks to the guys at the CSSCreator forums.
    I'll just link to the thread: http://www.csscreator.com/node/18253

  26. vkaryl
    Member
    Posted 7 years ago #

    Hmmm. And you (as well as the folks on that forum) think that the wp forum should have done the css work for you? This is a wp forum NOT a css ditto. It's nice that you got your problem worked out, but the snide remarks are specious, superfluous, and snarky.

  27. flush
    Member
    Posted 7 years ago #

    !!? God knows what you're talking about vkaryl, but it's clear you're really snarky for that matter...
    I guess I just got confused by the forum title: Themes and Templates — XHTML and CSS

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.