Excellent way to get a photolog into your main site. Mine isn't quite that fancy. I will need to work on it some.

To save you some time, I already mentioned that Jeremy W has written a tutorial about creating a photo blog and adding entries via includes into another blog. I've read it and it's very good. He's just doing the final touches and it'll be ready to go soon.

That's a great tutorial. Thanks for taking the time to walk us through your system. I have one question, for anyone, though.

Is there an easier way to split the thumb from the main image? It requires a bit of understanding code, which I'm not sure my wife will remember each time she uploads a baby pic.

My guess is that this is the best way, but if someone has figured a work around -- even changing the MT backend -- I'd be keen to try it.

Having tried a couple of others, I think Brenna's is an awesome solution. My problem with the others is that it the end result looks great but the adding images requires too much fiddling with html -- both in time (when you are adding lots of pics) and in sophistication for the non-Web person.

I really like having the thumbnail link to a seperate page and not just a bigger image, so I don't want to go with the straight-forward MT solution.

As near as I can tell, there is no real downside to not coding height and width in a photo -- particularly if there is only going to be one large pic on a page -- that seems to make Brenna's solution a pretty good one.

Thanks for sharing it with us.

Joel

Is there a reason my upload interface does not have the thumbnail option?

I want to have a photos page on Minnesota Gardener so that the main Photos page has thumbnails that each link to an individual archive page with the full-sized version of the image. I made a separate Photos blog so I could format the index and archives with different templates but I can't figure out how to make the images different sizes on the index and archive pages. I don't want a popup or just the larger image in the browser so the "Upload File" function doesn't work for this purpose. Can I do what I want entirely managed by MT or will part of it be manual?

I'm not satisfied. Don't get me wrong -- this may work for you... but I'm looking for a blog to fit my site-in-construction:
thehuses.

Our site has 6 blogs -- one for each family member. The main page is still in production, so please excuse that -- I'm searching for a solution in another post. Each person's page is their blog's main index. I want to have the last X (# or days) of their posted photos running (as linked thumbnails) down the right column after the archive info.

I'd like to have 1 photo blog where each person could be an author. I'd like them to use the upload file form for both thumnail and full-size image, and to use categories to flag images for inclusion in their main page's running thumbnails. Can this be done with one blog? Ideally, we could catagorize a photo for 2 people and it will show on both index pages -- but if I use a blog for each person's photos, that is not possible -- and it's just another pain.

Does anyone have examples of what I'm trying to do? Thanks!

Laurim, I was just referring to the fact that I could explain how I made the thumbnails and larger sized images work easily on my photoblog.  :)

But I look forward to seeing the tutorial!  I am always happy to hear tips from anyone!

Kristine

Because your server doesn't have Image::Magick installed, presumably.

Hey all, sorry for the baited delay in the tutorial. Thankfully somebody kept encouraging me so I got it ready to go for you all to check out. So here you go:
A Photolog In Five Easy Steps

Yes, I have the same exact size for every image and every thumbnail and that is hard-coded in the templates.  :)





Like I said, this won't work in every situation, but it's great for me.  :D

Brenna

