How to Add Images
From ColorWiki
(Difference between revisions)
m |
|||
| (13 intermediate revisions not shown) | |||
| Line 1: | Line 1: | ||
| + | <big>To add an image, the image file has to be '''uploaded'''. Also other files can be uploaded, see below. The system uses the term "image" for any uploaded file.</big> Uploading images on ColorWiki Commons allows embedding them in all ColorWiki Projects, as an exception to the general rule that files can only be embedded in pages of the project in which they are uploaded. | ||
| - | + | ==Easy Overview for Adding Images== | |
| + | ===Start with an image file=== | ||
| + | * First give the file a suitable name, because renaming during or after uploading is not possible. | ||
| + | * Make sure that the file name has the proper extension (jpg or png). | ||
| - | + | ===Click on Upload File=== | |
| + | * Click on the "Upload file" link in the toolbox area of the left pane.[[Image:Upload file.jpg]] | ||
| + | * Click the Choose File button, browse to and choose your image file. Write a brief description of the image and its purpose. Click the Upload file button. | ||
| + | * Upon upload, the image description page is displayed. | ||
| - | + | ;It is recommended that images not exceed 153600 bytes in size. | |
| - | + | ||
| + | ===Insert the image into Wikitext=== | ||
| + | Use the following convention for adding an image into your edits: | ||
| + | |||
| + | * Start and end the image insert with double square brackets. [[ ]] | ||
| + | * Inside the brackets: "Image:" | ||
| + | * Followed by the image name (including extention) | ||
| + | [[Image:Name of picture.jpg]] | ||
| + | <nowiki>[[Image:Name of picture.jpg]]</nowiki> | ||
| + | |||
| + | ===Align the Image Left or Right=== | ||
| + | [[Image:Name of picture.jpg|right]] | ||
| + | The image can be place to the left or right of the text that follows by including "left" or "right" after a pipe (<big>'''|'''</big>): | ||
| + | |||
| + | <nowiki>[[Image:Name of picture.jpg|right]] </nowiki> | ||
| + | |||
| + | |||
| + | ===Captions=== | ||
| + | [[Image:Name of picture.jpg|left|Here you see a sample picture showing some colors.]] | ||
| + | Captions or hover text can be included by adding it to the image data after a pipe (<big>'''|'''</big>): | ||
| + | |||
| + | <nowiki>[[Image:Name of picture.jpg|left|Here you see a sample picture showing some colors.]] </nowiki> | ||
| + | |||
| + | ==Detailed Instructions for Adding Images== | ||
| + | |||
| + | See individual pages in the [http://www.colorwiki.com/wiki/Category:ColorWiki_Help ColorWiki Help] category. | ||
| - | |||
| - | ==File name== | + | <!--THE FOLLOWING IS COMMENTED OUT |
| + | ===File name=== | ||
If you want to replace an existing file, give it the same name, and otherwise a name that does not exist yet. | If you want to replace an existing file, give it the same name, and otherwise a name that does not exist yet. | ||
| Line 20: | Line 52: | ||
| - | ==Linking== | + | On uploading, a destination filename can be specified, so the file name on the project need not be the same as the name under which it is stored locally. |
| + | With the file an '''image page''' (also called "image description page") will be associated, with a' ''page name''' consisting of the file name (including extension), prefixed with "Image:" (or in general the value of variable <nowiki>{{ns:Image}}</nowiki>). Thus the file names are case-sensitive (this applies even for the file name extension) except, in most projects, for the first character. | ||
| + | |||
| + | |||
| + | ===Linking=== | ||
To link to an uploaded file, e.g. So.gif, use <nowiki>[[ColorWiki:So.gif]]</nowiki> instead of <nowiki>[[Image:So.gif]]</nowiki>, giving [[ColorWiki:So.gif]]; to link to the image description page, use <nowiki>[[:Image:So.gif]]</nowiki>, giving [[:Image:So.gif]] (the first colon is not displayed). | To link to an uploaded file, e.g. So.gif, use <nowiki>[[ColorWiki:So.gif]]</nowiki> instead of <nowiki>[[Image:So.gif]]</nowiki>, giving [[ColorWiki:So.gif]]; to link to the image description page, use <nowiki>[[:Image:So.gif]]</nowiki>, giving [[:Image:So.gif]] (the first colon is not displayed). | ||
| Line 59: | Line 95: | ||
For more possibilities, see [[en:Wikipedia:Extended image syntax]]. Also, the source of existing pages with images are useful as examples. {{clr}} | For more possibilities, see [[en:Wikipedia:Extended image syntax]]. Also, the source of existing pages with images are useful as examples. {{clr}} | ||
| - | ===Image at the left=== | + | ====Image at the left==== |
'''<nowiki>[[image:tst.png|left|thumb|50px|[[help:contents|demo]]]]</nowiki>''' puts the image at the left; text that follows floats to the right of it; if a second image immediately comes after the first, the second abuts to the right side of the first; if there is text in between then the second image is at the lower right of the first, under this text: | '''<nowiki>[[image:tst.png|left|thumb|50px|[[help:contents|demo]]]]</nowiki>''' puts the image at the left; text that follows floats to the right of it; if a second image immediately comes after the first, the second abuts to the right side of the first; if there is text in between then the second image is at the lower right of the first, under this text: | ||
| Line 69: | Line 105: | ||
[[image:tst.png|none|thumb|50px|[[help:contents|demo]]]]''Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent lupta'' | [[image:tst.png|none|thumb|50px|[[help:contents|demo]]]]''Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent lupta'' | ||
| - | ===Image at the right=== | + | ====Image at the right==== |
'''<nowiki>[[image:tst.png|right|thumb|50px|[[help:contents|demo]]]]</nowiki>''' puts the image at the right; text that follows floats to the left of it. The situation is not symmetric with the case above: a second image is put at the extreme right again, under the first. | '''<nowiki>[[image:tst.png|right|thumb|50px|[[help:contents|demo]]]]</nowiki>''' puts the image at the right; text that follows floats to the left of it. The situation is not symmetric with the case above: a second image is put at the extreme right again, under the first. | ||
| Line 75: | Line 111: | ||
[[image:tst.png|right|thumb|50px|[[help:contents|demo]]]] ''zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.'' after the 1st image.[[image:tst.png|right|thumb|50px|[[help:contents|demo]]]] ''after the 2nd image.{{clr}} | [[image:tst.png|right|thumb|50px|[[help:contents|demo]]]] ''zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.'' after the 1st image.[[image:tst.png|right|thumb|50px|[[help:contents|demo]]]] ''after the 2nd image.{{clr}} | ||
| - | ===Using full width again=== | + | ====Using full width again==== |
[[image:tst.png|left|thumb|50px|[[help:contents|demo]]]]Use '''<nowiki><br clear="all" /></nowiki>''', or on projects that have [[Template:Clr]] (Meta and en:): <nowiki>{{clr}}</nowiki>. Text floats around the image until it gets to <nowiki>{{clr}}</nowiki> (in Meta) like this.{{clr}}After <nowiki>{{clr}}</nowiki>, however, text can float no longer, and restarts from under the image, using the full width again like this,...... like this, like this, like this, like this, like this, like this, like this. | [[image:tst.png|left|thumb|50px|[[help:contents|demo]]]]Use '''<nowiki><br clear="all" /></nowiki>''', or on projects that have [[Template:Clr]] (Meta and en:): <nowiki>{{clr}}</nowiki>. Text floats around the image until it gets to <nowiki>{{clr}}</nowiki> (in Meta) like this.{{clr}}After <nowiki>{{clr}}</nowiki>, however, text can float no longer, and restarts from under the image, using the full width again like this,...... like this, like this, like this, like this, like this, like this, like this. | ||
| - | ===Inline images=== | + | ====Inline images==== |
Inline images cannot have a caption, but they can have a [[w:Wikipedia:Alternative text for images|"title"-attribute]] (often misidentified as the "alt" attribute, which has a different purpose), which is shown in the hoverbox (in the cases above, for the image it is the same as the caption, and for the enlarge icon it is "Enlarge"). It is the last item of the image code, hence, if there is only the image name with prefix "image:" it gives that; if there is an empty item by ending with a pipe character ("|") it gives none; otherwise, it gives the image code item that happens to be last, unless a proper text is specified. | Inline images cannot have a caption, but they can have a [[w:Wikipedia:Alternative text for images|"title"-attribute]] (often misidentified as the "alt" attribute, which has a different purpose), which is shown in the hoverbox (in the cases above, for the image it is the same as the caption, and for the enlarge icon it is "Enlarge"). It is the last item of the image code, hence, if there is only the image name with prefix "image:" it gives that; if there is an empty item by ending with a pipe character ("|") it gives none; otherwise, it gives the image code item that happens to be last, unless a proper text is specified. | ||
| + | ---> | ||
| + | |||
| + | [[Category:ColorWiki Help|How to Add Images]] | ||
Latest revision as of 16:54, 18 August 2010
To add an image, the image file has to be uploaded. Also other files can be uploaded, see below. The system uses the term "image" for any uploaded file. Uploading images on ColorWiki Commons allows embedding them in all ColorWiki Projects, as an exception to the general rule that files can only be embedded in pages of the project in which they are uploaded.
Contents |
Easy Overview for Adding Images
Start with an image file
- First give the file a suitable name, because renaming during or after uploading is not possible.
- Make sure that the file name has the proper extension (jpg or png).
Click on Upload File
- Click on the "Upload file" link in the toolbox area of the left pane.
- Click the Choose File button, browse to and choose your image file. Write a brief description of the image and its purpose. Click the Upload file button.
- Upon upload, the image description page is displayed.
- It is recommended that images not exceed 153600 bytes in size.
Insert the image into Wikitext
Use the following convention for adding an image into your edits:
- Start and end the image insert with double square brackets. [[ ]]
- Inside the brackets: "Image:"
- Followed by the image name (including extention)
[[Image:Name of picture.jpg]]
Align the Image Left or Right
The image can be place to the left or right of the text that follows by including "left" or "right" after a pipe (|):
[[Image:Name of picture.jpg|right]]
Captions
Captions or hover text can be included by adding it to the image data after a pipe (|):
[[Image:Name of picture.jpg|left|Here you see a sample picture showing some colors.]]
Detailed Instructions for Adding Images
See individual pages in the ColorWiki Help category.
