CCK with Imagefield and imagecache with drupal 5

Imagefield gives you the ability to add images to your content type, but image field alone can’t handle resizing and generating thumbnails, that’s why we’ll use Imagecache to handle the resizing and thumbnails.

Imagecache allows you to a create preset to manipulate images on the fly. You’ll understand a lot more about imagecache once we start playing with it.

Requirements:
Drupal 5.2
Cck 5.x-1.6-1 (http://drupal.org/project/cck)
Imagecache 5.x-1.3 (http://drupal.org/project/imagecache)
Imagefield 5.x-1.1 (http://drupal.org/project/imagefield)
Clean URLs enabled

I’ll assume that you know how to install modules and have already used and installed CCK.

Install Imagefield
To install imagefield go here http://drupal.org/project/imagefield to download the module and place the module in sites/all/modules. Once copied simply go to Administer -> Site Building -> Modules to install the module.

1.jpg

Configure Imagefield
Go to Administer -> Content Management -> Content Type. Here you can create a new content type or use an existing one. To add the imagefield edit your content type and then click on Add Field.

2.jpg

Type in a name and select the Image field type, then click on Create Field.

3.jpg

In the next page customize the field label.

4.jpg

Then select “required” from the data settings and click on save field settings.

5.jpg

Install Imagecache
To install imagecache go here http://drupal.org/project/imagecache to download the module and place the module in sites/all/modules. Once copied simply go to Administer -> Site Building -> Modules to install the module.

Configure Imagecache
Go to Administer -> Site Configuration -> Image cache. Here we are going to create 2 presets, 1 for full node view and a thumbnail preset for the teasers.

Step 1:
Fill in the Preset namespace.
6.jpg

Step 2:
Select Resize from the Add a new action drop down box. Then click on Update preset.
7.jpg

Step 3:
With in the resize fields set the width and height to 50%. What this will do is resize an image to 50% of its original size. Then click on Update preset.
8.jpg

To create the teaser preset simply repeat all 3 steps. But on the third step set the width and height to 10%.

Configure Imagecache and imagefield

Go to Administer -> Content Management -> Content Type and edit your content type. Once on the edit page click on Display fields button.

9.jpg

In this screen we set which preset will be used for the Full and teaser view.
Under the Full dropdown box select your full node view preset and under teaser dropdown box select your teaser view preset.

10.jpg

Now just simply go to Create content and create something with your content type.

Conclusion

By itself drupal doesn’t handle images very well, but imagecache and imagefield really do go a long way. The only thing that’s missing with imagefield is being able to set the limit of uploads, I did how ever find this patch (http://drupal.org/node/137518) to add a upload limit but I have not tested it out yet.