The default Movable Type MT3.2 templates come with a sidebar on the right side of the Main Index page, but not on any of the individual entry, monthly, or category archive pages.

There are two basic ways to add a sidebar to archive pages. The easiest for beginners is just to copy and paste the existing sidebar code into the correct place in the archive templates. The slightly more involved, but much preferable method is to create a separate file with the sidebar code and use a PHP include or an MT include to include the file into the various templates. You can also very easily move a sidebar from the right to the left side of your weblog pages.

Where is the Sidebar Code?

The MT3.2 stylesheets and...

continue reading ...

Sticky sweet goodness abounds in this bright, clean style.

Click image for a full size sample. (opens in a seperate window)

Blueberry Cherry Grape Lemon Lime Orange

Posted by The Style Monkey at February 22, 2005 11:12 PM

continue reading ...

A very simple but elegant design featuring a dark background with lighter "panes" for the content areas.

Click image for a full size sample. (opens in a separate window)

Black Cherry Coffee Dark Sage Dark Teal Dusty Rose Jade Plum

Posted by The Style Monkey at January 9, 2005 10:36 PM

continue reading ...

A simple design, using complementary colors on a field of grays. Click image for a full size sample. (opens in a separate window)

Olive Cornflower Eggplant Subtle Olive Purple Peachy

Posted by The Style Monkey at January 3, 2005 09:05 AM

continue reading ...

Less is more in this clean monochromatic design.

Click image for a full size sample. (opens in a seperate window)

Bluebell Carnation Lilac Mango Mint Sea Foam

Posted by The Style Monkey at January 22, 2005 05:12 PM

continue reading ...

Less is more in this clean monochromatic design. This style is a fixed width of 900 pixels.

Click image for a full size sample. (opens in a seperate window)

Bluebell Carnation Lilac Mango Mint Sea Foam

Posted by The Style Monkey at February 19, 2005 12:57 AM

continue reading ...

The default Movable Type MT3 templates come with a sidebar on the right side of the Main Index page, but not on any of the individual entry, monthly, or category archive pages.

There are two basic ways to add a sidebar to archive pages. The easiest for beginners is just to copy and paste the existing sidebar code into the correct place in the archive templates. The slightly more involved, but much preferable method is to create a separate file with the sidebar code and use a PHP include or an MT include to include the file into the various templates. You can also very easily move a sidebar from the right to the left side of your weblog pages.

Where is the Sidebar Code? MT3.1 and...

continue reading ...

This tutorial is written by LMT guest author Arvind Satyanarayan of Movalog.

Updated Nov 16

The default styles that come with MT are known as 'fixed' styles. This means that size and position of layout elements, such as columns, are fixed and are defined in pixels (px). This also means that no matter what a person's screen resolution, everything will be the same width and in approximately the same position. The alternative to a fixed design is a fluid design. A fluid design uses percentages when defining size and positions, so the sizes of elements on the page are relative to the user's screen resolution. A fluid design also removes the horizontal scroll bar. With a fluid...

continue reading ...

I was recently confronted with the task of creating a two-column liquid layout with a header and footer in which the content needed to come before the sidebar in the source code. I took opportunity to demonstrate an under-used aspect of CSS: negative margins. Negative margins allow us to push the content area away from the sides of the browser, leaving room for the sidebar.

Starting out simple

To show how negative margins can be helpful in creating liquid layouts, let's start by creating a liquid two-column layout with a header and footer. The main content area will be on the left, with the sidebar on the right. This would normally be a very simple process, but we are...

continue reading ...

Learning Movable Type has an article that guides you through the steps of creating a three blog layout. The only problem is that the #container width has ben set to 904 pixels. This means that on a 800x600 layout you're going to get the nasty horizontal scroll.

The best way around this is to create a fluid three column layout ( what are fluid/fixed layouts ?).

1.Change the width of #container to 90%

2.Delete #center and corresponding div tags in all your templates

3.Duplicate your sidebar, find the following/similar code in your stylesheet #right { float: left; width:200px; overflow: hidden; }

And replace it with the following: #right { float: right; width: 20%;...

continue reading ...

Updated Sept 14, 2004

A sideblog is a separate weblog which appears in the sidebar of your main weblog. Sideblogs are often used as a convenient way to list out interesting links, something akin to a frequently-updated, public list of IE favorites. Rather than mixing in your "this link is cool" entries in with all of your other entries, with the accompanying overhead of code for individual entries, comments and trackbacks, you can streamline your links into a linkblog.

A great example of a linkblog can be found at MovableBLOGthe Asides section in the right sidebar.

Making a sideblog is pretty straightforward; it can be accomplished by creating a new weblog in Movable Type and using...

continue reading ...

At long last I've made some updates to the Style Generator to better fit with Six Apart's standard. This means that you can finally apply the tips discussed in this tutorial to stylesheets created using the style gen. Most of the other changes are mostly on the backend code so that it's easier for me to build on it in the future. The only real change on the frontend is the addition of a splash page that allows you to select the number of columns - as cool as the on-the-fly capability was it was a major pain to support. A big thank you to Six Apart for letting me use their images, I'm a terrible graphics designer!

The biggest feature I am working on right now is the ability to load...

continue reading ...

<MTOnThisDay> Movable Type Plugin

The plugin support for Movable Type 2.2 is fantastic! And now we can develop the stuff that Ben just hasn't gotten around to yet. Here's one-- I've created a container tag that lets you pull entries that match the current system/entry month and day.

If you want to read more about it, visit the MT Plugin support forum page I've set up for this plugin.

To download the plugin, click here.

Updated on July 5. See included readme.txt file for details.

...

continue reading ...

Among the many websites that are out there, few are standards-compliant. Among those few, only a handful sport style sheets adjusted to the needs of handheld devices. Of those which do offer styling for handhelds, not all will fit the smallest, lowest-resolution screens without presenting the user with the ultimate handheld horror: namely, horizontal scrolling.

The Opera browser runs on handheld devices of all screen sizes and resolutions, some of them only 120 pixels wide. We work for the company that produces Opera, so we can offer a degree of insight into the functions of Opera for handhelds. In this article, we've prepared a set of general suggestions for creating a...

continue reading ...

It's Movable Type Fun Day!

First start with Paul's account of switching from .html file extensions to .php, and how gracefully MT handled the transition. Even existing off-site bookmarks don't break!

Then head over to Scott's place to read up on how he managed to wrangle Movable Type into producing human-friendly, meaningful URLs instead of the arbitrary sequential URLs that MT ships with. Fun!

Then take a look at the URL attached to this post (click the title), and rejoice for I too have switched to more meaningful URLs. Except… oh wait. Look at that. No I haven't.

The intent is there, but instead of something nice and tidy like...

continue reading ...

A very simple but elegant design featuring a dark background with lighter "panes" for the content areas.

Click image for a full size sample. (opens in a separate window)

Black Cherry Coffee Dark Sage Dark Teal Dusty Rose Jade Plum

Posted by The Style Monkey at January 9, 2005 11:24 PM

continue reading ...