July 2008 Archives

Today marks the launch of the new KinetixHosting site. Our company is dedicated to providing a variety of well supported web hosting services to your small business. We made this new site with Movable Type and the Universal template set to demonstrate that a small business can easily make a simple web site to communicate effectively with their clientele.

Karla Blue 905

We believe that what you write (what search engines see on your site) is the most important part of a business web site. No matter how many people you can reach with your site, the major search engines reach more. So we think you should concentrate on what you write. The MT platform makes it easy to focus on the words, and the Movable Type UTS provides a simple visual framework to easily drop them in. KinetixHosting provides the servers and fast network platform your company needs to put your content on the web.

Soft Orange Lilly

Over the coming months, we will be using this power to help our customers by creating articles which will allow them to better use our systems and the Movable Type publishing platform. We got started with an article describing the similarities and differences between pages and entries. Another example is our description of a great way to begin to customize the templates by building on a predefined style sheet.

Sunflower Bee

One of the first ways you can begin to make the Movable Type predefined templates look more customized is to change the image on the front page. The selector for which you must change the CSS properties is #homepage-image .

You may save any of the images linked to this post, or make your own 905 × 170 pixel rectangular image. Then you must change to URL of the background image to refer to the image you have selected. This article describes how to write such customize CSS code for MT in an organized way that will allow you to update templates easily in the future.

The other day, on one of MT mailing lists, someone commented on how difficult it was for the average user to edit the CSS files that are created when a style is selected for a blog using StyleCatcher. On this site we have presented an alternative which does not involve editing the files from StyleCatcher, and makes it possible to easily refresh templates without loosing all your customizations.

From CSS2 Specification : Assigning property values, Cascading, and Inheritance

Imported style sheets also cascade and their weight depends on their import order. Rules specified in a given style sheet override rules imported from other style sheets. Imported style sheets can themselves import and override other style sheets, recursively, and the same precedence rules apply.

On our site, we create a new template, and name the output file kinetix.css.

Custom Style Template - Edit

Then in the Style Sheet template we add a line to include our own styles. Since we import our style sheet after the StyleCatcher style sheets, any property values we define will over ride the values from the StyleCatcher files.

@import "/mt_static/themes_base/blog.css";
@import "//universal_black/screen.css";
@import "/kinetix.css";

Another advantage to making changes this way is that if we refresh templates we will only have to add one line to have all our customizations replaced.