<style>
.gridcontainer h2 a{color: #333; font-size: 13px;}
.gridcontainer .griditemleft{float: left; width: 150px; margin: 0 30px 20px 0;}
.gridcontainer .griditemright{float: left; width: 150px;}
.gridcontainer .postimage{margin: 0 0 5px 0;}
.gridcontainer .postimage-title {text-align: center;}
</style>
<div class="gridcontainer" style="margin-top: -130px;">
<?php
// Grid Parameters
$counter = 1; // Start the counter
$grids = 2; // Grids per row
$titlelength = 30; // Length of the post titles shown below the thumbnails
// The Query
$args=array (
'post_type' => 'post',
'offset'=> 1 ,
'posts_per_page' => 10
);
$the_query = new WP_Query($args);
// The Loop
while ( $the_query->have_posts() ) :
$the_query->the_post();
// Show all columns except the right hand side column
if($counter != $grids) :
?>
<div class="griditemleft" style="margin-right: 192px;width: 25%;">
<div class="postimage" style="width: 205%;">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
</div><!-- .postimage -->
<h2 class="postimage-title" style="width: 205%;">
<a style="text-transform: uppercase;color:black;"href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php if (mb_strlen($post->post_title) > $titlelength)
{ echo mb_substr(the_title($before = '', $after = '', FALSE), 0, $titlelength) . ' ...'; }
else { the_title(); } ?>
</a>
<?php
$trimexcerpt = get_the_excerpt();
$shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 20, $more = '… ' );
echo '<a href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>';
?>
</h2>
</div><!-- .griditemleft -->
<?php
// Show the right hand side column
elseif($counter == $grids) :
?>
<div class="griditemright" style="width: 25%;margin-left: px;">
<div class="postimage" style="width: 205%;">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
</div><!-- .postimage -->
<h2 class="postimage-title" style="width: 205%;">
<a style="text-transform: uppercase;color:black;" href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php if (mb_strlen($post->post_title) > $titlelength)
{ echo mb_substr(the_title($before = '', $after = '', FALSE), 0, $titlelength) . ' ...'; }
else { the_title(); } ?>
</a>
<?php
$trimexcerpt = get_the_excerpt();
$shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 20, $more = '… ' );
echo '<a href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>';
?>
</h2>
</div><!-- .griditemright -->
<div class="clear"></div>
<?php
$counter = 0;
endif;
$counter++;
endwhile;
wp_reset_postdata();
?>
</div><!-- .gridcontainer -->
.gridcontainer h2 a{color: #333; font-size: 13px;}
.gridcontainer .griditemleft{float: left; width: 150px; margin: 0 30px 20px 0;}
.gridcontainer .griditemright{float: left; width: 150px;}
.gridcontainer .postimage{margin: 0 0 5px 0;}
.gridcontainer .postimage-title {text-align: center;}
</style>
<div class="gridcontainer" style="margin-top: -130px;">
<?php
// Grid Parameters
$counter = 1; // Start the counter
$grids = 2; // Grids per row
$titlelength = 30; // Length of the post titles shown below the thumbnails
// The Query
$args=array (
'post_type' => 'post',
'offset'=> 1 ,
'posts_per_page' => 10
);
$the_query = new WP_Query($args);
// The Loop
while ( $the_query->have_posts() ) :
$the_query->the_post();
// Show all columns except the right hand side column
if($counter != $grids) :
?>
<div class="griditemleft" style="margin-right: 192px;width: 25%;">
<div class="postimage" style="width: 205%;">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
</div><!-- .postimage -->
<h2 class="postimage-title" style="width: 205%;">
<a style="text-transform: uppercase;color:black;"href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php if (mb_strlen($post->post_title) > $titlelength)
{ echo mb_substr(the_title($before = '', $after = '', FALSE), 0, $titlelength) . ' ...'; }
else { the_title(); } ?>
</a>
<?php
$trimexcerpt = get_the_excerpt();
$shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 20, $more = '… ' );
echo '<a href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>';
?>
</h2>
</div><!-- .griditemleft -->
<?php
// Show the right hand side column
elseif($counter == $grids) :
?>
<div class="griditemright" style="width: 25%;margin-left: px;">
<div class="postimage" style="width: 205%;">
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_post_thumbnail(); ?></a>
</div><!-- .postimage -->
<h2 class="postimage-title" style="width: 205%;">
<a style="text-transform: uppercase;color:black;" href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php if (mb_strlen($post->post_title) > $titlelength)
{ echo mb_substr(the_title($before = '', $after = '', FALSE), 0, $titlelength) . ' ...'; }
else { the_title(); } ?>
</a>
<?php
$trimexcerpt = get_the_excerpt();
$shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 20, $more = '… ' );
echo '<a href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>';
?>
</h2>
</div><!-- .griditemright -->
<div class="clear"></div>
<?php
$counter = 0;
endif;
$counter++;
endwhile;
wp_reset_postdata();
?>
</div><!-- .gridcontainer -->
Comments
Post a Comment