Creative Commons License
This weblog is licensed under a Creative Commons License.

Main

October 24, 2006

XAMPP!

I found this way cool open-source project called XAMPP. It's an all-in-one bundle for Windows of Apache, MySQL, and PHP - so no more live testing on the web site

Comments

Automation Part 1

This week I'm starting in on a long put off project - the full automation of picture and blog publishing. I love Picasa and so I am going to a make a go of leveraging it, but I'm not sure if that will work out. My first step is the full automation of the insertion of a Picasa-exported HTML page into my pictures database. A while back I moved my pictures solution from being text-file based to being MySQL based, and have been slowing building a up a web admin page where I can backup, restore, add, edit and delete photosets from the database. However, I still had to manually tweak the HTML of each photoset to link it to its previous and next ones. Today I hope to finish it (started it yesterday). Then the BIG leap is to build a combo photo publishing/blogging tool. Hence the short term fix!

Comments

August 15, 2006

Now Playing - Craig's Blog on Movable Type 3.3

Well that was painless - I decided to try out Movable Type 3.3 (now free for personal blogging, nice!), and unlike the last time I tried to use MovableType and Yahoo! hosting, it was really easy. The config file was way, way simplified - I just had to put in my mysql info, and I was ready to go. I exported my old blog, copied all my uploaded files (and used this as a chance to consolidate a bunch of random directories I had created), and BAM! I was up and going. Aside from cleaning up a few entries that had gotten totally hosed, it was painless. The question is, do I try to move the family blog over - 680 entries, tons of uploads, boy that seems like a recipe for work for a long time.

Comments

July 22, 2006

Cool Banners Revisited

I've had the cool auto-built banners up on our family blog for four months now. I noticed that I kept clicking on the pictures when I wanted to see the collection associated with it, to no avail. So last night I set out to make it work.

I vaguely remembered something about image maps in HTML, and after some Googling, found it the right syntax. The trick was to build the image map dynamically when the banner loaded, and to build a map for each banner. More googling on what functions I needed, and I was off to the races.

Continue reading "Cool Banners Revisited" »

Comments

July 9, 2006

Dynamic Movable Type Calendar

I was never able to find a satisfactory solution to having a calendar in the sidebar of my Movable Type blogs, so a while back I set about to build one that I liked (you can see it at work on this blog). Thanks to some great code from Kevin Devens, I didn't have to figure out how to render a calendar, so I just needed to solve the problem of figuring out what days had blogs. The PHP code to do this is here: calendar.php.txt (6 Kb).

After the break are examples of using this in the various MovableType template types.

Continue reading "Dynamic Movable Type Calendar" »

Comments

July 1, 2006

Flexible Movable Type Archive Sidebar

Its been a while since a detailed nerdy posting, so I figured it was about time. As my boy's blog has gotten longer (and this one too), I began to dislike how long the archive listing got on the side. I wanted to be able to collapse years together, and after about an hour and half of screwing around this afternoon, I got it to work - code follows the break. You can see it working live on this site - all the entries for 2005 are grouped together in the Archive section of the sidebar.

Continue reading "Flexible Movable Type Archive Sidebar" »

Comments

March 24, 2006

Cool Banners

I wanted a banner for my boy's blog, and so I spent a bunch of time and picked out 6 or 7 pictures, painstakingly resized them in Photoshop, and then painstakingly figured out how to get text to go over top.

Tonight I wanted to change the banner and I figured there must be a better way. And so I wrote one in PHP. I took the random image code I wrote ages ago and used that to generate random images until they had filled a banner image, then I figured out how to get text to overlay, too: banner.php.txt (4 KB)

The "secret sauce" to using this code is to make sure you have a /fonts directory with .ttf files (just copy your favorite truetype fonts from C:\WINDOWS\Fonts\) and to have pictures published in the same way I documented before in my publishing system blog.

The other cool thing I figured out was how to have a random banner each time. I used banner.php to generate a bunch of different logos, copied them to a /logos directory (named logo1.jpg through logoN.jpg), and then added this little bit of code to each page in my boy's blog (in this case, I had 20 logos generated):

