Want to upload that nice, pretty, awesome photo you took? Just add the following line to a page:
[[Image(image_name.jpg)]]
Then click preview or save the page, and click on the link that is generated to upload your image.
There are various parameters you can use with this image "macro". You can make the image a thumbnail, change its alignment, add a caption, or remove its border. The possible parameters are:
-
thumbnail - makes the image a thumbnail link to the image, reducing its size on the page.
-
noborder - removes the border from the image.
-
left - aligns the image to the left side of the page, allows for text wrapping.
-
right -aligns the image to the right side of page, allows for text wrapping.
-
# - changes the size of an image by its largest dimension.
-
"caption" - adds text and wiki links to be included below the image.
Examples
Plain Image
[[Image(image.jpg)]] will display the image you upload. Pretty simple, and may be bad for larger images.
Thumbnail and Sizing
So it takes less space and allows for a cleaner page, lets reduce it down to a thumbnail.
[[Image(image.jpg, thumbnail)]] will make the image display the image as a thumbnail, which links back to the original wiki.
If you wanted to make the image or thumbnail a certain size, adding the length will reduce the image proportionally to that size.
[[Image(image.jpg, 279, thumbnail)]] will change the longer dimension to 279 pixels, keeping the scale of the image.
Captions
You may want to include helpful text below an image to add explanation, in addition you can include a link to some other site or page.
[[Image(image.jpg, thumbnail, "A photo by ["users/PhilipNeustrom"]")]] will add the caption to the page.
A photo by PhilipNeustrom
Alignment on Page
An image might be in the way of text, or maybe you just want the image to be to the right.
[[Image(image.jpg, right, thumbnail)]] will create an image thumbnail to the right.
Any text below or after the image will appear alongside it rather than below or above it.
You can center an image (as long as it's neither a thumbnail nor captioned) by surrounding the image reference with --> and <--l.
You can also allow wrapping text by aligning the image to the left side of the page.
[[Image(image.jpg, left, thumbnail)]] will align the image to the left. This allows you to put text alongside the image, rather than breaking up the text.
Removing the border
Sometimes a border may not look so great for the page, thus the noborder option.
[[Image(image.jpg, thumbnail, noborder)]] Has an image without a border. 
Example
Library Stacks
Lets put it all together, a sized image thumbnail, aligned to the right of the screen.
[[Image(image.jpg, right, 279, thumbnail, "Library Stacks")]]
Multiple Images and Separators
Vertical
You can add multiple images or thumbnails by simply repeating the macro; there's an example of two images in a line below.
If you're adding a bunch of images as thumbnails, then this can end up looking strange because images can 'stack' on top of each other. Sometimes you don't want the text or the next image to 'float' over to the right or left side.
Headings are what you should use, in general, to divide pages into logical sections. As such, headings have the effect of sectioning off groups of images. Sometimes, when you're dealing with images, you don't want an actual heading, but just the "sectioning off" effect. To get this, just use ==== to force a section break in the page. You can think of this as a sort of "empty" heading.
A vertical column is created by having the images all aligned to either the right or left hand side of the page. 
Paintings mm 
Yay painting
Column Images on another website
You can embed images from other websites without uploading them to the wiki. Just paste the URL of the image into the page and the image will appear. In general, it's a good idea to upload images directly to the wiki if you want to use them for a long period of time.
Notes
You can currently place a single image on a page only once. In this example we used different filenames to allow us to put the same image on the page over and over. You usually won't need to put the same image on a page more than once.
In addition, you cannot put an image tag on the same line as a header or section break.
How can I put the same image on multiple pages?
Right now, you'll probably want to just upload the image to the different pages. You might be able to accomplish what you want using the Include macro to include a page inside of other pages.
Comments/Questions
Note: You must be logged in to add comments
2007-09-30 20:50:47 ok, so you can center text. how do you center an image? —JessicaRockwell
You can't center a thumbnailed (or captioned) image due to technical restrictions. This is mentioned in "alignment" above.
2007-10-01 20:48:44 You could probably center an image by putting it inside the central cell of a Table. Haven't tried it, but it could work... —KarlMogel
The code for centering an image using tables is as follows-
||<width="40%">||<width="30%">[[Image(yourimage.jpg, thumbnail, 300, "your title")]]||<width="30%">||
It isn't prefect because you have to allow for the image still being left aligned in its table cell —[jonpatterns]
2008-02-06 19:50:34 How can you post .bmp images? is there an easy way to convert them to .jpeg? —DagonJones
2008-03-11 21:40:59 I always forget how to do this bit to put a link into the photo caption/credit:
[[Image(photo.jpg, thumbnail, left, "SF [http://fakeurl.org Photo] by Whoever")]] —lizhenry
2008-06-03 23:25:43 I want to upload a flyer for an organization. I only have it in Acrobat and Word (as a copy/paste image from Acrobat). How can I save it as an image and upload it? —AllisonEriksen
-
Alas, I can't easily tell you (I don't use Word or Acrobat, being a KDE/Linux user), but I can extract it if you want. Just upload the PDF or Word file and let me know and I'll toss you the image. —Evan 'JabberWokky' Edwards
-
You can do a screen shot (PRT SC or Print Screen), crop it and save it as a picture in any picture editor. Ceedee Doyle
-
Also on Mac, start to PRINT and choose "Save as PDF" from the print window. Lois Richter 2010-08
2008-08-01 14:33:26 How do I make an image link to a url? I was trying something like ["SomePage" Image(seed-000.png)] but that doesn't work. —davidbessler
-
You can't. The image links to the image itself with revision history and the ability to change it. You can add a link into the caption, however. —Evan 'JabberWokky' Edwards
2008-08-01 18:29:36 How do I place an image on a page, which has been uploaded to another page? —davidbessler
-
You can include it (see Help with Macros), but if it's just on a few pages, it's a good idea to upload it individually. That way if somebody else comes along and makes it more relevant to entry C, it isn't changed on entries A, B and D, where the new updated version no longer makes sense. There are a couple included images, but they tend to go along with text, a la notices, that provide additional context. —Evan 'JabberWokky' Edwards
2009-08-16 15:22:36 Can I have animated gifs in a caption? I tried (![[WWW]](wiki/eggheadbeta/img/sycamore-www.png){kind=small}
http://philosophical-investigations.wikispot.org/Front_Page?action=recall&version=15), but here you can see that the gif on the right, a caption with a little text under, nicely aligned and in a box, — it uses the image macro —, is still, while the one on the left, the raw link, is animated but cannot be, afaik, aligned, captioned, etc. —PerigGouanvic
See ![[davis]](wiki/eggheadbeta/img/inter.png){kind=small}
Running Stop Signs —JasonAller
Thanks. The "caption" attribute seems to be the problem. when i remove it, the uploaded gif works. Perhaps someone could explain this in the FAQ, above? Please note, in particular, that it suggests, in "caption" - adds text and wiki links to be included below the image., that you can't add text if there's no caption attribute. But it's not true: see http://philosophical-investigations.wikispot.org/Front_Page. —PerigGouanvic
Actually, the difference here is that you didn't add the thumbnail attribute. Whenever you say thumbnail, you ask the wiki to resize the image, even if it stays at the correct size. When resized, in our software anyway, you lose the animation. You do of course, have a caption. That would be the text you have below the image, in quotes. —BrentLaabs
2009-12-17 23:00:41 If I want to embed an image from another site, it is possible to use attributes like "thumbnail, 300" etc? so I can limit the size of the image? I tried put the URL in the Include macro but that didn't seem to work. Thanks! —csroberson
Nope, you can only embed it directly. If you want to adjust it you'll need to upload it to the page.
2011-12-09 16:18:29 can one place a pdf on a page ? thanks —WilhelmReindl
Yes. First create a link for your PDF file on the page [[File(file_name.pdf)]], then preview the page, and click that link to upload your file. Or you can first upload your file, and create the link afterwards...
2012-03-16 01:55:59 Is there any way that adding a pic could be a BIT SIMPLER? —CalebAnderson
2012-05-19 19:17:42 I can't get the image to come up. It was working before. Now it won't display the image once i save the page. Help? —AlexSykesBidwell
2012-12-15 10:13:40 Help! I can't edit the edit icon. When I upload it, it changes the file extension from .png to .jpg. Help! —LukeStevens
2013-06-07 07:07:11 Can somebody please help my edit my page? It is AMD Medical Supply here in Davis and I put up a few new images but they are not showing... It just says Upload new image "imagename.jpg" and does not show the picture. Please help. Thank you :) —dmitriymarkiv
