how to use images in your drupal content

if you simply want to add image content to your drupal nodes etc, the array of options can be baffling. here's a quick overview of some options you might want to consider.

overview

if your requirements are simple, a combination of the image module and the image assist module should meet 90% of needs. if you want to know more or do something fancy, read on.

drupal's core upload module

drupal's core upload module allows you to attach any content to your nodes, including images. it's very limited since it doesn't allow for image scaling, image management or image presentation. it's not a good choice for images.

the image module

the image module allows you to upload images as full drupal nodes. you can configure this module to provide up to 6 different server-generated image sizes for each of your nodes. image nodes can be created by users using the usual "create content" path or by uploading an image during the creation of the node to which an image is attached.

overall this is a very nice module that might meet all your image needs

the image assist module

it's hard to select images to add to your nodes once you have a lot of image nodes in your system. the image assist module is a big help. this module allows end-users to easily create images and add styled image content to their nodes, using a pop-up dialog. images are optionally filtered by ownership or taxonomy.

the image cache module

having to define a finite set of size transformations using the image module can be limiting. the image cache module gets around this restriction by allowing you to define an arbitrarily large number of image transformations including scaling, resizing and cropping. e.g. you could simply define a transformation "minithumb" that creates a tiny thumbnail. if your image was available at:

http://www.example.com/files/Picture0011.jpg
you could access this transformed image at:
http://www.example.com/files/imagecache/minithumb/Picture0011.jpg

the transformed image is cached, so repeated hits to this url don't require repeated server side transformations. pretty cool. you see more imagecache examples in my fantastic four article.

the cck imagefield module

the image field module provides an image property for your cck nodes. this module is well written and integrates seamlessly with the image cache module and the views module.

so when should you use cck and imagefiled?

cck and imagefield is a good choice for node types where:

  • you have a finite, well understood set of images that go with the node, e.g., if the node was called "shoe" you might have cck image properties "shoe front view" and "shoe top view"
  • you know how to style each instance of the node ahead of time e.g. your shoe product page should have a 100px "front view" at the top of the page, and a 500px wide "top view", at the bottom.

conversely, for a blog entry, you'd probably be better to use the image and image assist modules to add arbitrary images to each node instance, and lay them out as you see fit.

for example, this picture of my daughter, ava, and skimble the cat, which i've added to this blog, in an arbitrary position.

tech blog

if you found this article useful, and you are interested in other articles on linux, drupal, scaling, performance and LAMP applications, consider subscribing to my technical blog.

i am trying to implement

i am trying to implement more images in a single page.i download fck editor .it is uploaded images and not displayed in a browser.

waiting for the result

John, thanks for a great

John, thanks for a great blog...used your info in this post...had problems with upload images...thanks again

hi i liked your blog thanks

hi i liked your blog thanks i was trying to upload pics at my druapl web but you helped me to do so .

Hi John, You have a

Hi John,
You have a really nice blog here based on drupal. I am thinking of starting a blog and have been testing drupal on my local machine. I have a couple of questions if you do not mind answering.

Do you use a WYSIWYG editor like tinymce ? If so what are your thoughts on it ?

I installed tinymce on my machine running drupal and it is working properly but has a few glitches.

I can't figure out how to enter "code" html tag using tinymce and I most often end up entering it by typing the tag.

Each new line I enter in tinymce is replaced by a 'br' tag. Is there any way to ensure that the 'br' tag is not inserted by tinymce ?

And finally which combination of image module do you recommend ? I see that you have provided a number of choices in your post.

Thanks

>> Do you use a WYSIWYG

>> Do you use a WYSIWYG editor like tinymce ? If so what are your thoughts on it ?

i dabbled with tinymce early on, but ended up finding it easier and faster just to use the text input. drupal's nice content input format and filter model makes it easy for you to define suitable text-based input for different types of contributors to your site, from full html and php code for expert users, to heavily filtered and restricted html marketup for novice users.

>> And finally which combination of image module do you recommend

for a basic blog i recommend the combination of the "image" and "image assist" module. they'll allow you to do almost anything you want for a basic blog site, and they are pretty easy to install, configure and use.

Please note, this entry has been closed to new comments.