Blog Content

Blog Content

How to add content between your blog and the top of the browser

Say you'd like to put an ad banner above the header of your blog, or create a space to call attention to a special event?

This is an easy hack to implement in advanced templates. As an example, take a look at what I did over at The Mommy Insider today. Alicia needed a navigation menu and also wanted to run an ad banner above the site to match the style of her static website at

To run your own ad banner, google ads, or promo space follow the tutorial below:
Go to the Design tab for your weblog.
At the bottom of the page, click on Create new template module.
Type "adspace" into the Template Name field. (you can use any name you like,
Paste the HTML for your ad or other content into the Template Body field. You can use any HTML you like in this space, as well as JavaScript or even TypePad specific tags (for instance if you wanted to include typelists, categories, etc.).
Click Save.
Click the Select a Template to Edit menu and go to your Archive Index Template.
Type directly after in your template. It should now look like this:

Click Save.
Repeat step 6-8 with your Main Index Template, your Category Archives, DateBased Archives and Individual Archives.
Republish your blog. The content should now hang above your blog, outside the background container area.

Bonus Tip:

I wasn't 100% sure that this hack would work when I tried it for the first time today and I had to apply it to a site that was live. I was pretty sure nothing would go wrong, but, you know…So here's a trick I came up with for testing new code on a live site:
If you're adding a new template, do that first and save and republish the blog (before adding the new template code into any of the existing templates).
Now, test the new template by adding it to the Archive Index Template only. This page only displays links to your archived posts, and is rarely actually visited or seen by anyone....

Similar Essays