Help:Images

From ErfWiki

(Difference between revisions)
Jump to: navigation, search
(Created page with 'There are several different ways of adding an image to an article on this wiki, including multiple custom templates. This page is designed to give you a starting point for learn...')
m (Reverted edits by 189.80.21.242 (Talk) to last version by Paper Golem)
 
(2 intermediate revisions not shown)
Line 118: Line 118:
[[Category:Edit]]
[[Category:Edit]]
-
[[Category:Help|{{PAGENAME}}]]
 

Latest revision as of 15:47, 12 April 2011

There are several different ways of adding an image to an article on this wiki, including multiple custom templates. This page is designed to give you a starting point for learning how to add an image to an article using these tools.


Contents


[edit] Why add Images?

Adding images is a great way to spice up an article. Images can provide much needed visual evidence to support speculation, or illustrate a point on Canon. This is a wiki that is first and foremost about a webcomic, a medium that is all about images!

As with any other type of edit, the most important rules are be bold and add Useful Information. An image should be relevant to the page on which it will be shown. For instance, an image of a dwagon makes far more sense on the flying unit page than a spidew would.

[edit] Preview

It's a good idea to use the “Preview” button to see what your change will look like, before you save it. This is also related to tracking changes because every time you save, this is displayed to others as a separate change. This isn't something to worry about too much, but it's good to get into the habit of eliminating mistakes in your own work, by using a preview before saving, rather than saving several minor corrections afterwards.

[edit] Using the Crop Template

The Crop Template is best used to add an individual panel or part of a panel from one of the comic pages. In essence it allows for simple cropping of an image based on the individual pixel coordinates. The syntax for using the Crop template is:

   {{crop|left|top|right|bottom|image_name}}

Take a look at the Crop template documentation for some examples of how the template works.

[edit] Using Wikicode to add an image

This section is pulled from Wikipedia's Extended image syntax. For more details, including examples, take a look at the full source page.

In brief, the syntax for displaying an image is:

   [[Image:{name}|{type}|{location}|{size}|{upright}|{link}|{text}]]

Only [[Image:{name}]] is required. Most images should use [[Image:{name}|thumb|Example image caption]] (and should not specify a size). The other details are optional and can be placed in any order.

Type

   'thumb' / 'thumbnail', 'frame', or 'border'. Causes image to be displayed with specific formatting (see below).

Location

   'right', 'left', 'center' or 'none'. Determines placement of the image on the page. Defaults to 'right'.

Size

   {width}px or {width}x{height}px, scales the image to be no greater than the given width and height, keeping its aspect ratio.

Upright

   intended for use on images that are taller than they are wide; must be used along with the 'thumb' or 'thumbnail' parameter. This scales the image to approximately 80% of thumbnail width. A parameter can be added to adjust the size: for instance "upright=1.5" will make the image larger, useful for maps or schematics that need to be larger to be readable. The parameter "upright=1" returns the same size as thumbnail width; "upright=.8" is functionally identical to "upright" alone.

Link

   Specifies that the image should act as a link to a different page.

Text

   Specifies the alt text, title text, or caption for the image.

It does not matter whether the file is from Erfwiki, Wikimedia Commons or on Wikipedia; the same syntax is used.

[edit] Detailed syntax

Type

Zero or one of these options may be specified to control whether or not the image is scaled down and given a border.

   * "thumbnail" or "thumb": Image is scaled down, and a box is added around the image. If a caption is written, it is shown below the image. Image defaults to placement on the 'right' unless overridden with the 'Location' attribute (see above). The scaled image size may be specified in another option (see "Size" below), failing which a per-user preference will be used for logged-in users (see "thumbnail size" in Special:Preferences), or the default thumbnail size of 180 pixels will be used for non-logged-in users.
     Thumbnailing animated GIFs is not supported. Thumbnailing an animated GIF does not result in an error, so there is no warning, but the animated GIF is not processed. Instead the original animated GIF is shipped, and whether the animated GIF is subsequently scaled to fit the allotted space is down to the capabilities of the receiving browser.
   * "frame": Original image size is preserved, and a box is added around the image. If a caption is written, it is shown below the image. Sizing does not work when |frame| is used.
   * (nothing specified): Original image size is preserved, no border is added around the image. Even if a caption is requested, it is not shown. If no alt text is specifically requested, then the requested caption will be used as alt text.
   * "border": Same as if nothing is specified, but a border is added around the image.

