WordPress Blog List Page (with Foundation classes)

blog-list-page.php

<?php /* Template Name: Blog List Page */ ?>

<!-- create a WordPress Page and set this as the template -->

<?php get_header(); ?>

<?php
  $args = array(
    'post_type' => 'post',
    'post_status' => 'publish',
    'posts_per_page' => 10,
    'paged' => get_query_var('paged'),
  );
?>
<?php query_posts($args); ?>
  <?php if( have_posts() ): ?>
    <div class="grid-container blog">
      <?php while( have_posts() ): the_post(); ?>

        <div class="blog__item">
            <div class="grid-x grid-margin-x">

              <div class="cell small-12 medium-6 large-3 blog__image">
                <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail( array(600, 600) ); ?></a>
              </div>
              <div class="cell small-12 medium-6 large-9 blog__content">
                <div id="post-<?php get_the_ID(); ?>" <?php post_class(); ?>>
                  <h3 class="blog__title title title--small-section title--small-section--sub"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
                  <div class="blog__date">
                    <?php echo get_the_date(); ?>
                  </div>
                  <div class="blog__categories">
                    [ <?php echo the_category(' | '); ?> ]
                  </div>
                  <?php the_excerpt(__('Read More','example')); ?>
                  <a href="<?php the_permalink(); ?>" class="button">Read More</a>
                </div><!-- /#post-<?php get_the_ID(); ?> -->
                <div class="blog__tags">
                  <?php echo the_tags('',''); ?>
                </div>
              </div>

            </div>
        </div>

      <?php endwhile; ?>
    </div>


    <!-- Pagination -->
    <div class="grid-x grid-margin-x">
      <div class="cell">
        <div class="blog-navigation">
          <?php if( get_previous_posts_link() ) : ?>
            <span class="button newer"><?php previous_posts_link(__('« Newer','example')) ?></span>
          <?php endif; ?>

          <?php if( get_next_posts_link() ) : ?>
            <span class="button older"><?php next_posts_link(__('Older »','example')) ?></span>
          <?php endif; ?>
        </div>
      </div>
    </div>
  <?php else: ?>
    <div class="grid-x grid-margin-x">
      <div class="cell">
        <div id="post-404" class="noposts">
          <p><?php _e('None found.','example'); ?></p>
        </div><!-- /#post-404 -->
      </div>
    </div>
  <?php endif; wp_reset_query(); ?>


<?php get_footer(); ?>