Creating a Custom Blog Homepage In WordPress

Here’s how to make a custom homepage inside Wordpress. We’ll cover the easy way… and the geeky way.

WordPress is extremely customizable and that’s one of the beauties of it. When you are able to master customizing blog themes for WordPress, you can turn the platform into almost anything.

The problem is that most people don’t know how to do it. They look at a blog theme and see nothing but cryptic HTML and PHP code. Sound familiar?

Many freebie WordPress themes have the stereotypical blog homepage. They show the latest posts in chronological order. That, however, is a seriously stupid homepage. There are much smarter things to be doing with your homepage.

So, the question is… how?

There are a couple ways to go about. One is much easier than the other, but I’ll show you the geeky way, too. 🙂

First, The Easy Way To Make A Custom Homepage

First, you create a new page in WordPress. Then, you simply tell WordPress to make that your homepage.

Go to Settings > Reading. On that screen, you will have your Front Page settings. You can show your latest posts if you’d like, but we’ve already established that that’s stupid. So, select a static page. Then, in the dropdown of pages, select the page you want to be your homepage.

Now, there’s a good chance that you might not be happy with the way that page looks. After all, if you’re using a standard WordPress theme, then the page templates are pretty basic and you’re going to find it hard to make a decent looking homepage yourself.

So, how can you make a homepage like mine?

It is actually fairly simple if you use a page builder such as Thrive Architect. My homepage was built exclusively in Thrive Architect. Zero custom coding, zero geekery. So, I designed the page the way I wanted it with Architect, then chose that page to be my front page.

Easy peasy.

But, now let’s cover the geeky (and somewhat old-school) way to do this…

The Geeky Way To Create A Custom Homepage

If you view the template hierarchy for WordPress, you’ll see the order for which it checks for files in your theme. In the image on that page, you’ll see home.php. It will check for this file and, if it doesn’t find it, it will default to your index.php file.

So, go into the folder where your theme is located. It will be in /wp-content/themes/[name of theme]/. You will see an index.php file there. Now, you might find a home.php file in there. THAT is your homepage template. If your theme doesn’t have a home.php file, just create one. Create a copy of your index.php file and simply save it as home.php. From there, the file will need to be modified.

I hope I haven’t lost you. 🙂 I told you this was geekier.

Essentially, any theme changes you make to the home.php file will only affect your blog’s homepage. So, within this file, we will make any changes to make your blog homepage look like you want it to look. And yes, you’ll need to hand-code what you want into this home.php file.

NOTE: What follows are some code snippets from an old version of this site from about 10 years ago. Back then, we had to hand-code things. Up above is how I do things now. But, I will leave these code snippets in place as an aid for the die-hard geeks. 🙂

Showing a Feature Post

On the homepage of this blog, I show a single feature post for the day at the top. How did I do that?

I created a category called “Feature”. Whenever a post is assigned to this category, it is made into a feature. I also assign the post to whatever other categories are relevant.

Here is the code to output the feature:

<?php $my_query = new WP_Query(‘category_name=feature&showposts=1’); while ($my_query->have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID; ?>
<h6>Today’s Feature Post</h6>
<div class=”clearboth”></div>
<div class=”comm”><span><?php comments_popup_link(‘0’, ‘1’, ‘% ‘); ?></span></div>
<h3 class=”h1″ id=”post-<?php the_ID(); ?>”><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title(); ?>”><?php the_title(); ?></a></h3>
<div class=”post-meta-top”>
<div class=”date”><span><strong><?php the_time(‘F j, Y’); ?></strong></span></div>
</div>
<div class=”clearboth”></div>

    <?php the_content(‘<br />Read the rest of this entry &raquo;’); ?>
<?php endwhile; ?>

Now, the HTML in this and the layout of the theme tags you will need to edit to suit your own design. But, what it is doing is running a query to fetch a single post (the latest one) from the “feature” category. It then just runs the loop to display it. Also note that I am using the_content() to show the text of the post, and it stops wherever I use the “read more” break (which is part of the WordPress editor). If I forgot to include that, it would show the entire post on the homepage and look like crap. If you don’t want to mess with this, you can just use the excerpt.

Showing the Latest Posts

Beneath the feature post, I show the latest posts down the left side of the homepage. I will leave it up to you to format this stuff and put it into a column layout, but this is how you show the latest posts:

<?php
query_posts(“cat=-259″);
while (have_posts()) : the_post();
if( $post->ID == $do_not_duplicate ) continue; update_post_caches($posts); ?>
<h3 class=”h1″ id=”post-<?php the_ID(); ?>”><a href=”<?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to <?php the_title(); ?>”><?php the_title(); ?></a></h3>
<div class=”post-meta-top”>
<div class=”date”><span><strong><?php the_time(‘F j, Y’); ?></strong></span> | <?php comments_popup_link(‘0 Comments’, ‘1 Comment’, ‘% Comments’); ?></div>
</div>
<div class=”clearboth”></div>
<?php the_excerpt(‘<br />Read the rest of this entry &raquo;’); ?>
<?php endwhile; ?>

So, what’s going on here? First I’m running a query for all posts that are NOT in the category with the ID of 259. At the time, 259 was the ID of a category of videos I did at the time. Since I want to exclude those posts from that listing, I do so here. Then, I just run the loop again.

Now, you will also see that I have an IF statement in there which will exempt the post from displaying if the ID is $do_not_duplicate. This variable was defined with the feature post (see above) and the purpose of this is so that my daily feature post is not listed twice.

Showing The Videos

On my custom homepage, I was also listing the latest videos. Above, I exempted category #259. In this case, I want to exclusively list category 259. So, the query to start off the loop would be:

<?php query_posts(“cat=259&posts_per_page=5”); ?>

The only addition here is that I am limiting the list to only the latest 5 videos.

Whew! Man, That Was Weird. But…

This post was originally written in 2009. Back then, we did things the hard way because all the easy tools weren’t a reality yet. All that code above is from then. But, it worked. 🙂

But, things are easier these days. WordPress can select a homepage right in settings. Better yet, with tools like Thrive Architect, you can literally make your homepage look like any dang thing you want, without being confined by the limits of your theme.

About David Risley
David Risley is the founder of the Blog Marketing Academy, a 20-year veteran blogger and online entrepreneur. His focus? Building a reliable, recurring business around his "lifestyle" and the lives of his students. He has this weird obsession with traveling in his motorhome around the country with his wife and 2 kids. David also likes to talk about himself in the third person. In bios like this one. Read his full story.