Location

Zero or one of these options may be specified to control the position of the image.

   * "right": Image including its box is placed on the right side of the page. The article text that follows the image flows around the image.
   * "left": Image including its box is placed on the left side of the page. The article text that follows the image flows around the image.
   * "center": Image including its box is placed in the center of the page. The article text that follows the image is placed below the image.
   * "none": Image including its box is placed on the left side of the page. The article text that follows the image is placed below the image.

Size

Zero or one of these options may be specified to control the size of the image. In the case of images with captions, if the image is already smaller than the requested size, then the image retains its original size (it is not enlarged). In the case of images without captions, the image will be enlarged or reduced to match the requested size.

   * "widthpx" (e.g. "100px"): Scales the image to make it the specified number of pixels in width. The height is also scaled in such a way as to retain the original aspect ratio.
   * "widthxheightpx" (e.g. "100x150px"): Scales the image to be no wider and no higher than the specified number of pixels. The image will keep its original aspect ratio.
   * (nothing specified): Uses the size specified in preferences for logged in users, uses a size determined by resolution for anonymous users.

Resizing animated GIFs is not supported. Resizing an animated GIF does not result in an error, so there is no warning, but the animated GIF is not processed. Instead the original animated GIF is shipped, and whether the animated GIF is subsequently scaled to fit the allotted space is down to the capabilities of the receiving browser.

Link

Ordinarily, an image acts as a hypertext link to the image description page, a page with information about the image itself. Using the link option allows an image to act as a hypertext link to a different page. See Wikipedia:Images linking to articles for more information.

   * "link=page name": The image will act as a hypertext link to the specified page. The page name must not be enclosed in square brackets, and it is always interpreted as an internal link.

Text

Zero or more of these options may be specified to control the alt text, title text, and caption for the image. The text may contain embedded wiki markup, such as links or formatting. See Wikipedia:Captions for discussion of appropriate caption text. See Wikipedia:Alternative text for images for discussion of appropriate alt text.

   * "alt=alt text": The specified text will be used as the alt text for the image.
   * "caption or alt text" (any text that is not recognised as some other part of the image syntax): The specified text is used as a caption, or as alt text, depending on the image type. For thumbnail, thumb, or frame image types, the specified text will be used as a caption. For other image types, the specified text will be used as alt text (unless the alt text is specified explicitly via the "alt=" option, in which case the text specified here will be ignored).

The actual alt text for the displayed image will be one of the following, in order of preference:

  1. The explicitly requested alt text, if any;
  2. The requested caption or alt text, if the image has no caption;
  3. The empty string, if the image has a caption

The actual title text for the hypertext link surrounding the image will be one of the following, in order of preference:

  1. The requested caption or alt text, if any;
  2. The empty string, if no caption or alt text is requested.

[edit] Uploading an Image

In order to check if an image already exists on the wiki, go to the File list or Gallery of new files and look through the list/gallery. If the image is already there, then use one of the methods above to add your image to a page.

If the image to be to put on an article isn't already saved on the wiki, or it can't be shown using the Crop Template, then it will to be uploaded. To upload an image:

  • Have the image file saved on your PC with a descriptive filename consistent with other files on the wiki.
  • In the "toolbox" on the right side of the wiki page, click on Upload file.
  • In the "Upload file" page, click on the "Browse" button and select the image to be uploaded.
  • Change the "Destination filename" (the name that the file will have on the Erfwiki) if needed and add a descriptive summary of what the image is that is being uploaded.
  • Click the "Upload file" button at the bottom of the page.
  • Go to the page on which the new image is going to be shown and add it using one of the methods above.

[edit] More Information

For a full list of formatting templates, check out Category:Formatting_Templates

Go To:
Personal tools