How to display following posts titles in separate div's on a separate webpage

Question

Intro: I have a webpage that is not part of wordpress. I have incorporated the wp blog posts, by putting The Loop in the page's code. This works, it displays the current posts and their following posts up to 3, which is what I set in the wp general options.

On this, non-wp, webpage, I have a sidebar, dubbed "history". Within history I have multiple div boxes, each that I want to contain the last, then next last, and continuing until these divs run out of room in the history div. This is meant to be a dynamic list (with custom images, irrelevant to the question) of blog post titles, a history of posts.

What I have so far: On the first div, in history, I have copied the code from The Loop (that I had copied onto this non-wp webpage). At the top of the page I have "php require('mydomain/xdirectories/home/wp-blog-header.php'). I am able to display the title (and link) of the most recent post and that post's date. These are the only things I want. Here is what the code looks like (this is the first box/div, the second and so on are identical except for the php):

<div class="clean" style="width:132px; height:56px; float:left;">
                <p class="style8" style="width:132px; height:14px;">
                    <?php the_time('F jS, Y') ?>
                </p>
                <p class="style8" style="width:132px; height:42px; 
                text-align:center; font-size:13px; vertical-align:middle;">
                    <span title="Opens in new tab">                         
                        <a href="<?php the_permalink() ?>" target="_blank" rel="bookmark" title="Permanent Link to 
                        <?php the_title_attribute(); ?>">
                        <?php the_title(); ?>
                </a>
                    </span>
                </p>
            </div>

Above is one div, box, that I want to have many of, only with the entry titles of each previous post.

Problem: I cannot figure out how to have the next title, link, and date for any wp blog posts past the first.

Question: How can I get the functions/"php codes" to input into each following div so that it can dynamically generate the second post title, date, and link. Then the third, and so on. Please note, I understand very little of php. I have tried using "the function" codes but it displays nothing. I've put different "php require('x/x/x.php') but more often than not there is an error. What wp page can I refer to with php that has the functions I need? How can I use those?

I need: title, date, link to that post of all the previous posts, dynamically generated so the topmost div always displays the more recent, etc.

Edit: to clarify, I'm looking for a wp php function I can use such as "post title x" where x is the number of the post behind the first. For example, the second box will have "post title 2", the third "post title 3" so it will generate that post title, date, link.

I am sorry if this question is amateurish. Thank you.

Answer 1

You have to loop through that part of the code to get more posts:

$args = array(
    'posts_per_page' => -1
);
$the_query = new WP_Query( $args );
<?php if ($the_query->have_posts()) : ?>
    <?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
        ...<your code>...
    <?php endwhile; ?>
<?php endif; ?>