Recently in Images Category

I post a lot of thumbnail images on Consuming Louisville that link to very large full size images. By default Movable Type doesn't add scrollbars or allow resizing for the popup windows created for images. That's a problem because those large images of mine get cut off with no way to expand the window or scroll to see the rest of the image. So of course I needed to turn on scrollbars and turn on window resizing for image popups.

Like with changing the default image upload location I wish that there was a simple way, within the Movable Type application, to do this but there isn't one as far as I know. Instead we have to do a little monkeying around with the Movable Type application code. But, again like with changing the default image upload location, the is actually quite simple and only requires editing a single line of a single file.

This tutorial is cross posted at On a path media

Actually this applies to any version of Movable Type since 3.2 and to all kinds of external apps for posting to your Movable Type blog. I just suspect that the Blog This feature from Flickr is probably the most popular external blogging tool out there and it's really frustrating when you can't get it to work.

I should mention this post was inspired by my friend Cecily who recently wrote about posting from TextMate to a Movable Type blog. Her post reminded me about how the web services password can cause problems when setting up a Movable Type blog to work with Flickr's Blog This feature.

When you go to setup your Movable Type blog with Flickr you'll be asked for your password. Many folks put in their password only to be told its incorrect. They check and double check and absolutely certain they're putting the right password in only to still be rejected. The problem is that Flickr doesn't want your main blog password (the one you use to login to your blog with). What Flickr wants is your web services password.

flickrblog.png

If you don't know what your web services password is that probably means you haven't set one up yet. System Overview -> Users -> Your User Identity

(This article is cross posted at MovableTweak.)

A client recently asked me if they could have an easy-to-manage banner ad setup, with the ability to add advertisements and specify links and alternate text, while at the same time being able to manage them easily. Sounds like a job for… Movable Type!

This tip can be used for any ads, or any images for that matter. There are four basic steps: upload the ad, create an entry for it, create the php file and include it in your template.

Nearly every article for my site Correspondence Notes contains at least one image. I use Movable Type's built in upload feature to upload images and add them to entries. The process is fine except for one step. By default Movable Type will upload images to your Site Root. That's great except I like my images to go into a subdirectory I like to call...images. I can of course, with the file upload utility, tell Movable Type to put the images into the images subdirectory. The problem is that the utility will not remember this preference. Every time I upload an image I have to tell Movable Type again to put the new image in the images directory instead of the Site Root. Though it only takes a few key strokes to type "images" into the subdirectory field it's a silly time waster since I want every single image I upload to go into that folder.

Since there isn't an option within the Movable Type user interface to make the file upload utility remember that I want my images to always go into the images subdirectory I decided to go straight to the source and make it happen.

Image::Magick is one of the Perl modules you can optionally install for use with Movable Type. With this module in place and working correctly, Movable Type can create thumbnails of any of the images you upload. Images as thumbnails help your pages load faster and help reduce visual clutter because large images can be resized so they don't push the text of your entries away. Installing Image::Magick on a *nix machine is pretty routine if you are into perl package management, but on Windows it can be tricky.

Installing Perl and ImageMagick on Windows sounds easy enough. Download the installers (Perl [1], ImageMagick [2]), click a few times and you're ready. At least, in theory. Unfortunately, this has not been the experience for many people, including myself. Sometimes Image::Magick wouldn't show up in ActiveState's Perl Package Manager (ppm) after the install had finished. Other times mt-check.cgi seemed to choke on it, using up all memory or simply saying Image::Magick wasn't there, even after ppm claimed it was. Or if mt-check could in fact find it, sometimes Movable Type itself would pretend it was not there, not offering any thumbnailing options when uploading an image (and/or eating up all memory). In short, enough to pull your hair out.

By LMT contributor Jesse Gardner of PlasticMind Design and Movable Tweak. This article was also posted on Movable Tweak.


Unfortunately, trying to create a photo album with Movable Type is less than simple. Integrating photos into your blog feels like the days when dinosaurs roamed the earth. One great solution is Byrne's Photo Gallery Plugin, but that's more of an 'out of the box' solution. Here we'll walk you through some extremely useful techniques that give you complete control over what happens to your images and how Movable Type spits them out.

Uploading Images and Photos

| 9 Comments

Posting photos and images to your weblog entry is easy in Movable Type.

1. Prepare your image for the web. First make sure your image is a manageable size. Whether you are using software that comes with your digital camera or specializied photo software such as Adobe Photoshop or PhotoElements, reduce the image size of your image so that it will comfortably fit in the space provided by your weblog at a resolution of 72 dpi. Most cameras take images at high resolutions so that they will be able to print out well on photo paper. Your computer's screen resolution however is a low 72 dpi (dots per inch). So if you want to see what your image will look like on your weblog, view it at 100% at 72 dpi. Some products such as Adobe ImageReady let you optimize your image for the web, in other words use special compression algorithms to reduce the image's file size so that visitors on a dial up don't have to wait 10 minutes to see your picture. Photos are best optimized as jpg files (suffix of .jpg) and graphics are best optimized as gif files (suffix .gif). I try to keep all of my images and photos to less than 20K, preferably less than 10K. This ensures that they will load quickly in a browser.

2. Choose where on your server you will store your images. For easier server housekeeping purposes, create a directory within your weblog directory where you will store your jpg and gif images.


3. Select Upload File from the left hand side of your weblog editing menu.

upload-file.gif

About this Archive

This page is an archive of recent entries in the Images category.

HTML and Javascript is the previous category.

Install is the next category.

Find recent content on the main index or look in the archives to find all content.