A great way to easily customize the look of your Movable Type weblog is to replace the default title banner with a banner image. There are two basic methods for adding a banner image - adjusting the CSS or adjusting the index and archive templates.

Before making template adjustments, you first need to prepare your banner image. You might choose to use an image that will take up the entire banner space, or you might want more of a logo-like image that would only take up a part of the banner space, with a solid color making up the difference. Photographic images that extend to the edges of your weblog's container work best for banners in "fixed width" styles, such as in the default...

continue reading ...

The first thing you might want to do when customizing your Movable Type blog style is to change the color of the background, banner, headlines, or text. This is pretty easy to do; the adjustments are made in your weblog's stylesheet template.

Before you start, you should have a basic understanding of how colors are coded into a web page. Open up your stylesheet from the templates menu in your MT edit screen. If you scroll down you will see several instances of the word "color" followed by a # sign and six characters comprised of letters and or numbers. These six characters represent a color; the first 2 characters affect the RED tones of RGB, the third and fourth characters...

continue reading ...

In my recent re-design on Movalog, I had three banners and unfortunately I liked them all and couldn't figure out which one I liked best. As a result, I decided to use them all.

First I moved all the images to a subfolder called banner and renamed the images to 1.jpg, 2.jpg and 3.jpg. Finally I used PHP's mt_rand function to randomly print a number from 1 to 3 (mt_rand works better than the plain rand function function), like so

<?php echo mt_rand(1,3); ?>

Hence my banner image code looks like this

<img src="http://www.movalog.com/images/banner/<?php echo mt_rand(1,3); ?>.jpg" alt="Movalog - All Things Movable Type" />

continue reading ...

Question

I want to put an image on the top of my page instead of just my blog name. How can I do that?

Answer

Modify Stylesheet Template Only

This method makes it possible to change all of the pages at the same time. It also assumes that you still have the default class and ID names in your templates. • Upload image file.

• In the Stylesheet template, edit the banner section, specifying the location of your image, and the correct width and height: #banner { background-image:url(http://example.com/image.gif); background-repeat: repeat-y;...

continue reading ...

Gautam Patel asks

I want to upload images but there is some html I want generated in each image invariably (not just the standard stuff) -- for example border="0" or align="left" or whatever. How do I hack the MT tmpl files/scripts to do this?

Open the file lib/MT/App/CMS.pm and around line 1902, find the following

my $link = $thumb ? qq(<img src="$thumb" width="$thumb_width" height="$thumb_height" border="0" />) : "View image";

As you can see, for the most part it is simple HTML. To align left, just add the attribute like this

my $link = $thumb ? qq(<img src="$thumb" width="$thumb_width" height="$thumb_height" border="0" align="left" />) : "View image";

There are two other lines you...

continue reading ...

The default Movable Type layouts don't give you a lot of choice in terms of navigation. Clicking on the top bar with the title of the weblog will take you back to the main page of the weblog. Every other nav element is in the sidebar. You can however, pretty easily add a horizontal nav bar, with links to important-to-first-timers, or frequently used areas of your site, such as archives, about, or contact links.

Adding horizontal nav bar requires adding a few lines of code right underneath the banner section in your index and archive templates and adding a few new elements to your style sheet. Once you've created your navigation code, the most efficient way to add the code to the...

continue reading ...

Tutorials in Alphabetical Order

"Email Me" Contact Forms A Safe Way to Upgrade to MT 3.2 Add Your Links Here Adding a Footer Adding a Sidebar - MT3.1 and Earlier Adding a Sidebar to the Default Archive Templates Alphabetize Your Entries Amazon Web Services An Overview of the MT Program File Directories Applying MT3 Style Templates to MT2.X Background Patterns Backing Up Your Blog Banner Images Blog Maintenance Blogger Audioblogging with Movable Type CGIWrap and suEXEC Category Archive Pages Category Customizations Closing Comments Colors - Background, Banner, Headline, and Font Colors - Experimenting With, Using MTSetVar and MTGetVar Combining Multiple Blogs Into One Concerning Spam Converting from Fixed to Fluid Style...

continue reading ...

The tips in this tutorial are designed around the templates for MT 2.661 and earlier versions.

Once you have set up category archiving, the next step is to customize the category archive display pages. The default Category Archive Template that comes with Movable Type lists the whole entries (not excerpts), doesn't tell the viewer what category she is actually viewing, and has no intuitive link back to the home page. We'll address these issues here.

1. Listing excerpts instead of full entries. You may want to keep the archives as is, with full entries. But if you have few categories and lots of entries you will soon have very large and long category pages. Changing to excerpts...

continue reading ...

I've assembled some templates to build a photo gallery with Movable Type. What makes mine different and special from all the others? Easy: it's compatible with MT version 3.2. That means it'll work with the StyleCatcher plugin and the Movable Type Style Generator!

The only special requirement to use these templates is PHP. PHP is used to calculate the image size. The plugin Better File Uploader - with its For Photo Gallery button - will make adding photos go much quicker.

I've created a small example gallery, if you're interested in seeing the result before trying it yourself.

Setup a New Weblog

First, you'll want to create a new...

continue reading ...

I've assembled some templates to build a photo gallery with Movable Type. What makes mine different and special from all the others? Easy: it's compatible with MT version 3.2. That means it'll work with the StyleCatcher plugin and the Movable Type Style Generator!

The only special requirement to use these templates is PHP. PHP is used to calculate the image size. The plugin Better File Uploader - with its For Photo Gallery button - will make adding photos go much quicker.

I've created a small example gallery, if you're interested in seeing the result before trying it yourself.

Setup a New Weblog

First, you'll want to create a new...

continue reading ...

