Drupal Articles » Documentation case studies » How do I add images to my Drupal site?
User information
A new Drupal user, who has just recently installed Drupal 6. No knowledge or understanding about how Drupal works is assumed. I installed Drupal 6 because, of course, it's the newest version, and I don't know that "contributed modules" might not yet be available for it. I may have some prior experience with other content management systems, which might affect my assumptions about how Drupal works. My computer skill level is at least intermediate.
Goal
To find out how to add images to my new Drupal site.
Steps Taken
- Tried using the search form: "add images to Drupal". I clicked some of the results, but they are all people asking the same question as me, many with no reply, or else displaying dizzyingly complicated PHP code. Tried the following searches as well, with no better results: adding images to drupal, images in drupal, including images, how to add images. I've now given up on the Search feature. (note: a search for just "images" was the only useful search, leading only to Image module, but this user didn't use that search).
- Clicked the main Documentation tab.
- First tried Getting Started and found nothing after several minutes.
- Moved on to Beyond the Basics.
- After about 5 minutes of clicking many many links and finding very little (e.g. I found HowTo > Node Listings with Thumbnails using Drupal 5.1, CCK and ImageCache ... but this is way over my head, and anyways it says Drupal 5.1), I finally came across Beyond the Basics > Contributed modules > Asset and media management modules (http://drupal.org/node/206708). This page is a "start" but still not what I was looking for, and I was lucky to even find it in the place it's categorized (since I'm a newbie, I don't know what a Contributed module is... I'm looking for how to add images - I don't even know yet that I'm going to have to install a "contributed module" to do this). But I've found this page now, so let's see if it helps. I'm a newbie and the word "Asset" doesn't mean anything to me (and "Media" sounds like audio/video to me), but I happened to notice a few instances of the word "Image" in the listing of sub pages, so I think this might be worth looking into.
- Clicked on "Asset Manager" since it's first. Hmm doesn't make a lot of sense to me. A comment below on the page says it doesn't work, so I'm moving on.
- Clicked on the next link, "Asset: Unify asset file management". The screenshots are a welcome surprise, though I'm not sure what they mean. I don't see any mention of images though, so this couldn't be what I'm looking for. Moving on.
- Clicked on "Embedded Media Field: Third Party Videos, Audio & Images". This looks pretty scary to me. It mentions terms like fields for nodes, CCK, %YourType%, and I've also noticed the version info at the top right. I'm using Drupal 6, so I must be in the wrong place. Ah now I see this is for embedding images from "other" sites. Moving on.
- Clicked "Gallery: Embed Gallery2 in your Drupal site". Galleries have images, so maybe... nope this won't work. It wants me to install some other software besides Drupal.
- Clicked "Image painter". Woah! Scary. Moving on.
- Clicked "Image: image nodes, attached images, and galleries". Ahhh now this is looking more promising. I don't know what "Each image is stored as a node" means, but I'll keep reading. I've now read this page, and this looks like the way to go. But I see a few "more" mentions of images in the menu and have started to grasp at this point that there are a variety of possible ways to do this. I bookmark this page, and decide to have a peek at the other image links just in case.
- I click "IMCE: Image uploader and browser". Uh oh. This looks promising too. Now I'm not sure what to choose. I click the link to view the IMCE 6 Demos. I click the "Image" icon, but at first can't figure out how to do anything here that has to do with images. Ah there's a little weird icon next to Browse. And there it is, IMCE. Not bad. I decide to click back and watch the screencast to learn more about this. Oops, the link to the screencast is broken.
- I take a quick peek at the menu to see it there are yet more image modules I need to look at. I see "Img package: Easy way to display images in posts & comments". Nice! It says it will be easy - I click the link. I read a good bit of info on this page and decide to click on the link to the Img Package project at the top. What?! This module has been "abandoned"? Why didn't you tell me that before while I was reading all that stuff on the previous pages?
- I take a last glance at the menu and see no further mention of "Images". So this must be all there is. (of course I will hear about a variety of other image modules later that weren't listed here and be confused at why I hadn't known about them earlier).
Post test notes
- The results of the test were not promising. I had a particular page in mind that I've read in the past, which compared a number of the image module options, and was unable to find it despite my own best efforts. If I couldn't find it, even knowing it was there somewhere, a newbie would only find it by sheer random luck.
- The page I did find the most information on was not ideal. It was cluttered with a mixture of different media-related modules, some of which have become abandoned or outdated, and definitely did not represent most of the available options (all would be difficult of course, as it changes so rapidly). In particular there is no mention easily found regarding Imagefield and Imagecache.
- The page I found also required me to muddle through documentation of varying quality on each possible module, trying to decipher the merits of each to see if they meet the needs of my site. There was no concise all-in-one place overview of what options I had to choose from - I had to read through overwhelming reams of information about a variety of modules, almost blindly sifting for key info to help me decide if the module would suit my needs (this might be ok when it comes to more advanced or specialized modules down the line for the user, but this is "images", and likely one of the very first things a newbie is going to look for).
- Drupal.org's search feature was almost completely useless in this case. It found almost no relevant results for just about every query I could think of (or at least a newbie is likely to think of).
Tags —
This is absolutely spot on. As an experienced computer user and software developer, but Drupal newbie of a couple of months, this is so like my own unsatisfactory search. For the time being I've given up on images in Drupal and shall probably just add a few 'img' tags to photos hosted off site.
I'm also quite confused on how I would organise stuff if I did upload it. My impression is that it all gets hurled into one enormous 'files' directory, with no organisation. I feel sure this need not be so, but I'm reluctant to go reinventing wheels that I'm sure are solved in some corners of the Drupal community.
I can't begin to tell you how accurate this is.
I'm considering going to v5. At least the image related stuff is not in alpha or beta. From my point of view, the Drupal core should handle pictures much as well if not better than WordPress.
..the idea behind drupal is great. But the current system is simply unusable. Basic things which almost every twenty-lines-php-cms can handle, drupal seems overstrained with.
Please be specific, or your comment is not helpful at all. I and many others happen to disagree with you and find it to be a terrific system, however there is plenty of room for improvement. If you suggest or offer solutions, then it can improve. You're clearly frustrated with Drupal - what is the issue that you're stuck on?
Edit: you mentioned getting a blank screen (in your email)... I have not been able to reproduce this by any means. Please let me know your browser, OS, and versions so I can test in those.
Boy, this is scarey. It is almost identical to the real process that I went through. As I researched, I kept thinking "I can insert an image in three seconds with mark-up hand-coded in xhtml but with Drupal, I'm now on day two of a full work-day trying to figure out how to add images -- and enable office clerical staff to later insert them easily." I still am confused, although I now know there are several options. Why is an image a node? More important to me is: Why should it be a node? What's the benefit?
I'm now at month six of site creation and embarrassed at how slow I am. Every step I need to take requires research/study, which is fine with me. But, the study takes days or weeks. My boss, who doesn't know squat about web site development, doesn't understand the slowness and wants the site up yesterday.
I'd like to see documentation that targets several different "publics" as we call them in public relations. Public One would be the newbie without programming skills but xhtml/css. Public Two would be the newbie with programming skills but no xhtml/css. ....and so on, so forth..
We need "documentation tracks" for different levels/types of Drupalers.
Now, I'm onto my next task; maybe you can write text on this, also. I'm needing to create section landing pages. I'm using a tpl.php I've created from scratch. I thought I'd be able to use, for example, page-about.tpl.php for the landing page for the 'about' section but I think I've discovered that if I used pathauto (which I've just learned about) that I'm going to run into trouble with what I think should be a simple task. I'll need to insert php code into template to create the page suggestions in 6x. I read the documentation. I reread the documentation. I reread it again. I got a cup of coffee. I scribbled on some paper. I reread. I called someone. I reread. Well, the only thing I still know is that I need to add php snippet into template file. I don't understand where in the file to add it; if I need to modify/customize the snippet for my site; and if I do have to modify, how to modify? So, here I sit. Searching.
Section landing pages... there's a number of approaches to take, and the one you choose depends on the needs of your site. I do not recommend making multiple page-something.tpl.php files except as a very last resort, as this adds exponentially to the amount of code you have to maintain, making changes in many files when ever you adjust one of them. Always make use of lower level templates and other techniques (for instance body classes) before making more page.tpl.php files.
I do hope to make a full guide on the issue, though here's some current info I can point you to:
1. have a clean install of drupal 6, go to create content -> page
2. file attachments -> select image -> attach it (Uncheck "list" checkbox so it won't appear for download after)
3. take the link of the jpg from the attach information go to body and write
4. select full html Input format and hit save
tadaa : image in drupal no extra modules required, no extra settings only clean install of drupal 6
errm .. where I said write .. it's < img src="link" / > but without spaces after < and before >
I am trying to follow your instructions here and it is not working. The image is not being shown at all.
I solved the problem by editing the Full HTML filter and adding![]()
to the list of allowed html codes. After that, everything worked.
In case it wasn't clear, this is a documentation case study seeking to understand the difficulties users "do" have handling images in Drupal (I am a member of the Drupal documentation team). The idea is to put myself in the shoes of an entirely new Drupal user who has to figure out the "image handling" situation from square one, based on the info they are able to find on drupal.org (before resorting to asking for help)... the information they find is not actually helpful in many cases in leading them to the correct solutions.
Your solution is viable of course, for a user who is both proficient in HTML and also does not mind the inconvenience of this method (when much more user friendly solutions are possible). The goal however is image handling that is simple, scalable, flexible, and possible for users with zero HTML required. This is what various other CMSes do (and Drupal can too - it just isn't very obvious which modules are needed to do so, or how to configure them once they are found).
hmm I understand .. and you are right it is a little bit awkward and a newbie won't nail it very fast :)
what about a button near the "split summary at cursor" thingie from body section of create content, that would do I just said but without the user seeing the steps , just press "Attach image" .. select it and bam inserted in body ..
well .. from idea to seeing that in core is a ling way ...
I agree. If it comes to getting up to speed with Drupal this "finding out how to add an image" definitely slows a newbie down and discouraged me (ref:date posted). This slowdown is mainly because of a naming convention. The "file attachments" option when creating content should get a name such as "Add non-text items such as jpeg, gif etc." or "File attachments - E.g. jpeg, gif..." Anyways, when I was searching with similar keywords to find out how to add an image I stumbled upon this: http://drupal.org/project/usage
This should be in the introduction paragraph of starting with Drupal for newbies. It showed me how awesome Drupal is and which modules I should first download to access the full potential of this CMS including advanced image uploading, editing etc. Way to go developers!
6 month trying to use Drupal. It feels less like a content management system and more like a module management system + google. I don't know how many pages I had to read to install 29 modules. The gap between a usable site like, whitehouse.gov and a stock install of drupal is so far apart that it seems like it is faster to write a CMS from the ground up. I also noticed a bad sign.. google doesn't seem to be able to index drupal based websites well. For example, I had a really hard time finding tutorials and such using google relating to D6. Almost all the results are for D5. hosted on Joomla. :/