sideblogs in TypePad

Doc wrote a great post about how to recreate his Quotation of the Day feature in TypePad, which inspired me to create a sideblog (and ultimately redesign everything to accomadate it). His instructions are very clear so I suggest you take a look at them before reading my edits and additions. I'll do this step by step and hope that it makes sense. If you have any questions, feel free to comment.

1. Create a new weblog within TypePad for your sideblog. Basically, your main blog code is going to call a portion of code (the entries) from the new blog and load it wherever you place the call in the layout. Mine is here. You don't have to make the blog public or give it a fancy layout, I'm just an incredible control freak.

2. In the new blog (which from this point on will be referred to as the sideblog), go into the Advance Template area and create a new index file. Like Doc, I called mine "output" with the file name "ttb.inc," .inc means "include" and ttb is short for Teeny Tiny Blog.

3. In this file, you want to include anything you want displayed in your sideblog posts. I wanted mine to show the last ten posts, the date, the post, and the time. You could add the formatting to each post like Doc does but I'm lazy. So this is what I put in the file:

<MTEntries lastn="10">
<MTDateHeader>
<h2>
<$MTEntryDate format_weblog_date="1"$>
</h2>
</MTDateHeader>
<$MTEntryBody$>
<p class="posted">
<$MTEntryDate format="%I:%M %p"$>
</p>
</MTEntries>

4. In the CSS file of my main blog, I put this code:

.ttb {
padding: 0px 10px 10px 10px;
margin: 0px;
margin-bottom: 30px;
background-color: #FFFFFF;
border: 1px solid #000000;
}

.ttb h2 {
color: #CC6600;
font-family: Arial, sans-serif;
font-size: 11px;
text-align: left;
font-weight: bold;
margin: 0px;
border: 0px;
padding: 10px 0px 2px 0px;
}

.ttb p {
color: #000000;
font-family: Verdana, Arial, helvetica, sans-serif;
font-size: 10px;
text-align: justify;
line-height: 14px;
margin: 0px;
}

.ttb p.posted {
color: #777777;
font-family: Arial, sans-serif;
font-size: 10px;
font-weight: normal;
line-height: 14px;
text-align: left;
text-transform: lowercase;
padding: 0px 0px 7px 0px;
}

All of that formats the way the sideblog area looks. I should note that I had to add "border: 0px;" for the date header so that the border from the main blog's dates wouldn't show up. I have no idea why it does that, it might be an IE thing.

5. In the sidebar1 template of my main blog, I put this code:

<h2>teeny tiny blog</h2>
<div class="ttb">
<!--#include virtual="../tiny/ttb.inc"-->
</div>

And that's about it! I hope it made sense. This could be really great for including the latest post from a photoblog or something like that.

Comments

Wow, without