<head>
<script type="text/Javascript">
function RandomLogo()
{
var img = Math.round(Math.random()*20)+1;
imgname = "http://theboys.theeislers.com/logos/logo" + img + ".jpg";
document.images.item("logoimage").src = imgname;
}
</script>
</head>
<body>
<a href="http://theboys.theeislers.com/" accesskey="1"><img style="margin-top:4px" name="logoimage"></a>
<script language="JavaScript">
<!--
RandomLogo();
//-->
</script>
</body>

Enjoy!

Comments

February 28, 2006

Publishing System Addendum: Home Page

Forgot to blog about how I did the home page (http://www.theeislers.com). This page is designed as a composite of all the things we have: KT's blog, my blog, our blog about our boys, and our pictures. A while back, I wrote some PHP that can read an atom or RSS file and create links to the recent blog entries. I leveraged this, plus the random picture selecting code I wrote for the pictures page to build our home page.

The home page still links to individual pages for KT & I, the boys, and our dog (poor cats don't get a page!). That is pretty obsolete, my thinking going forward is that the blogs should be the primary page, with links in the side bars to the kinds of things that are linked to from the individual page.

Here is the code you need: homepage.zip (3 KB). It has to be copied to the root of your web site. Index.php is the file to customize for the blogs, pictures, links etc.

This is incremental to the site code for pictures that was part of the first publishing blog below - SiteRoot.zip (8 KB)

Comments

My Publishing System

A kind internet wanderer named Mike recently sent me an email complimenting me on the web site I've created for the family. He asked me how I did it, and since a couple of my friends have asked me about how to set up something the way I did, I thought "hey - what a great topic for my technology blog".

I use Yahoo! Small Business for hosting. They are very reasonable - $19.95 a month buys you 10 gigs of storage, a huge amount of transfer (400 gigabytes a month), hundreds of 2GB email addresses, the ability to manage your domain, FTP, and support for publishing technologies like MySQL, PHP, and MovableType. They also have a $11.95 package that is the same except 5GB of storage and 200GB data transfer.

My approach has refined over the past 8 months of blogging. At first, all I posted were pictures. My approach for years was manual - crawl through the pictures, and use Photoshop to create an internet friendly version and a thumbnail. Then I would manually create the HTML for each picture set. Gah! It took hours to get photos up. I eventually ran out of steam doing that and my photo publishing lagged for over a year until I discovered Picasa. Then last June I started blogging, and this is where photos, video and narrative all merged to our family blog.

Photo Publishing

Picasa changed everything for me - I add a label to a photoset, go through and cull the blurry ones from the label, and then click on the label and select "Make a web page". I didn't like the default templates provided as they insert a Picasa logo and weren't customized to my site navigation, so I made a couple of tweaks which you can find here: PicasaTemplate.zip (50 KB). These files copy into C:\Program Files\Picasa2\web\templates - the links.js and style.css are there because Picasa 2.1 starting hanging without them. Links.js is some javascript that adds whatever links you want beside "Next set" and "Previous Set". I created links.js so that I could the various links whenever I wanted without having to go back and re-edit every single photo set I published. I chose the blackbg template and customized as follows (you only need to know this if you don't want to use the template I provided):

  • HEADER.HTML, ITEMHEADER.HTML and INDEX.HTML: change the stylesheet reference from "style.css" to "../style.css". This will have each photoset you publish share the same CSS, so you change change it in one place only.
  • IMAGETARGET.TPL: remove the '#' sign from thumbnailWidth and thumbnailHeight, and change the numbers to 200 from 160. I like bigger thumbnails than the default.
  • INDEX.TPL: in the first line, change "Template blah blah" to something you can identify like "Craig". Also, like IMAGETARGET.TPL, make the changes to thumbnailWidth and thumbnailHeight
  • TARGETLISTHEADER.HTML: little bit bigger change, remove the text between the tags, and replace it with:

    <a href="/indexfull.htm">Previous Set</a> | <a href="/indexfull.htm">Next Set</a><SCRIPT src="../links.js" type=text/javascript>

    Each time you create a new photoset, you just change the "Previous Set" and "Next Set" hyperlinks to link between the most recent photoset and the newest photoset.

That's it. I use Microsoft FrontPage to publish, and all I do is copy the directory created in My Documents\Picasa Web Exports. Yahoo runs FreeBSD, which doesn't support spaces or punctuation in filenames, so you will have to manually rename the directory before copying it - I just eliminate punctuation and replace all spaces with underscores ('_'). Copy the directory you just renamed to the appropriate directory in your web site in FrontPage (I use a master directory called Collections - you need to copy the style.css and links.js from above to this directory, by the way), go into FrontPage and link the new set with the last set and vice versa. It is quite quick in FrontPage - just select the "Next Set" in the older set, right click and select "Hyperlink", and link it to the new page. Then do the same thing for"Previous Set" in the new set, remove the hyperlink from "Next Set", and republish.

I used to manually create a link to each photo set on a static page, but that got old and time consuming, plus I couldn't search, sort, or categorize my pictures. So I created a little PHP program that dynamically generates a main pictures page based on an index file. T he index file is called "picturelist.txt" (I include a sample in the download package below in the "Setting up a Blog" section) and it contains simple information for each photo set: URL, directory, date, title, and whatever categories you want to assign, e.g.:

http://www.theeislers.com,/Collections/2005-11-25_Two_Best_Friends_Conked_Out,2005-11-25,Two Best Friends Conked Out,Angus,Cats

Pictures.php generates a page from this information. It is pretty cool, see it in action here

Aside from pictures.php, there is also newpictures.php that needs to be run every time you add a picture set. Newpictures.php generates the last pictures and thumbstrip that you see in my boys blog. You run it by entering http://www.yoururl.com/newpictures.php into your browser. I used to compute the last picture list and thumbstrip at page generation time (along with a cool calendar), but Yahoo! has pretty random performance for PHP that accesses the file system, so I had go to this publish-time instead of real-time method.

That is all there is to my photo publishing system - I can go from photos copied off the camera to published on the internet in 5-10 minutes, depending on how long I spend culling the photoset. I also like to do a blog for each picture set I publish, I find it to be a great way to remember context of the photoset. At some point I would like to link the photoset back to the blog, too, but that would be a bunch of retro-work that I keep putting off.

All the PHP for my pictures is found below.

Setting up a Blog

The main page for my family is my boys blog. I use Movable Type through Yahoo's hosting to host and manage this site. Setting up Movable Type is pretty straightforward - you just go into your Yahoo! control panel and follow the instructions. If you aren't using Yahoo!, my earlier blog about how to set up MovableType on Yahoo! might be helpful - I wrote this before Yahoo! supported MovableType natively, and a lot of the stuff you need to do should be the same on any hosting environment. There is also stuff there on how to move your blog out of Blogger which is irrelevant if you aren't doing a transfer from Blogger (duh!).

I built my own custom set of templates - I don't like MovableType defaults, they are 2 column (not 3) and assume an 800 pixel wide display, which is really out of date. My templates are 3 column and assume a 1024 wide display (which is also way out of date - my new Dell 30" display is 2560x1600 pixels, which KICKS ASS). Assuming that Yahoo still hasn't fixed the rebuild bug, once you change the templates (below), you will need to follow my instructions on how to make rebuilding work.

My left column has a custom archive feature that I built based on the same idea I had for pictures - the ability to sort and filter the blogs. The "Recent Pictures" and "Found Pictures" strips found on the left and right column come from code that is generated when you run the newpictures.php file I referred to above.

Copy these files to the root of your blog directory: BlogRoot.zip (9 KB). This code does one thing only - it allows a viewer of your site to dynamically change the color scheme of the blog. It was a nerdy feature that seemed like a good idea at the time. You can remove this ability by editing the Alpha Module template (see templates below).

Copy these files to the root of your site: SiteRoot.zip (8 KB). This is the code that handles all the picture stuff from the previous section.

Here are the templates to install in MovableType: Templates.zip (15 KB). This is a little work as you have to create a bunch of templates in MovableType. There is a directory for each class of templates:

  • Indexes: you need to either create a new index template (for bloglist.txt and bloglist.php) or copy the contents to an existing index template (index.php and styles-site.css)
  • Archives: replace the contents of Category Archive, Date-Based Archive, and Individual Entry Archive with the contents of the supplied text files
  • Modules: I designed a LOT of flexibility into the "gamma" module templates (the right hand strip), perhaps too much - when I was done adjusting for all the performance problems of PHP on Yahoo!, all the Gamma_*** templates looked the same. Anyway, you need to "Create New Template Module" in the Modules template section with a name that exactly matches the file name (less the ".txt") of each file in the Modules directory of Templates.zip. For example, you need to create the template "Alpha" in the Modules template section that has the contents of Alpha.txt.

The only screwing around you will have to do with the above is to find all instances of "www.theeislers.com" and change it to your main site URL, and to change all instances of "theboys.theeislers.com" and change it to the URL of your blog.

Note that all of this assumes that the blogs are in a subdirectory of the main ftp site and the pictures are in a directory called Collections. I don't know what happens if you don't do it this way - Caveat emptor, and remember, you are getting what you paid for with this code!

Mobile Blogging

Setting up mobile blogging is pretty easy - Flickr has a really nice feature for this (it does require you to blog with a photo, mind you, but that is how I do it so it works for me). After following the instructions, you get an email address you can send a photo to that will not only publish to Flickr, but will publish to your blog. The subject of the email becomes the blog title, and the body of your email becomes the text. Just add the email address that Flickr gives you to your phone address book and you are good to go, assuming you have a camera phone that is configured to send mail.

I don't like to leave the Flickr photos there - I prefer 320 pixel wide pictures, and Flickr only gives you 250 or 500 as options. So usually when I get home I republish the mobile blog (using Anconia RocketPost, discussed below) with the larger thumbnail linked to the full pictures. But that is pretty anal and probably not necessary.

I found one cool side effect of mobile blogging through Flickr - they mashed up with QOOP, and you can print a photo book that has all the subjects and text you typed in. I ordered one Friday night, it was only 13 bucks for 12 pages (48 pictures). We'll see how it turns out, but it is a neat idea.

Blogging tools

I blogged about the lack of tools but finally found one I liked - Anconia RocketPost. It is the only one that lets you drag and drop pictures easily. My wife loves it - she is a big fan of weaving pictures into her blogs. RocketPost has issues - so fair warning as it is a bit buggy for the $99 price.

  • RocketPost doesn't respect the "upload as draft" status or a manually set date when you post. It happened with this post - I wanted to get it into my blog from my laptop so I could edit it from home, and it ended up published even though I had changed the status from "publish" to "upload as draft" and I had to go into the web interface for MovableType to put it back to draft status.
  • You enter a width and height for default thumbnail size, and the tool respects height instead of width. So if you have pictures from different cameras with different height/width ratios, the width of the thumbnail varies instead of the height. I HATE this - I want fixed width, variable height, since my blog has a fixed width for each post. I should be able to chose which dimension I want to be fixed (height or width), and let the other get computed based the relative height/width of the photo in question.
  • RocketPost doesn't clean up its HTML very well when you edit in WYSIWYG mode. For example, in this post I wanted some text to be Courier small font. Then I changed my mind and wanted extra-small, so I selected the text, and chose extra-small text. No change. Tried again. No change. Tried a bigger font to see if that mattered. No change. And again and again and again. Finally I look at the code, and the text had dozens of tags around it, but the inner most tag set was the original "Courier small font" set, and so all that got rendered was that. RocketPost also doesn't delete the tag when you delete a hyperlinked image, so you end up with more dead HTML. That is a theme, lots of dead HTML can get left behind.
  • Sometimes WYSIWYG mode pegs the CPU (and renders the editor unusable) if you have a lot of pictures or rich text (I was constantly pegging my laptop while writing this blog on the plane Saturday).

All grousing aside, RocketPost is the best tool I have found. They update it regularly, which I love - I am delighted with it overall. When all else fails, using the web interface is fine, but if you want to have pictures resized & auto-thumbnailed, along with having your blog autosaved every couple of minutes so you don't lose anything, RocketPost is awesome.

Comments

January 1, 2006

Improved Archive Page for MovableType

Before I moved my boy's blog over to MovableType, I had built a way to view and sort all the blogs I posted in Blogger. That was a necessity, since Blogger doesn't offer any way to show all your archives or search your blog. When I moved the blog to MovableType, I just went with the default archive page - which after using it a couple of times, I hated! It is just a giant spew of every blog entry (378 in the case of my boy's blog), without any ability to make heads or tails of them. So today I set about re-creating my old archive page, only in Movable Type.

In my old method, I had to manually create an entry for each blog in a text file - a pain in the butt, to say the least. Thanks to MovableType's flexibility in creating auto-recreating index files, this problem can be made to go away. So the first step is to create an index template that will build the file with all the archive data needed for the improved archive page. I created an index template (with the output file "bloglist.txt") as follows:

<MTENTRIES lastn="99999">
<$MTEntryPermalink$>####<$MTEntryDate format="%Y-%m-%d-%H%M" $>####<$MTEntryTitle remove_html="1">####<$MTEntryAuthorUsername$>####<MTENTRYCATEGORIES><$MTCategoryLabel encode_xml="1"$>####</MTENTRYCATEGORIES>
</MTENTRIES>

This creates a file with every entry (well, assuming you have less than 99,999 entries ). It saves away the link, the published date, the author, and the categories for the entry. The #### separator is arbitrary, it could be anything that isn't likely to be found in the blog data.

Next step is to create an index template with the output file "bloglist.php" (or whatever name suits your fancy) that processes this data. The code is here: bloglist.php.txt (13 KB). Also I changed out the archives link to point to bloglist.php instead of the crappy old archive page, and deleted my "master archive" index just to spite it.

Things of note to use this code:

  1. Line 189 is where you put in the URL to the bloglist.txt file.
    GetBlogData( "http://yourblog.com/bloglist.txt" );
  2. My blogs are 3 column, and I put the Alpha & Gamma div's into template modules as I reuse them in all my templates. My alpha div is style="float: left;" and my gamma div is style="float: right;" so that they can be rendered ahead of the usually slower-to-render central beta div. Line 228 & 230 is where these get included, and will require customization:
    <$MTInclude module="Alpha"$>
    <$MTInclude module="Gamma"$>
  3. If you do two column or one column blogs, you will also need to tweak lines 232 and 233 to be be alpha divs instead of beta.

That's it. This will allow the archives to sort be sorted by date (newest to oldest and oldest to newest) & by blog title, to be filtered by author and category, and to show more granular date information. To see this in action, check out my boy's blog archive.

Sadly, my real job starts again Tuesday and my Christmas break of messing with PHP will end. Writing PHP for a hobby is like building model airplanes for a hobby, only only it's limited to the uber-geeks.

Comments

December 28, 2005

Yahoo! hosted Movable Type rebuild fix

When got done moving my boy's blog and this technology blog over to the officially supported Yahoo! Movable Type solution, I noticed that my main blog pages weren't rebuilding when I changed an entry or posted a new entry. Turns out there is a problem with editing templates - the "rebuild_me" flag gets turned off as soon as you save any changes to the template. In the standard version of MT 3.2, there is a checkbox when editing your template that says "Rebuild this template automatically when rebuilding index templates". This checkbox is missing in the Yahoo! implementation, and the form is defaulting to setting that flag to 0 whenever you save a template.

This manifests itself as a pretty bad bug - the main blog page is not automatically republishing when a blog entry is added. A bug that was super easy to find if any testing of modifying templates had been done. Makes one wonder. Anyway, after reporting this bug to Yahoo! Small Business support, they helpfully responded with instructions on how to set up a blog with Movable Type. When I pointed out that I already knew how to set up a blog and furthermore hadn't asked for help setting up a blog but rather had reported a bug, they responded with "oh, in that case, we'll look into it" and I haven't heard anything since last Saturday.

So while I was (am still) waiting for them, I figured out a work-around.

Edit /blog-mt/lib/MT/WeblogPublisher.pm. At line 596 (at least in the version I have now), there is this statement:

if (!$tmpl->build_dynamic && !$param{Force}) {
next if (defined $tmpl->rebuild_me && !$tmpl->rebuild_me);
}

Comment out the "next if" statement with '##', and volia! all the index templates rebuild with each post. Suboptimal solution, as the site javascript and stylesheet don't need to rebuild with each post, but they are small and quick to rebuild, and at the main blog page rebuilds, which is critical.

Now let's see when Yahoo! fixes it.

Comments

December 27, 2005

Phew! The exhausting cutover is done.

I've spent the past couple of weeks moving my boy's blog over from Blogger to Movable Type. The big hold out for me was two things - easy blogging with a photo, and mobile blogging

The last time I checked for a good photo blogging tool (aside from Picasa, which is fantastic but only posts to Blogger), I couldn't find anything that worked. Finally, though, I stumbled on Anconia Rocketpost (which I am writing this blog in). You can create a resized image with a thumbnail, and drag and drop just works. So whaaa-hooo, blogging a photo problem solved. I of course once again forgot that Movable Type has a different password for using the API than logging in, so wasted a ton of time trying to figure out why I couldn't publish using the tool. Six Apart say this for security, I say it is asinine and non-intuitive - if my password can be hacked, my API password can be hacked. Give me a break.

The other issue was moblogging - Blogger supports it, Movable Type does but you have to be able to set stuff up on the host, which Yahoo doesn't support. Yahoo is now supporting Movable Type as part of its small business hosting, but they didn't add mobile blogging (after all, who would want to do that???). I found a solution with Flcker, which supports mobile blogging to any blog and ironically is owned by Yahoo. The downside is that you can't choose the sizes, they force them on you - either 240 wide or 500 wide, but not 320 or 400, the sizes I like to use in my blog. 500 resized to 320 looks like crap, so I am using 240 and then updating the photo once I get home. Less than ideal, but it gives me moblogging.

I used the same blog transfer template that I used to move this blog into Movable Type, and aside from forgetting about the fact that you have to use a tool that doesn't save both CR and LF characters after each line (what a stupid requirement of Movable Type importing, by the way), I had no hiccups. I should read all my instructions, I suppose.

So the cutover is now complete - My Boy's Blog is now running on Movable Type. It is way cool now - I have all the pages as PHP, which allowed me to do a user-select color scheme, a dynamic blog calendar, a photo strip, and real-time latest photo & blog links. I'll blog some of that PHP code later. Also there is a lot more flexibility with the kinds of archives I can have - daily, monthly, total. And search is supported out of the box. I totally dig it.

The other excitement was cutting over to the Yahoo! Movable Type implementation - but that is for a later blog, I have to go for P.T. for my torn biceps tendon...

Comments

November 27, 2005

Feed Digest Woes

I was pretty excited at first about Feed Digest - it looked like a cool way to add access to my blogs easily to different web pages. But then the woes set in: if you delete a blog entry, FeedDigest remembers it. For the life of me, I can't figure out how/why - they must be keeping around historical data, because the atom.xml file doesn't have the deleted entries. And if you update an entry for any reason, it pops up as the most recent entry - again, I can't figure out how/why. And so I gave up.

My old profession to the rescue: I wrote some PHP that did exactly what I wanted - you can download the code if you can't help yourself. And I'm now inspired as to how to write a web based RSS/ATOM xhtml reader so that I can get at my favorite blogs via my phone's browser (I've been underwhelmed by the native & java apps I've found). More on that later, I hope.

Comments

I didn't see this the first time reason, but I'm Peter from FeedDigest.

The reason for the archiving is simple. Our users all demanded it. Many use digests to show archives of their/other sites, and/or their delicious bookmarks. Many feeds only show 10 items, so this is necessary.

You can override it though by ticking 'Show only live items' for your digest. That would have solved both the problems you pointed out :)

September 25, 2005

Using MT 3.2 & 3rd party publishing tools

Okay, this is documented deep in Six Apart's web site, but as I spent forever trying to figure out why I couldn't log in using a 3rd party tool, I am recording here to make sure I can figure it out again one day in the future.

Log into MT
Click on your username in the top navbar to go to your profile
Scroll down to the bottom where you see "API Password"
Input the password of your choice and save. For security reasons, it should be different from your normal password
Use that password in your client software

Bah humbug, I wasted hours trying to figure out why these 3rd party editing tools would work. Once the above was sorted out, I could at least give it a go. I was looking for something that would allow me to post pictures as easily as Picasa and as Hello. Alas, it would appear that no one wants to make it easy to select a photo and create a web-friendly size and a thumbnail.

w.bloggar
Forget it, nothing but generic uploading. It's nice enough for generic text blogs, but my blogs, especially my blogs about my boys, are picture intensive.

SharpMT
Just like w.bloggar - nice enough, but designed for text only blogs, with uploads & images an afterthought. Drag & drop - forget it. Plus you have to install the latest beta of .NET framework V2 to use the newest bits - so everything gets to go slower than it should.

Qumana
You can insert an image, but it goes in full sized. Wonderfully useful with 7megapixel images. Some stuff is just broken, like categories just give "invalid login". And shell drag & drop doesn't work.

BlogJet
Okay, BlogJet tortures you by almost getting it right. It has a nice code/normal view. You can resize images. You can create a thumbnail of an image. You just can't create a thumbnail pointing to the resized image. Doh. And once again, shell drag & drop doesn't work - what is up with that?

Ecto
Okay, this one was the worst torture of all - it is SO CLOSE! Bummer is that categories don't work. And of course, drag and drop doesn't work. Actually, this one is funky because it "works" except that you can't access any of the checkboxes/edit controls for creating a thumbnail or reducing the image size. But if you browse and find a file, you can specify a thumbnail and a resized image, specify an upload directory, and BAM! Ecto inserts the proper code into your post & everything is uploaded properly. COOL!!! Sadly, when you upload another, Ecto doesn't remember the any of your settings. You have to go to the Thumbnail tab, click that you want a thumbnail, re-specify the thumbnail width, then go to the Conversion tab, click on resize, and re-specify the new width. You even get to re-specify the upload directory. Ecto - make drag & drop work, and remember settings around thumbnails and resizing, and I'm in - your product is damned cool!

Comments

September 13, 2005

Movable Type, Blogger Transfer, and Yahoo Hosting: The Saga

Here is the saga of how I went about getting my Blogger hosted site moved to Movable Type on my Yahoo! hosted web site. I Googled like crazy and couldn’t find any documentation, so I hope that this history/saga helps someone else not go through the same 2 day pain I went through.


How to Get Movable Type Started on Yahoo!

First off, follow along from the Moveable Type 3.2 Install and Upgrade instructions. That helps a lot.

Make a copy of the software into a directory called "mt" on your local machine

Delete mt\php\extlib\smarty\.cvsignore as Yahoo's servers barf on any file that is just an extension (funny - the windows shell won't let you create a file with a name like that, but you can open it and move it just fine)

Copy the "mt-static" subdirectory of "mt" to the root of your site

Create a cgi-bin directory at your site root, copy the "mt" directory there (but not the mt-static sub directory)

Made sure you have a "tmp" directory at the root of the FTP site as movable type relies on it

From the MySQL db admin page (typically www.yoururl.com/db), created a new database called "blogs"

Copy the file mt-config.cgi-original to mt-config.cgi

Change CGPath to CGIPath http://www.yoururl.com/cgi-bin/mt

Uncomment the five MySQL variables, database is "blogs", fill in the mysql userid & password you are using, and set DBHost to "mysql" for yahoo.

Uncomment the StaticWebPath variable, set it to http://www.yoururl.com/mt-static

Uncomment CGIMaxUpload, set to 10000000 if you want to allow the upload of big files

Perl & Send Mail: Yahoo uses the standard defaults (/usr/bin/perl & /usr/sbin/sendmail), so nothing to do there.

Run http://www.yoururl.com/moveabletype/mt-check.cgi/ if all is well, you will get back "Movable Type System Check Successful". FYI, Yahoo is missing the following functionality, all optional for movable type
Image::Magick for creating thumbnails of uploaded images.
Crypt::DSA for accelerated comment registration signin.
XML::Atom for using Atom API to post and manipulate blogs.

Lauch www.yoururl.com/cgi-bin/mt, click on the link to set up the new installation, click on "finish install" and you should have the joy of being presented with the login screen

For the first time, the userid is Melody, the password Nelson, and off you go! Create your accounts and delete the Melody one right away.

Blogger Instructions
To pull your stuff out of blogger, replace your template with:

<Blogger>
TITLE: <$BlogItemTitle$>
AUTHOR: <$BlogItemAuthor$>
DATE: <$BlogItemDateTime$>
-----
BODY:
<a name="<$BlogItemNumber$>"></a>
<$BlogItemBody$>
-----
<BlogItemCommentsEnabled>
<BlogItemComments>
COMMENT:
AUTHOR: <$BlogCommentAuthor$>
DATE: <$BlogCommentDateTime$>
<a name="<$BlogCommentNumber$>"></a>
<$BlogCommentBody$>
-----
</BlogItemComments>
</BlogItemCommentsEnabled>
--------
</Blogger>

Before you publish, go to Settings/Formatting,
change Show to 999 posts
change Timestamp Format to MM/DD/YYYY HH:MM:SS

In Settings/Comments
change Comments Timestamp Format to MM/DD/YYYY HH:MM:SS

and then do a preview. right click, view source, cut out the couple of lines of HTML at the start & beginning, then save.

The bummer is that it is getting saved with these goofy non-standard quotes & dashes, which choke movable type. So I used frontpage to do a search & replace for the quotes and commas (find a goofy one, copy it so you can CTRL_V it into the search line, and then get the replace character just by typing a ‘ or a , in the replace line.

But wait, it's worse - the default for Blogger is to have \a\n (carriage return & line feed) characters written at the end (very common), but movable type will only accept only accept a linefeed at the end. So to save the file properly, I had to punt to my old editor (open-watcom-win32-1.3.exe, look for vi.exe – I should probably blog at some point about how that editor evolved) with a feature that I turned on in about 1992 (set nowritecrlf, which allowed the editor to save files like QNX (and other unix systems) wanted to see them, with just a line feed only). BLARGH!

Then create an import directory in the mt directory, copy the file you messed with above there, and you can now use the import/export function to bring in your old blog.

StyleCatcher

I wanted to install StyleCatcher, a cool way to change your style quickly.

Because I chose to keep my mt-static directory elsewhere (per the recommendation of the MT installation), installing StyleCatcher was a pain in the butt. You have to change the settings as it botches it up - it won’t work until you do the following:
- Go to Plugins
- Click on “Show Settings” for StlyleCatcher
- Change Theme Root URL to be http://www.yoururl.com/mt-static/themes
- Change Theme Root Path to /mtstatic/themes

But wait, there’s more – it also botches up the bitmaps once you get it working (PLUGIN_STATIC_URI resolves to something goofy), so you have to modify two of the templates in /cgi-bin/mt/plugins/StyleCatcher/tmpl/ - gmscript.tmpl amd view.tmpl. In both, you have to change

to

http://www.yoururl.com/mt-static/plugins/StyleCatcher/

and then everything works great.

Stats

A cool way to track your blog stats is the statwatch plugin. I went to http://www.raquo.net/statwatch/, downloaded the software, followed the install instructions (I put <$MTStats$> into the main index template) and boom! I was getting stats. Much easier than StyleCatcher install for sure. Make sure to put the MTStats tag at the bottom of the template, I put it at the top and it created this mysterious blank line on my page that I could not figure out fore the longest time

3 Column Style & 1024x768 displays

The real bummer is that I wanted a 3 column style, and wanted to have my blogs be good for a 1024x768 display, not an 800x600 display (the default of all the MT styles). The MT styles are fuxed to 800x600 displays, so if you want a bigger screen, you have to pick a style and then manually customize it. So while StyleCatcher helped me find my style, I had to then customize the heck out of it. And now StyleCatcher is useless to me, because all the StyleCatcher styles are hardwired to 800x600 displays (why not 640x480? come on, it's only 2005, I'm sure at least 3 or 4 pc's out there are at 640x480, don't want to leave them out!!). Anyway, more on that later.

Comments