Home : Blogs : Cheryl Johnson : CJ's Blog

TypePad Layouts

TypePad Pro offers five Classic Layouts with their pro level blogging platform

Why do you care? Because if you plan to customize the appearance of your blog using the "Custom CSS" feature, you need to know the proper name of each layout in order to apply styling to it.....

So, with that in mind, there are the layout names in the same order as pictured above:

.layout-two-column-left

.layout-two-column-right

.layout-three-column

.layout-three-column-right

.layout-one-column

How would you put this to use? Let's say you are using the 3 Column Right layout, with a fluid width** main content column. That widens the entire blog so it takes up the full width of the window. But let's say you'd like a just little bit of padding on each side.

You would enter this line in the Custom CSS editor

.layout-three-column-right #container {padding: 2px 99px 25px 99px;}

If you were using the Two Column Right layout, you would revise that line to read

.layout-two-column-right #container {padding: 2px 99px 25px 99px;}

The padding amounts are applied Top - Right - Bottom - Left ... So I am specifying 2 pixels of padding at the top; 99 pixels of padding at the right side; 25 pixels of padding at the bottom; and 99 pixels of padding at the left side.

** Want to know more about a fluid width main conten column?

Posted by Cheryl Johnson on 07/20/2008 08:22 AM

Comments (12)

cj, typepad

Originally posted at: Random thoughts on life, art, technology, stuff, and occasionally Real Estate: TypePad Layouts

Post is included in group: My other blog is
Post is included in group: e-PRO Internet Technology
Post is included in group: Typepad Users
Post is included in group: Club Chaos

12 Comments on TypePad Layouts

JUL

I'm with Go-Daddy and still trying to get my blog to come across, don't confuse me anymore...lol

Nancy -- Are you using GoDaddy's Web Site Tonight?

yes I am Cheryl, is that the problem? I have tried almost everything and nothing works. You got my answer?

Nancy -- Maybe. A friend came to me yesterday. She'd signed up for Web Site Tonight and wanted me to help her figure it out. Gimme a few days to try to muddle through it.

Is your site live yet? What is the web address?

Nancy -- I now have tinkered with Web Site Tonight for an hour or so and have a vague, rudimentary understanding of how it works.

Where are you stuck?

God information thanks we are in the process of adding our outside blog and may want to consider typepad. Thanks

Terry, I do like TypePad. To me, it's just the right compromise between power and ease-of-use...

Cheryl - I appreciate your typepad tips. I see alot about how to use wordpress but not so much on typepad.

This is very good information even if someone is having a custom site done. On mine, I opted to be a bit different in the way we did the two column site format. But experience after the fact also makes one realize that having different also extracts a price. On my site it meant no widgets and no special column as a usable side bar. Experience teaches many things and many times it also causes us to realize we might have already erred. :-). As in, I think I did. lol.

JUL

@Pam -- I've written a few WordPress tips, too, if you're interested in WordPress.

@William -- You're referring to the "open book" image at The Real EstateTextbook? It's very attractive, but yes, I can see how it might limit your options. I suppose you could just change out the "theme" if you decided you wanted a different look?

JUL

Cheryl....can't get AR blog to incorporate into www.nancydoesmortgages.com

@Nancy ... I take it you want your AR blog to show when people click on Nancy's Blog? Do you have access to edit the code on the pages?

Three ideas:

A simple link to the AR blog: <a href="http://activerain.com/blogs/nance0924">Nancy's Active Rain Blog</a> (The link code would be inserted at the tab on the home page)***

Or have the AR blog show in an inline frame: <iframe height="900" width="580" style="border:1px #000099 solid;" frameborder ="0" scrolling="no" src="http://activerain.com/blogs/nance0924"></iframe> (you'd need to adjust the height and width attributes as needed)

Or use the RSS-to-Javascript converter http://www.rss-to-javascript.com/p/RSSRDF-Converter___138.html using that will place a "teaser" link to each new AR blog post in a list on the Nancy's Blog page

Let me know if any of those help! :-)

***Further explanation - Just in case you need it ... on your main index page you would change this link

<li><a href="Nancy_s_Blog.html" target="_self">Nancy's Blog</a></li>

to this

<li><a href="http://activerain.com/blogs/nance0924" target="_self">Nancy's Blog</a></li>

<li><a href="http://activerain.com/blogs/nance0924" target="_blank">Nancy's Blog</a></li>

(Changing the target to blank will cause the AR blog to open in a new window, in case you don't want folks leaving your main index page)

Leave a response…

Name:

Email:
(optional)

Comment:

What does the graphic say?