Designing to Monetize Your Blog

Share Button

Many bloggers start their blogs, develop some good content, and get a loyal following. Then they decide to make a little side income from their blog. However, when they go to monetize their blog, they realize their layout and sidebars don’t fit. In fact, nothing on their blog matches any of the standard ad sizes. This article is intended to help you avoid that mistake.


When to Monetize Your Blog

All the ads in the world and the best design money can buy will not save your blog if it doesn’t have good content. As a blogger you are responsible for providing quality content on a regular basis, because that is what keeps people returning. The time to start weaving in advertisements is once you’ve got some solid content which will get visitors and keep them coming back.

Where to Monetize

You want to place your ads so that they do not detract from your content or interrupt your visitor from enjoying your content. You also want to make it clear what is and is not an ad. People generally give less value to content that is an advertisement, so it’s important that you don’t mix your own content in with the ads. If you do, visitors will give less value to your stuff!

The most common and accepted places for advertisements are in the sidebar and after your article. Placing ads in these areas help to separate them and keep your brand intact. Placing advertisements in the header of your website tends to cheapen your site in the eyes of readers.

If your site is responsive or has a mobile version then you will need to consider whether or not your ads will be displayed on mobile devices. If you do have ads displayed, you need to remember that the width on most mobile devices is 320 pixels. This may be significantly less than the space available on your desktop site.

Common Advertisement Placement

Now you know where to place the ads, how much room do you need? One of the common mistakes is trying to fit too large an ad into too small a space. You want to allocate the right amount of space to place the most effective ads. After all, the more effective the advertisements are, the more money you can make!

After Your Main Content

Placing supplemental information after your main blog content is a common practice. Many sites use the space between the blog article and the comments to feature related posts and advertisements. In this space you generally want to avoid very tall ads. As a general rule, keep things to under 250 pixels in height. How wide you go depends on the width of your article space.


Probably the most common location is the sidebar. Placement of ads in your sidebar should be after any content specific to your site.

When designing your sidebar consider the type of banner ads you are looking to display. A very effective width is 300 pixels for a banner, so making your sidebar 300 pixels or wider is a good choice. You may also want a little extra space in your sidebar, especially if you have a background for your sidebar. Here are some examples of what can fit into a 300 pixel wide sidebar.

Medium Rectangle

Button Button

Vertical Banner Vertical Banner

Common Advertisement Sizes

Before we get into the common sizes, I should note that some ads can be resized. It comes down to how the ad is displayed. If it’s displayed by a link around an image, then it can be resized by adjusting the image’s width and height properties. But, just because you can resize, doesn’t mean you should.

However, if the ad is embedded via an iframe you can not adjust it. Iframes are webpages within webpages, and you have no control over the webpage within the iframe. You might be able to adjust the iframe size itself, but that would end up cutting off some of the content. More frequently, advertisers place the iframe using javascript so you that you can’t modify the size.

Larger advertisers like Google Adsense and Amazon use iframes to ensure that they have total control over their content. Also, attempts to modify how an ad is displayed is usually against the terms of service.

Medium Rectangle 300×250

The medium rectangle is one of the most popular sizes. It makes a bold statement and allows for plenty of information to be displayed in a variety of ways.

Medium Rectangle

Button 125×125

Buttons are great when you want to display a number of smaller advertisements. They are frequently displayed in a grid.


Banner 468×60

Banners are great for use after a blog entry. They aren’t too wide and have very little height.


Half Banner 234×60

Half banners can be useful for after entries on responsive sites. When the site is displayed on a desktop device you would see two half banners side by side. When the site is viewed on a mobile device the banners would be one above the other.

Half Banner

Leaderboard 728×90

Leaderboard is the most common advertisement for display in the header area on sites.


Skyscraper 120×600 & Wide Skyscraper 160×600

Skyscrapers are very common in sidebars. They take up very little width, so if you have two sidebars they can be a very helpful option.

Skyscraper Wide Skyscraper

Other Sizes

The previously listed sizes are the most common, but are by no means the only sizes available. There are an almost unlimited number of sizes that have been created, however it’s recommended that you design your advertisement space using the more common sizes. Here are some examples of other sizes that are used:

  • Large Rectangle 336×280
  • Square 250×250
  • Small Square 200×200
  • Small Rectangle 180×150
  • Vertical Banner 120×240
  • 120×60
  • 88×31
  • 120×90
  • 200×125
  • Still others…

How to Monetize

Where to Get Ads

The most common options are to use affiliates and contextual solutions. Affiliates are advertisers that you select and sign up with. Affiliates offer you a commission when someone uses a link on your site to buy a product from them. A couple of examples of affiliates are Amazon and web hosting providers.

Contextual solutions are a fancy name for advertisers that look at the text of your webpage and select products to advertise based on that. The most common example is Google Adsense. In the case of Adsense, Google will also use your visitors recent search history to supply ads.

If your site has a large number of regular visitors, you can also post links on your site to “advertise here”. Potential advertisers can then contact you about placing ads for their products or services. You would then be responsible for pricing and determining the size of space available. There are also contextual solutions which include an “advertise here” option — the provider takes care of all the details for you. One popular choice is Buy Sell Ads.

Placing the Ads

Now that we’ve covered when and where, it’s time for how. If you have a designer or are comfortable with some code manipulation then you can insert the ads just about anywhere. However, for everyone else you are best off going with a plugin for your Content Management System (CMS).

If you are using WordPress, then a very popular choice is the Google AdSense Plugin. It allows you to add widgets to your sidebar which do all of the work for you. A more general approach is to use the text widget in WordPress. Into the text widget you can copy and paste HTML code which is generated by many affiliates. There are also a number of plugins customized to work with major advertisers.

There are also some themes for specific CMS which provide built-in functionality for using the most popular services, like Google AdSense. Some of the large theme suppliers like Elegant Themes have the ad placement functionality built right into their customization options.


Monetizing your blog can be an easy and quite rewarding process, especially if you have designed it right. If you didn’t plan to monetize from the start, you may get lucky and some of the advertisements will fit into the blog you have, however many people have found out too late that they need a bit of redesigning.

  • Disclaimer: some links in this blog contain links to affiliate sites.
Share Button

Leave a Reply

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