Converting MT 2.x styles to MT 3

By Arvind Satyanarayan on | Filed under Design & Templates | Comments (2)

Learning Movable Type has a tutorial on how to apply MT 3 styles to a 2.x blog but what about the other way around ?

I scanned two similar stylesheets to see what changed, basically the only thing you need to change is the definitions names mostly, the actually style definitions can stay the same. I am assuming you are using the default MT 3 templates Here is what has changed with the CSS from MT 2.x to MT 3 styles - it may not be perfect but it'll be darn close. I have listed the MT 2.x definitions and then the MT 3 definition it needs to be changed to:

  • .description becomes #banner h2
  • #content and .blogbody becomes .content
  • #links becomes #right
  • .title becomes .content h3
  • .date becomes .content h2
  • .posted becomes .content p.posted
  • .side becomes .sidebar
  • .sidetitle becomes .sidebar h2
  • .calendar becomes #calendar
  • .calendarhead becomes #calendar caption
  • .powered becomes #powered

You will need to add the following code to your stylesheet

.sidebar ul {
    padding-left: 0px;
    margin: 0px;
    margin-bottom: 30px;
}

.sidebar li {
    color: #666666;
    font-family: Verdana, Arial, sans-serif;
    font-size: x-small;
    text-align: left;
    line-height: 150%;
    margin-top: 10px;
    list-style-type: none;
}
#comment-data {
    float: left;
    width: 180px;
    padding-right: 15px;
    margin-right: 15px;
    text-align: left;
    border-right: 1px dotted #BBB;
}

textarea[id="comment-text"] {
    width: 80%;
}

and the following style definitions can be deleted

 .syndicate {
        ...         
        }
    .comments-body {
        ...
        }       

    .comments-post {
        ... 
        }   


    .trackback-url {
        ...
        }


    .trackback-body {
        ...
        }       

    .trackback-post {
        ... 
        }   


    .comments-head  { 
        ... 
        }       

    #banner-commentspop {
        ...
        }

If you find any more changes that I have forgotten to add please do post a comment !

2 Comments

Dasme said:
on Aug 10, 2004 12:12 AM | Reply

Great article! I've linked to it on my mainpage. Hopefully it will allow my visitors to easily convert their old stylesheets to the new MT3 templates.

Mush said:
on May 19, 2005 12:01 AM | Reply

This is great, thanks! I'm going to try to reverse-engineer it to use MT3 stylesheets on my 2.X blog.