How To Design A Blog On WordPress From Scratch

Last updated on July 10, 2019  ∙ by Edwin Contreras2 comments
WordPress blog design ideas and inspiration

I may earn a commission for purchases made through links in this post.

In this blog post I'm going to show you how to design your blog on WordPress - from scratch. To start, let's establish that a good blog design puts the focus where it should be: on the content.

Far too often new bloggers get carried away with their blog design and turn their blog into a hoarder house.

Cluttered blogs totally overwhelm new visitors and as a result, they bounce.

When it comes to your blog design, simple is better.

I don't care how great your content is - if your readers aren't sticking on your page long enough to read it - it just doesn't matter. So let's put the focus on designing a reader-friendly WordPress blog.

Once you unlock the formula for a blog design that's easy to read, you will notice better blog engagement stats, more blog comments, more social shares and even better Google search rankings.

Let's do this!


This goes without saying, but I think I need to say it anyway: build your blog with WordPress.

Here's why you should choose WordPress:

  • WordPress is free.

WordPress is open-source software that is free to use and is constantly improving. Use BlueHost and WordPress comes pre-installed so you can start building your blog right away.

  • You can design your blog or website with zero experience.

With WordPress you have complete control of your blog design. There's even entire websites (that don't even have a blog) that run on WordPress. If you visit a website, any website, there's a better than 1 in 3 chance it runs on WordPress (source).

  • Thousands of plugins.

There are thousands of plugins to customize and enhance your blog. There are entire businesses built on just being a WordPress plugin. For example, the SocialWarfare plugin I use for my social share icons.

  • Software integrations.

Over time you will need high-end tools to help grow your blog such as: ConvertKit for email marketing and Thrive Leads for lead generation. All of these tools integrate seamlessly with WordPress.

  • There are a ton of free resources.

There are tons of free resources on WordPress. If there's a question you have, odds are it has already been asked and answered. Here are 55 free tools for your WordPress blog.

STEP 2: design your blog USing A VISUAL THEME BUILDER

Divi is more than a theme - it's a "visual blog builder". With Divi you have complete control to design your entire blog.

When you choose a free theme you are essentially "stuck" with your blog design. Sure, you might be able to make some changes such as modifying the theme colors, adding a logo and changing your font.

But it is not possible to entirely remodel your blog without hiring a designer (or learning how to code). Even the pro version of your free theme doesn't give you the freedom to alter every aspect of your blog design.

In comes the Divi theme from Elegant Themes. With Divi you can make every customization I'm going to recommend in this article - not so with other blog themes.

If templates are your thing, you can browse through hundreds of pre-made Divi layouts to gain some blog design inspiration. Then just choose a blog design you like and customize it to your liking.


Many new bloggers make the mistake of overdoing it when it comes to the color scheme of their blog. It is pretty hard (if not impossible) to create a colorful blog that looks good. I know I can't do it.

You can use a color palette generator like this one from Canva to find colors that go well together. But what looks good on a palette doesn't always translate once the colors spread out on your blog.

Instead, I have a much simpler way choose your blogs' color scheme. Choose 3 colors - as long as the first two are black and white.

I know this sounds insane, but you cannot go wrong with this formula.

And when it comes to blog design, it's more about not messing it up rather than creating a visual masterpiece. After all, it is your content that should matter the most.


You don't need to hire a graphic designer to design a logo. You can do this!

