Get our free book on rainwater now - To Catch the Rain.

Help:Images

From Appropedia
Jump to: navigation, search

License[edit]

  • Make sure that you have permission to post this content under our open-source license.
  • IF YOU DO NOT DESCRIBE THE SOURCE AND SPECIFY THE LICENSE, THE FILE MAY BE QUICKLY DELETED. We don't like doing this, but we can't have copyright violations on the site.
  • Use a unique name for your file, such as projectname_description_number.jpg.
  • Save the photo with no dimension greater than 1200 pixels, and do less if big is not necessary. See avoid huge files for more on resizing your photos easily.
  • Save the photo rotated to the proper orientation.
  • To include the image in a page, use a link in the form [[File:File.jpg]]. See image help or general help for more.

Finding images[edit]

How to add an image[edit]

See Help:Add image tutorial for step by step details on adding an image. Below is some basic code for adding an image to a page.

Single images[edit]

In brief, the syntax for displaying an image is:

[[Image:NAME|TYPE|LOCATION|SIZE|CAPTION]]

Only [[Image:NAME]] is required. Most images should use [[Image:NAME|thumb|IMAGE CAPTION]]. The other details are optional and can be placed in any order.

TYPE 
'thumb' or 'frame'. Thumb makes a thumbnail (smaller) image. Frame places a frame around the image. Both allow for captions.
LOCATION 
'right', 'left', 'center' or 'none'. Determines placement of the image on the page.
SIZE 
WIDTHpx (e.g. 50px), scales the image to the given width, keeping its aspect ratio. Or thumbnails can use "upright=Factor". This must be used along with the "thumb" parameter E.g. "|thumb|upright=2" makes the image twice the dimensions of a thumbnail. (Default 0.75, and rounds the result to the nearest multiple of 10 pixels.)
CAPTION 
Any element which cannot be identified as one of the above is assumed to be caption text.
For thumbs, the form is
[[Image:NAME|thumb|LOCATION|SIZE|CAPTION]]
. For example:
[[Image:AEFgreywaterTrapSpr06.JPG|thumb|left|Sample caption text]]

Produces:

Sample caption text


For upright, the form is
[[Image:NAME|thumb|upright=FACTOR|LOCATION|CAPTION]]
For example:
[[Image:AEFgreywaterTrapSpr06.JPG|thumb|upright=1.5|right|alt=This alt text should show up on mouseover, depending on your browser.|The "<code>upright=1.5</code>" option]] 

Produces:

This alt text should show up on mouseover, depending on your browser.
The "upright=1.5" option


Galleries[edit]

The gallery tag allows for nice galleries. For example:

<gallery caption="Sample gallery">
Image:AEFgreywaterTrapSpr06.JPG|Sample caption text.
Image:H_millcreekgreywater_trap.JPG|'''More''' sample caption text.
Image:SunnybraeGwHouse.JPG|More.
</gallery>

Produces:

Gallery template: more options[edit]

For more settings (e.g. image size) the {{gallery}} template can be used instead.

E.g.

{{Gallery
|title=Projects gallery
|width=180
|height=135
|padding=5
|lines=4
|align=center
|File:AEFfill.jpg| [[AEF greywater]]: Recreating a failing greywater marsh at the Arcata Educational Farm.
|File:Aleiha_dish.jpg| [[Aleiha's parabolic solar cooker]]: A very hot parabolic solar cooker.
|File:IMG_6743.JPG| [[Argentina photovoltaic]]: A small photovoltaic system for a [[natural building]]/permaculture institute in Central Argentina.
}}
Projects gallery
AEF greywater: Recreating a failing greywater marsh at the Arcata Educational Farm.  
Aleiha's parabolic solar cooker: A very hot parabolic solar cooker.  
Argentina photovoltaic: A small photovoltaic system for a natural building/permaculture institute in Central Argentina.  

lines = how many lines in the caption area. If the area is too small, a scroll bar will appear.

Note that if no caption is used, the pipe "|" after the image name is still essential. (That's because this is a template, even if the layout is a little like image code.)

External links[edit]

To get successive images to load beside each other on the same line you can either set each one to appear on the left and the previous image will bump the next to the side or you can merge the images outside Appropedia and import as 1 image. Setting successive images as right, right, right will cause the images to appear one on top of the other and the setting left, center, right causes them to appear on separate lines vertically.