Well, what I do for this problem is I put my photos in two folders.  one is /photos/ and the other is /photos/thumb/.  The ones in thumb are whatever size I want the thumbnails to be.  Then, when I post a new post, I upload both the full photo and the thumbnail.  Both thumbnail and full-size have the same exact filename.  Then, in the New Entry area, I put the filename (file.jpg) in the excerpt spot (whichever you want, that's where I put mine).

In the templates, if I want the thumbnail, I'll just put the following:



and if I want the full-size:



If you want this more in-depth, please tell me, I'm not sure how much you wanted about this.

UPDATE: I just realized you were wondering how to do this completely with MT.  I haven't figured that out, so I currently just upload the image with FTP.

I don't know why you couldn't use just one photo blog with multiple authors and then use categories, author names and all the other available variables and logic ( to specify which of the photos show up in whose blog. Use alternate index templates to create a txt file with the list of photos that will show up in other blogs and use MTInclude or a server side include to make those .txt files show up in the other blogs' files. Jeremy's tutorial will explain this part.

Like his set up, that's how I run Pixelog too.  I FTP my thumbnail images though because they have to be the same size for my design.  I use includes also to get the thumbnails over in to Blah Blah Blog.  I have to add that Jennifer gets all the credit for setting mine up though - we collaborated on how it should be done, but she was the one to make it happen.  (That's what happens when you announce in public that you need a project to work on!)

It's a great way to keep the content fresh on two sites.  I've written up half of a tutorial already for how to do it, but I don't know when I'll find the time to finish it - so I'll look forward to Jeremy's too!  

No offense intended to Brenna but I initially tried a similar way as her method (entry just the name of the file and adding "-thumb" to the index's version of the link info) but it didn't work for me. The thumbnail would show up on the index page but the full sized image wouldn't show on the archive page, even though looking at the code showed the link was there and should have worked. I think it has to do with the fact that you can't specify the image's dimensions in the code to make it generic enough to work for any image. Brenna's code examples don't show specified image dimensions but her photos pages have image dimensions in the tags so she must either hand code them individually after the page is rendered or always have the same exact size for every image and has that hard-coded in the templates. In any event, not specifying image dimensions slows down the rendering of a web page so a large page of photos will take longer to download than it should. If you will have photos of differing sizes and orientations,  I believe Jeremy's method is more appropriate. If you will have images all exactly the same size, Brenna's method will work if you include the image dimensions in the template code.

Others know far more than I, but I've never seen/heard of a problem with pages that I've created that have no height/width specifications.

Is validation an academic issue, or does not having the height/width create real-world problems? If so, 5% of the time? 50% of the time?

The validator checks for an alt attribute, but not for height and width.  Of course, it is recommended to define them so that the browser knows what's going on.  But it's not a validation issue.

Brenna

For your viewing pleasure...here's two other sites that incorporate that use moveabletype and other technologies to create photo blogs:

beausmith.com/europe/ uses a combination of moveabletype, PHP, and javascript to create it's photoblog. This one doesn't use thumbnail images but rather links that call a javascript to preload and swap the images. PHP is used to parse the 'additional entry text' field which contains the path to the directory of images, the image to use as the first image, the city, the country, and a custom PHP function is used to create the links in the entry. The site works great on macs and some PC's. I'm trying to figure out how to include the rest...

jayallen.org/glass/ uses a style more like the jeremy w's "five step photolog." Each log is a category which contains all the entries in that photolog. Javascript is used to preload all the images and swap them as you click on the thumbnails...

enjoy.  

Here is how I set up mine, which needs a name.  :)  

In this example, all of the images have the same extension: jpg.  The shortcut won't work if you have mixed file types.  I created a subdirectory named "img" in my blog and that's where I upload them to because I like to have the picture files separate from the html files.  That's optional, just modify the template code to reflect the right path.

Upload the image using MT's upload feature.  In my case, I type img in the (optional) Local Archive Path, to upload to that img folder I have.  I also have my Local Archive Path and Local Site Path defined as the same thing in Blog Config, so uploading to either goes to the same place.

Leave Create a new entry using this uploaded file selected.  Check Create a thumbnail for this image and select the size.  I've been making mine all the same at 80x60 Pixels.  Click "embedded image".

So now you have a new entry started with the code that MT dumped in there for you.  All you need is the name of the image.  Say it's named jerry.jpg, you only need the jerry part.  This is because the image is jerry.jpg and MT named the thumbnail jerry-thumb.jpg. Everything after the jerry part will be coded into the template.  I put this in the Excerpt.  Just jerry, not jerry.jpg  

You don't need the rest of the code so type the picture's description in the entrybody part instead.  Assign category and title and save.  The entrymore is unused, yay!

Template code to make thumbnails that link to the larger image (individual archive):


Template code for the full size images on the individual pages:


Another nice thing is it uses MTBlogURL, so the web addresses aren't hard-coded into the entries.

Brenna

PS, it got long when I explained it, but it's not hard at all.  :)

Well, besides the fact that your code won't validate w/out the height & width....

Thanks xxAxel1xx! I got a similar reply from jeremy at
Kingdom of Squirrels. He has a separate Photo blog and uses the Excerpt portion of the entry page form for the thumbnail, the extended entry for descriptive text and the main entry for the full-sized image. He uses the Upload File utility to get the images processed and onboard. He then adds the thumbnail excerpts to his main blog page via an include. I think I've convinced him to write a tutorial to share it with everyone else

Oh, I think your idea would work!

You could set up all 6 people as authors, and then 2 categories for post and nopost.

This way, you could create 6 index templates that had something like this to start them out:


As far as thumbnails and large images, I'm doing all of my uploading of images with MT and then using it to create my thumbnails for my Snap! photoblog.  I might put together a tutorial on how I'm doing this if it would help anybody!

Kristine

Just adding onto what Brenna said - she's right (AFAIK!) about not being a validating issue - but pages that don't define widths and heights tend to load slower because the browser has to get that data as it loads the page up



--A piece of useless trivia from the brain of Kristine--

Ah, you are correct. When I checked with them, they noted that they will not install it because they found the software buggy and it creates security problems. They have been very good to add and update other software I've requested, but I still need a good option for uploading and managing images. Anyone have ideas? I need to allow for several web-stupid authors to upload images and thumbnails to a photo-blog using MT.

Does anyone have any additional information or experience why Image::Magick would be a security problem for my host?