WordPress

Show Blog Posts on Static Homepage with WordPress Thesis Theme

Website owners often like to display some static content along with their most recent blog posts. For instance, a restaurant that wants to have their most recent blog post displayed above an image on the homepage or a blog that wants to have a static introduction above dynamically updated blog posts.

WordPress gives you the option (under Settings > Reading) to have a homepage with X number of blogs posts displayed or to show a homepage with static content. Unfortunately, WordPress does not have an easy setting to display static content along with blog posts on the homepage. However, if you are using the Thesis Theme, making this change is fairly straightforward.

If you do not already have a static homepage configured, follow the steps below to set one up. If you have a static homepage set up already, skip to the set of directions below:

  1. Log into the admin panel of your WordPress install.
  2. Go to Pages > Add New and create a page called “Home” or “Homepage” and save it (no need to put any content in aside from the title).
  3. Add another new page called “Blog” (or whatever you want your blog page to be named).
  4. Go to Settings > Reading.
  5. After the “Front page displays” option, select “A static page.”
  6. Under static page, select the Front page and the Posts page.  The Front page is going to be the new page you just created called “Home.”  The Posts page is going to be the newly created “Blog” page.
  7. Click “Save Changes” and follow the instructions below to add blog posts to you static homepage

To show blog posts on static homepage, simply paste the below snippet of code into your custom_functions.php file:

function static_front_posts(){
if (is_front_page()) {
?>
<div id="my-static-front-posts">
<?php
$custom_loop = new WP_Query('showposts=10&orderby=date');
if ( $custom_loop->have_posts() ) :
while ( $custom_loop->have_posts() ) : $custom_loop->the_post();
echo '<div class="post type-post hentry post_box top">';
echo '<div class="headline_area"><h2 class="entry-title"><a href="' . get_permalink() . '">' . get_the_title() . '</a></h2>';
echo '<p class="headline_meta"><abbr title="" class="published">' . get_the_date() . '</abbr></p></div>';
echo '<div class="format_text entry-content"><p>' . get_the_excerpt() . '</p></div>';
echo '<a href="' . get_permalink() . '">' . '<span class="more-button">Read More</span></a>';
echo '</div>';
endwhile;
wp_reset_query();
endif;
?></div><?php
 }
 }
add_action('thesis_hook_after_content','static_front_posts');

Notes:

  • You can change the number of posts displayed on your homepage by editing the 10  to the number of posts you want to show in line 6 of the code snippet:
$custom_loop = new WP_Query('showposts=10&orderby=date');
  • If you want to display the full content of the post instead of just the excerpt, replace get_the_excerpt with get_the_content in line 12 of the code snippet:
echo '<div class="format_text entry-content"><p>' . get_the_excerpt() . '</p></div>';
  • To change the positioning of the blog posts (above or below the homepage’s static content) change the ‘thesis_hook_after_content’ to ‘thesis_hook_before_content’ in the last line of the code snippet:
add_action('thesis_hook_after_content','static_front_posts');
  • To remove the “Read More” link, simply delete line 13 in the code snippet:
echo '<a href="' . get_permalink() . '">' . '<span>Read More</span></a>';
  • To add thumbnails to your static posts, please see the code in our below blog post:

Show Image Thumbails with Blog Excerpts or Posts on Static Homepage using the WordPress Thesis Theme

145 Comment on “Show Blog Posts on Static Homepage with WordPress Thesis Theme

Leave a Reply

Your email address will not be published. Required fields are marked *