Horizontal Posting

  • Harvey

    (@harvey)


    21 years, 2 months ago

    Hello everyone.

    I am considering moving to WordPress from MoveableType.

    One question, along with my new site move, I want to consider a new design, want to check if it is possible with WordPress.

    Instead of the usual vertical scrolling with the addition of new posts, I would like the blog to behave horizontally.

    It would be organized in 4 columns. New entries on the left. Each column bein gone blog entry.

    ———————————————
    [ post 1 ][ post 2 ][ post 3 ][ post 4 ]
    […………..][………..][………..][………..]
    […………..][………..][………..][………..]
    […………..][………..][………..][………..]

    Like this!

    I know it’s going to be tough to pull off as far as screen real estate goes… but is this technically feasible with WordPress?

    Thanks for any tips!

Viewing 8 replies - 1 through 8 (of 8 total)
  • joeedmon

    (@joeedmon)

    21 years, 2 months ago

    Should be real simple to setup using a table and cells. There would be 1 row, and every post would be a cell. Outside the loop you would place your table and row tags. The TD tags would be inside the loop.

    I’m sure this could be done in CSS also, but probably a lot more difficult and harder to make work across browsers.

    You will want to limit the number of posts that display, the setting is in the options somewhere.

    Thread Starter Harvey

    (@harvey)

    21 years, 2 months ago

    Inside the loop?

    I haven’t touched WP yet, but I am familiar with Moveable Type. I imagine there is some place in the GUI for WP that I can go in and modify the code to insert the TD tags I need into the loop which is generating each post?

    Could you show me what the code in that area would look like, so I can know when I’m looking at the right place?

    Thanks again. I’ll get started with the installation.

    -Harvey

    Mark (podz)

    (@podz)

    21 years, 2 months ago

    There is someone who has done this …….. looks funky .. and I’ll be damned if I can remember .. I shall hunt around

    Thread Starter Harvey

    (@harvey)

    21 years, 2 months ago

    I got WP installed no problem. In fact, it was much easier than I thought.

    I’m sure you hear that a lot though.

    Going to dig around the menus to find where I need to tinker in order to get this to work.

    —Edit—

    I was looking around, it feels like index.php is the file I will need to edit to get this… But there is hardly anything in there at all! Where’s all the code that makes this go?

    wp-blog-header.php Perhaps?

    joeedmon

    (@joeedmon)

    21 years, 2 months ago

    Inside the loop…

    WordPress is very easy to setup and use. If you follow all the directions you really can be blogging in 5 minutes. It’s when you want to do something special that you need to learn stuff.

    The Loop is the PHP code that displays your blog posts. It is just a loop that runs as many times as the number of posts you want to display.

    The file that contains the Loop is title “index.php”, but it’s not the file that you found. Assuming you are using the default install, you will find the file you actually need at “/wp-content/themes/default/index.php”. The wp-content folder should be sitting at the same place you found the first index.php file (don’t alter that file by the way).

    I’ll come back a little later on with some sample code you can use to create your table. By the way, this can probably be done in CSS, without tables, but I’ve had enough bad experiences in CSS that I wouldn’t attempt it.

    joeedmon

    (@joeedmon)

    21 years, 2 months ago

    Here is a quick and dirty code sample for a table. I haven’t checked it out, so I’m sure there’s some stupid mistake (maybe even 2 or 3) in it somewhere. Also note that for clarity’s sake I have removed a lot of code that is normally in there, like the date and other meta information. It should be easy to put that stuff back in.


    <table>
    <tr>
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
    <td>
    <div class="post">
    <h1 class="storytitle" id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h1>
    <?php the_content(__('(more...)')); ?>
    </div><!--post-->
    </td>
    <?php endwhile; else: ?>
    <p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
    <?php endif; ?>
    </tr>
    </table>

    Thread Starter Harvey

    (@harvey)

    21 years, 2 months ago

    Got it 🙂

    <?php get_header(); ?>

    <div id=”content” class=”narrowcolumn”>

    <!– BEGIN TABLE –>
    <TABLE BORDER = 1>
    <TR>

    <?php if (have_posts()) : ?>

    <?php while (have_posts()) : the_post(); ?>

    <TD><!– BEGINNING OF ONE POST –>

    <div class=”post”>
    <h2 id=”post-<?php the_ID(); ?>”>” rel=”bookmark” title=”Permanent Link to <?php the_title(); ?>”><?php the_title(); ?></h2>
    <small><?php the_time(‘F jS, Y’) ?> <!– by <?php the_author() ?> –></small>

    <div class=”entry”>
    <?php the_content(‘More »’); ?>
    </div>

    <p class=”postmetadata”>Posted in <?php the_category(‘, ‘) ?> | <?php edit_post_link(‘Edit’,”,’|‘); ?> <?php comments_popup_link(‘No Comments »’, ‘1 Comment »’, ‘% Comments »’); ?>

    <!–
    <?php trackback_rdf(); ?>
    –>
    </div>

    </TD> <!– END OF ONE POST –>

    <?php endwhile; ?>

    <div class=”navigation”>
    <div class=”alignleft”><?php posts_nav_link(”,”,’« Previous Entries’) ?></div>
    <div class=”alignright”><?php posts_nav_link(”,’Next Entries »’,”) ?></div>
    </div>

    <?php else : ?>

    <h2 class=”center”>Not Found</h2>
    <p class=”center”><?php _e(“Sorry, but you are looking for something that isn’t here.”); ?>
    <?php include (TEMPLATEPATH . “/searchform.php”); ?>

    <?php endif; ?>

    </TR>
    </TABLE><!– END TABLE –>

    </div>

    <?php get_sidebar(); ?>

    <?php get_footer(); ?>

    lokjah

    (@lokjah)

    21 years, 2 months ago

    why tables?

    you can do this with divs, give stylegala a visit and check how he did the 4col bit….

    http://www.stylegala.com/?screen=wide

Viewing 8 replies - 1 through 8 (of 8 total)

The topic ‘Horizontal Posting’ is closed to new replies.