Go to Canva and use their logo maker tool (or search for logo templates if you're already a Canva user). Choose a logo style you like, make your changes and save the file.

To add your logo to your blog, in most WordPress themes you go to Appearance > Customize > Logo.


The purpose of your menu is to help visitors navigate to other sections of your blog. Rather than listing all of your blog categories and sub-categories in your menu, I prefer to keep it simple.

Here's what I recommend having in your menu:

  • About me.

Your about me page will be one of the most visited pages on your blog. Get my about me page template here.

  • Blog.

Rather than cluttering your menu by listing all your blog categories, link to your blog page instead.

  • Resources.

Create a page where you list your favorite tools or resources. It's a great page to earn affiliate income.

  • Call To Action.

This page is the most important page on your blog. It may be a "Shop" link, a "Courses" page, or simply a landing page for your email list.

When it comes to your menu, simple is better. If you overwhelm the reader with too many options, they will choose none. Instead, focus their attention on the parts of your website that are the most important to you.


Many bloggers use their homepage to display their latest blog posts. But that's not the best use of your homepage. Your homepage should serve as your roadmap.

Create a new page (Pages > Add New). To let your blog know that this page is what should be displayed as your home page, go to Settings > Reading > Your homepage displays > A static page and choose your newly created page.

Here's how to design an awesome homepage:

  • Header.

Here you have your logo and your menu. This is VERY valuable real estate, so don't make this section too tall.

  • Above the fold.

Put what is MOST important to you in this section. A common practice is a section about you along with a freebie with an optin form. Take advantage of this section to establish credibility. Why should someone learn from you?

  • What do you need help with.

Your homepage is like a catch-all. You don't know why the person is on your page. Make sure they don't get lost and ask them what they need. You can link to your main blog categories here.

  • Your best content.

Include links to your most popular posts. But think of this from the reader perspective. If someone lands on your homepage, what content could help them the most?

  • Footer.

You can add an additional module in the footer and display an optin form, a paid product, a contact form (if you're a freelancer or offer services) or links to your social media accounts (if you are an "influencer").


Your blog posts belong on a blog page. It makes sense because what we are doing is building an entire website. Your blog is just a part of your website.

You have to think bigger than just a blog. You are running a business.

Your blog posts are merely the vehicle by which you get traffic.

Let's design your blog page now. Create a new page to design your blog page and then add a link to this page on your menu.

Displaying your posts in a chronological order is not the way to go.

Design your blog page from scratch with the reader in mind. It would be far more useful to display your blogs by category instead.

With Divi you have complete control over how you design your blog page.

You can see how I do it on my blog page here.


If you're not using a visual blog theme (or a page builder) you don't have much choice on how to design your blog posts. It's either a wide blog post page or a narrow one with a sidebar.

But if you are using a blog page builder like Divi or Thrive Theme Builder, you have full control over how your blog posts look.

To make your content easier to read, make sure the width of your content isn't too wide. It's easy to lose your place when you're reading a seemingly endless line.

In order to keep the reader from becoming overwhelmed with too much text on a line, set the width of your content to between 700-900px wide.


Now it's time to design the content of your blog posts. This is where the reader will spend the bulk of their time, consuming your content.

Again, the principle of keeping it simple still holds true.

I get it, you're creative. But keep the creativity for your header, sidebar or footer. In the article section, don't mess with the colors!

Only use black text on a white background.

For reading text, this is the only color contrast combination that works. You can choose off-white and something close to black. The color code of this text is #252525.

There's a reason why just about every textbook or novel ever published has utilized this standard - it's just easy to read.


When it comes to fonts, there are many options to choose from. Here's another example where simple is better.

To make your content easier to read (and to keep the visitor on your blog longer) use a readable font.

For my blog I use Montserrat, but I used to use Open Sans and Lato in my courses. Other readable fonts include Helvetica, Georgia and Verdana.

Another benefit of these fonts is that they are pretty universal. Regardless of whether they're viewed on a mobile/desktop device, Mac/Windows or Chrome/Safari, your text will be seen as intended.


For a long time, text on webpages was small - similar to the text you'd find in a magazine, newspaper or a book.

That was then and this is now. For some reason, font sizes have been increasing and I couldn't be happier. You have no idea the amount of times I would scale up a page to 125% just to comfortably read the content.

When you choose a large font size, you are ensuring your content can be read by everyone. Not everyone has 20/20 vision or wants to strain their eyes to read small text.

The font size I use for my blog is 20 pixels on desktop and 18px on mobile.


Spacing is important for an easy smooth read. The last thing you want are all your lines squished together. For my blog, I use a line height of 1.6.

If you use a theme builder like Divi and Thrive Theme Builder you can edit the line height and instantly see what looks good.

For other blog themes it's a bit more complicated as you'll need to add additional CSS code.

For many blog themes the code is: .entry-content p { line-height: 1.5; }

And to edit the space between list items it's: .entry-content ul li { line-height: 1.5; }

In a lot of themes, you can edit the css by going to Appearance > Customize > Additional CSS.

Play with the font, letter spacing and line height until you find the right look.


You're writing a blog that helps people just like you - not a research paper. As such, your writing should be in a more relaxed informal tone. This is one of the ways you can connect with your audience.

So break the rules and start sentences with and, so, because, but and also. I know it's not grammatically correct, but your blog is just a conversation with your readers so you should write like you talk.

To help make your blog posts even easier to read, break up big blocks of text. There's nothing wrong with 1 or 2 sentence paragraphs. And there's nothing wrong with short sentences either.


Make use of typographical emphasis to make your key points stand out.

Your blog post is a story and it's your job to take them on a journey. And a journey without twists and turns is just plain boring (more about this in my how to write a blog post guide). Think of text the same way.

Break boring regular text with bold, italics, underline and even highlighting to make your text stand out.


Adding visual content to your blog posts is another way to keep their eyeballs on the page.

You can get free stock images to use in your blog posts from Pexels (who I use) and Unsplash (also free) to help illustrate your points.

For a wider selection of stock images you won't find anywhere else, try 123RF (paid) and DepositPhotos (paid).

In addition to stock images, use screenshots if you're describing how to do something online or reviewing a service.

I usually like to add one picture after every heading. That might be a bit of overkill - but definitely don't stick with text-only blog posts.

You can go further and embed Youtube videos within your content. Doing this will increase your average session duration and can help demonstrate what you're describing.


Whenever I go to an article, I don't read the whole thing, word for word. I scan through the headings and only read the section that directly answers my question best.

It's so much easier to consume blog posts when they are divided into readable sections rather than an endless block of text.

Don't just use bold to separate your key points. No, use headers. They are also valuable as an on-site SEO tool. Headers (h1, h2, h3, h4) let Google know what the main key points in your article are.

For example, the title of this blog post uses an h1 tag and each of the steps use an h2 tag.


In addition to separating your content into sections with headings, you should also list key points in bullet points.

Here's why they work:

  • Outline key points.

When you're trying to break down a concept, bullet points make it easier to explain.

  • They're "sub-headers".

Think of bullet points as sub-headers within the main headers of your article.

  • They're amazing!

Why? Because they are almost always read, not skipped. See what I mean?


Ever wonder why you see list style posts everywhere? It's because they work.

Even if you don't like to admit it, you love to click on list posts. There's no shame in that. I do it all the time too.

List posts outline key points in a highly scannable way.

These "listicles" get a bad rap, but it's not the articles themselves that's the problem - it's the clickbait headlines.

So as long as you don't get carried away with Buzzfeed-style headlines you'll be alright.

You can test the score of your headlines using Coschedule's Headline Analyzer tool.

To take this to another level, you can test which headlines get the most engagement on your blog using Thrive's Headline Optimizer plugin. The way it works is you create multiple headlines and let the plugin run a test to determine the headline with the highest engagement score.


The numbers don't lie. The answers to whether any changes you make are working will always come from your stats.

Look at your Google Analytics data and make note of your engagement stats. Specifically look at the average session duration and pageviews per session metrics.

Make the changes to your posts and check back when you have enough data.

Use the Monster Insights plugin to see how your best pages perform right on your WordPress dashboard.


Google tries to gauge user experience by looking at a visitors' average dwell time on your blog.

Dwell time is defined as the length of time a person spends on your blog, starting from a click on a search result and ending when they return to the results page.

We can safely assume the major search engines (Google, Bing, YouTube & Pinterest) are keeping tabs on this data.

Dwell time is important because it tells the search engine that the reader found exactly what they were searching for. In other words, the search engine did their job by presenting the perfect search result for that particular search query.

While you don't have access to this data, you can however look at your "average session duration" in Google Analytics.


Another way to improve your dwell time is to have the user navigate to multiple pages per visit. The longer the stay on your website the better your dwell time is going to be.

A good blog design provides a good user experience. And a huge part of providing a good user experience is making sure the reader gets the information they came for - and gives them the opportunity to learn more.

This is why I like to look at Google Analytics for the pages per session and the bounce rate data.

The bounce rate is the percent of users who land on your blog and leave without going to another page. When you provide a good user experience you will have a lower bounce rate.

By adding links to related content within your blog post, you will improve the chances that the reader will go to other pages on your blog and thus stay on your blog longer.

Linking to your other content not only improves user experience, but it helps with Google too. With a good internal link strategy, you can tell Google what content is related to each other and which blog posts are most important.

For example, this would be the perfect place to drop a link to my Google SEO strategies article.


If you followed these usability principles in your blog design you can expect to see:

  • Longer time on page.
  • More pages visited.
  • More blog comments.
  • More social shares.
  • An improved Google ranking.

If this article has helped you design your own blog, it would totally rock my socks if you hit the Pin button below to save this blog post on Pinterest!

How To Design A Blog On WordPress From Scratch

Until next time,

just a little > about me

About edwin

Edwin Contreras is the professional blogger behind Cash The Checks and Do Six Figures. Over the last 17 years, he has started over 100 profitable blogs on his way to a six-figure income as a full-time blogger. He is now obsessed with helping people just like you escape the 9 to 5 and make serious money online. You in?

learn more > earn more

let's continue > the conversation

  • Winnie Xu says:

    I’ve seen you mention the Divi template many times in several of your articles. It definitely sounds like it’s worth checking out! Also, just a quick question about user engagement: are there specific ways to reduce bounce rate? Any suggestions on how to catch the reader’s attention quickly or keep them interested when they land on the blog home page? Thanks 🙂


    • Always give the user plenty of internal links to click on. That’s the best way to reduce the bounce rate.


  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}

    © Do Six Figures  /  Privacy  /  Disclaimer  / Courses