Any internet marketing professional will tell you, just as we will, that an effective Search Engine Optimization campaign can generate more traffic than an expensive banner-ad program, or costly and time-consuming pay-per-click methods. Some of the best methods of optimizing a website are ensuring that a page is not overly heavy in file size, maintaining a good content to code ratio, using lots of relevant content, and filling the page with as much text and links as you can without "spamming" the search engine spiders.

We're not going to cover all of the basics of XHTML and CSS. We assume that you have a basic, working knowledge of the two languages and have...

continue reading ...

UPDATE: Make your own

With Movable Type 3.12, Six Apart built in a more powerful set of quicktags and on the whole they worked pretty well and looked quite nice too. I didn't really want to go back to the clunky Quicktags of before. So here are a few hacks to port some of the most useful features (in my opinion) from the old quicktags, to the new. You will need the following files • edit_entry.tmpl, this is found in MTDIR/tmpl/cms • mt.js, this is found in your StaticWebPath (or if you have none in your root MTDIR folder)

I have decided to port over four functions, Spell Check, Encoding HTML and Insert Image

Spell Check

Add the following to the end of your mt.js file

function Spell(myField)...

continue reading ...

After the dutchpink was released, I had an idea to skin Movable Type such that a user could easily switch between stylesheets. So after a lot of work with javascript, here is the package:

SkinningMT.zip SkinningMT.tar.gz

1. Extract the contents of the distribution 2. Upload the tmpl files in ASCII to the appropriate places (MTDIR/tmpl/cms) 3. Upload mt-styleswitcher.php and the styles/ directory into your StaticWebPath (if none then your into your MT Directory, same location as mt.cgi)

The drop-down menu shows up on the main menu ( screenshot) The only requirement is that your server runs PHP. The styles directory, its contents and mt-styleswitcher.php goes into your StaticWebPath. In mt-styleswitcher.php, change movalog.com to your domain name...

continue reading ...

UPDATE: I had pulled out the functionality to check spelling with this toolbar, well I've put back the functionality. Just download the quicktags.js file that coressponds to your version of MT again and re-upload it. A new button called "Dict." will appear that will query a highlighted word to dictionary.com !

Please go to the MT 2.x instructions to fix a problem with the Quicktags not aligning properly.

This tutorial will allow you to have the Quicktags I described in my previous entry but is not restricted to MT 3.01D.

The files you will need:

Quicktags.js

The MT 2.x Version | The MT 3.x Version

Upload the quicktags js file to your staticwebpath - ie the same folder than...

continue reading ...

Looking for a way to incorporate a Photo Gallery into your MT blog? Check out Photo Gallery Templates from StopDesign.com.

There are many ways to create a web-based photo album or photoblog in Movable Type. This tutorial addresses just one method for creating a photo album, and is based on the steps I took to create my MT-based photo album. This tutorial is for experienced MT users and assumes familiarity with plugins, CSS, creating a new weblog, category archiving, and uploading images. Although long, the tutorial is easier than it looks, especially if you want a photo album that works just like mine. It's always the customizations that take time. In this tutorial I will give...

continue reading ...

I have been playing around with Zoto and I'm quite impressed.

Uploading Pictures

One of the things about this service is the ease at which you can upload photos. Just download their client (called Zulu) set it up to scan folders where you put your photos and it'll do the rest for you meaning it scans the folders, makes thumbnails of the images and uploads them ! If you add photos to those folder then the client will pick them up too. I experienced a few problems with the client. It told me it had uploaded all my photos yet when I looked in my account they didn't show up, on uninstalling and reinstall the client they showed up !

Of course you could manually upload them, by selecting...

continue reading ...

T'was the week before Christmas, and Mac users received an early present: upgraded versions of Opera Software's Opera browser and Microsoft's Internet Explorer. We test drove and reviewed both, then asked browser makers Håkon Lie and Tantek Çelik to respond to our comments.

Opera: the mini–review

The Opera Browser for Macintosh now comes in two flavors: Beta 5 for systems 7.5.3–9.2, and Beta 3 for OS X. Opera Mac beta supports CSS1, HTML, XHTML, and much of ECMAScript 1.1 (the web–standard version of JavaScript).

Fast and light

Beta 5 is incredibly fast at rendering web pages. They seem to spring onto your screen in the blink...

continue reading ...

Some days ago, a new version of MTLookup was released. Please read Second version of MTLookup released for the announcement. I will describe the new features in several posts, which will be published here in the Movable Type Weblog.

Today, I want to tell you about several small improvements.

Website Selection

With the first version of MTLookup, either all or a single website was searched. Today, there are more than 20 websites and you can select any combination of websites as the target of your query.

The websites can be selected one by one with the help of checkboxes. As the websites are grouped, you can also select one of three groups thus selecting several websites at the...

continue reading ...

One very exciting new feature in MT3.2 is the new handling of the default templating system. Instead of one consolidated file tucked away in the source code, the default templates have been created individually and are stored in the default_templates folder in the MT directory. Customizations are much simpler now - no more hacks - just edit a default template right from the folder. Thanks to the new TemplateRefresh feature (a plugin included in the MT installation), there is great ease in applying default templates for use across your entire installation, both for existing AND newly created blogs. All it takes now is one simple action to selectively (or corporately) apply MT3.2's...

continue reading ...

You now know why there hasn't been any updates in nearly 20 days! I'm very proud to announce MT Blogroll 1.0. Basically MT Blogroll is a blogroll manager, similar to blogrolling.com. You are able to store various details about a link including its URI, Name, Description and Relationship and assign them to various categories. If you have been using another blogroll manager like blogrolling.com or blo.gs, you can use the Import OPML tool to import those links into MT Blogroll.

I would suggest reading the README first which describes the installation process and includes some example code. Other documentation includes the Tag Reference which describes the template tags that MT Blogroll...

continue reading ...