Difference between revisions of "Help:Images"
J McKalling (Talk | contribs) m |
J McKalling (Talk | contribs) m |
||
(6 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
− | {{ | + | {{Infobox Help}}An integral part of the Twinsuniverse, images are always valuable, contribute to the articles, and make them nicer to the eyes. This page deals with anything you need to know about uploading, editing and adding images. |
− | + | ||
− | + | ||
− | + | ||
− | An integral part of | + | |
==Uploading an image== | ==Uploading an image== | ||
− | To upload an image to the | + | To upload an image to the Twinsuniverse, you must first be [[Special:Userlogin|logged in]] to your account. If you don't yet have an account, don't hesitate to create one for free and benefit all extra abilities. |
− | After you are logged in, click on the Upload file link which appears | + | After you are logged in, click on the Upload file link which appears in the toolbox menu to the left of each page (if you are using the default layout). This will take you to the [[Special:Upload]] page. You will see the following form: |
− | [[Image:Uploading. | + | [[Image:Uploading.jpg|frame|none]] |
− | First of all, click on the Browse... button, and locate the image you wish to upload. If you wish to save the file under a different name than used on your computer, Enter the new name in the "Save as" field. After doing so, in the Summary box, write a short summary of what the image is about | + | First of all, click on the Browse... button, and locate the image you wish to upload. If you wish to save the file under a different name than used on your computer, Enter the new name in the "Save as" field. After doing so, in the Summary box, write a short summary of what the image is about, eg. "A picture of [[Twinsen]] and [[Zoé]]". Any Wiki tags are available here, like links, bold text, etc. To finish, click on the "Upload file" button. |
− | Note that if your | + | Note that if your image file name contains spaces, you will get a message saying the spaces will be converted to underscores (_). Click Save file to accept that, or Re-upload to go back to the upload page. |
Your image is now uploaded on the server, waiting to be added to the articles. | Your image is now uploaded on the server, waiting to be added to the articles. | ||
Line 22: | Line 18: | ||
If you click on the button, the following line of text will be inserted to the article: | If you click on the button, the following line of text will be inserted to the article: | ||
<nowiki>[[Image:Example.jpg]]</nowiki> | <nowiki>[[Image:Example.jpg]]</nowiki> | ||
− | Replace "Example.jpg" with your image's file name (spaces | + | Replace "Example.jpg" with your image's file name (spaces automatically translate to underscores), and your image will be inserted in the article. You may now click on Show preview, to see what it looks like. |
But before you hurry saving the page, please also note that there are some image attributes available, to make the image look better on the article. To separate the attributes, use the | sign. | But before you hurry saving the page, please also note that there are some image attributes available, to make the image look better on the article. To separate the attributes, use the | sign. | ||
===Alignment=== | ===Alignment=== | ||
− | You can specify whether the image will be aligned to the left, right or center of the paragraph, or even not at all. To do so, add either "left", "right", "center" or "none" as an attribute. | + | You can specify whether the image will be aligned to the left, right or center of the paragraph, or even not at all. To do so, add either "left", "right", "center" or "none" as an attribute. Example: |
− | <nowiki>[[Image: | + | <nowiki>[[Image:Twinsen.jpg|right]]</nowiki> |
− | [[Image: | + | [[Image:Twinsen.jpg|right]]<blockquote style="color:#737373">''example paragraph'': I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?<br /> |
− | + | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</blockquote> | |
− | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</ | + | |
===Framing and caption=== | ===Framing and caption=== | ||
To add a frame to an image, use the "frame" attribute. After you added that, you may also give the image a caption, by simply adding the text you wish to use after "frame|". Note that the image must either have a frame or be thumbed (see below) for the caption to appear. Example: | To add a frame to an image, use the "frame" attribute. After you added that, you may also give the image a caption, by simply adding the text you wish to use after "frame|". Note that the image must either have a frame or be thumbed (see below) for the caption to appear. Example: | ||
− | <nowiki>[[Image: | + | <nowiki>[[Image:Twinsen.jpg|frame|Twinsen]]</nowiki> |
− | [[Image: | + | [[Image:Twinsen.jpg|frame|Twinsen]]<blockquote style="color:#737373">''example paragraph'': I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?<br /> |
− | + | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</blockquote> | |
− | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</ | + | |
− | + | ||
===Thumbnail=== | ===Thumbnail=== | ||
− | To make a thumbnail of an image, use the "thumb" attribute. You may also add a caption | + | To make a thumbnail of an image, use the "thumb" attribute. You may also add a caption. The size of the thumbnail depends on what each user sets in his or her [[Special:Preferences|preferences]], but as default, it's 180 pixels. Example: |
− | <nowiki>[[Image:Screenshot-lba2-ingame-island of the white leaf desert-school of magic entrance.gif|thumb|Twinsen | + | <nowiki>[[Image:Screenshot-lba2-ingame-island of the white leaf desert-school of magic entrance.gif|thumb|Twinsen at the School of Magic]]</nowiki> |
− | [[Image:Screenshot-lba2-ingame-island of the white leaf desert-school of magic entrance.gif|thumb|Twinsen | + | [[Image:Screenshot-lba2-ingame-island of the white leaf desert-school of magic entrance.gif|thumb|Twinsen at the School of Magic]]<blockquote style="color:#737373">''example paragraph'': I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?<br /> |
+ | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</blockquote> | ||
− | + | Note that images smaller than 180 pixels in width, will always just be displayed in 100% size. | |
− | + | ||
− | + | ||
− | Note that | + | |
===Resizing=== | ===Resizing=== | ||
− | If you wish to specify an exact size of the image, you may also do so. All you | + | If you wish to specify an exact size of the image, you may also do so. All you need to do is add the width (in pixels) as an attribute, and add "px" after that. Example: |
− | <nowiki>[[Image: | + | <nowiki>[[Image:Twinsen.jpg|50px]]</nowiki> |
− | [[Image: | + | [[Image:Twinsen.jpg|50px]] |
You can also add an alternative text after that, by simply adding "|text": | You can also add an alternative text after that, by simply adding "|text": | ||
− | <nowiki>[[Image: | + | <nowiki>[[Image:Twinsen.jpg|50px|Twinsen is now small]]</nowiki> |
− | [[Image: | + | [[Image:Twinsen.jpg|50px|Twinsen is now small]] |
(position your cursor over the image) | (position your cursor over the image) | ||
===Combining attributes=== | ===Combining attributes=== | ||
− | You can, of course, combine any attributes you wish in | + | You can, of course, combine any attributes you wish in a displayed image. The order of attributes does not matter, as long as '''the file name is first, and the caption is last'''. For example, let's make Twinsen right-aligned, small and with a caption: |
− | <nowiki>[[Image: | + | |
− | [[Image: | + | <nowiki>[[Image:Twinsen.jpg|right|100px|thumb|Twinsen]]</nowiki> |
− | < | + | [[Image:Twinsen.jpg|right|100px|thumb|Twinsen]]<blockquote style="color:#737373">''example paragraph'': I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?<br /> |
+ | Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.</blockquote> | ||
==Images gallery== | ==Images gallery== | ||
− | There is also a cool option | + | There is also a cool option to create an entire image gallery. This is done using the <nowiki><gallery></nowiki> tag: |
− | + | <nowiki> | |
<gallery> | <gallery> | ||
− | Image:Bob. | + | Image:Bob.png|Bob |
− | Image: | + | Image:Aristide.jpg|Aristide |
− | Image: | + | Image:Jerome Baldino.jpg|Baldino |
− | Image: | + | Image:Luc.jpg|Luc |
− | Image: | + | Image:Miss Bloop.jpg|Miss Bloop |
− | Image: | + | Image:Mr. Bazoo.png|Mr. Bazoo |
− | + | </gallery></nowiki> | |
− | + | ||
− | </gallery> | + | |
− | </nowiki | + | |
<gallery> | <gallery> | ||
− | Image:Bob. | + | Image:Bob.png|Bob |
− | Image: | + | Image:Aristide.jpg|Aristide |
− | Image: | + | Image:Jerome Baldino.jpg|Baldino |
− | Image: | + | Image:Luc.jpg|Luc |
− | Image: | + | Image:Miss Bloop.jpg|Miss Bloop |
− | Image: | + | Image:Mr. Bazoo.png|Mr. Bazoo |
− | + | ||
− | + | ||
</gallery> | </gallery> | ||
==Linking to images without displaying them== | ==Linking to images without displaying them== | ||
If you wish to link to an image, without displaying it in the article, there are a few ways to do so: | If you wish to link to an image, without displaying it in the article, there are a few ways to do so: | ||
+ | <nowiki>[[Media:Twinsen.jpg]]</nowiki> → [[Media:Twinsen.jpg]] | ||
− | <nowiki>[[Media: | + | To display some other text than "Media:filename.jpg", use the [[Help:Links#The_Pipe_Technique|pipe-technique]]: |
− | [[Media: | + | <nowiki>[[Media:Twinsen.jpg|An image of Twinsen]]</nowiki> → [[Media:Twinsen.jpg|An image of Twinsen]] |
− | To | + | You can also remove the display of the image itself and only show the usual link to the image page with all the image's information. To do so, just insert a colon(:) before the "Image" keyword: |
+ | <nowiki>[[:Image:Twinsen.jpg]]</nowiki> → [[:Image:Twinsen.jpg]] | ||
− | + | And of course, you can also set an alternative text here as well: | |
− | + | <nowiki>[[:Image:Twinsen.jpg|The information page of Twinsen's image]]</nowiki> → [[:Image:Twinsen.jpg|The information page of Twinsen's image]] | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | And of course, you can also set an alternative text here: | + | |
− | <nowiki>[[:Image: | + | |
− | [[:Image: | + | |
==Image list== | ==Image list== | ||
− | To see a list of all images on the server, | + | To see a list of all images on the server, go to the [[Special:Imagelist]] page. You can also search an image for quicker finding (most images have a descriptive file name). To see a list of absolutely all images together, go [http://twinsuniverse.xesf.net/index.php?title=Special:Imagelist&sort=byname&limit=5000&wpIlMatch= this page] (the 5,000 attribute in the address is just a random number which is hopefully bigger than the number of images on the server). |
− | + | ||
− | + |
Latest revision as of 12:09, 8 December 2012
Help Contents | |
---|---|
Contents
Uploading an image
To upload an image to the Twinsuniverse, you must first be logged in to your account. If you don't yet have an account, don't hesitate to create one for free and benefit all extra abilities.
After you are logged in, click on the Upload file link which appears in the toolbox menu to the left of each page (if you are using the default layout). This will take you to the Special:Upload page. You will see the following form:
First of all, click on the Browse... button, and locate the image you wish to upload. If you wish to save the file under a different name than used on your computer, Enter the new name in the "Save as" field. After doing so, in the Summary box, write a short summary of what the image is about, eg. "A picture of Twinsen and Zoé". Any Wiki tags are available here, like links, bold text, etc. To finish, click on the "Upload file" button.
Note that if your image file name contains spaces, you will get a message saying the spaces will be converted to underscores (_). Click Save file to accept that, or Re-upload to go back to the upload page.
Your image is now uploaded on the server, waiting to be added to the articles.
Adding an image to an article
After you uploaded your image to the server, go to the article you wish to add it to, and enter its Edit page. Note that you can't use external images in the articles- only images uploaded on the server. To add the image, position your cursor where you want the image added. Then, you can either click on the File:Button image.png button, or write the command manually.
If you click on the button, the following line of text will be inserted to the article:
[[Image:Example.jpg]]
Replace "Example.jpg" with your image's file name (spaces automatically translate to underscores), and your image will be inserted in the article. You may now click on Show preview, to see what it looks like.
But before you hurry saving the page, please also note that there are some image attributes available, to make the image look better on the article. To separate the attributes, use the | sign.
Alignment
You can specify whether the image will be aligned to the left, right or center of the paragraph, or even not at all. To do so, add either "left", "right", "center" or "none" as an attribute. Example:
[[Image:Twinsen.jpg|right]]
example paragraph: I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?
Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.
To add a frame to an image, use the "frame" attribute. After you added that, you may also give the image a caption, by simply adding the text you wish to use after "frame|". Note that the image must either have a frame or be thumbed (see below) for the caption to appear. Example:
[[Image:Twinsen.jpg|frame|Twinsen]]
example paragraph: I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?
Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.
Thumbnail
To make a thumbnail of an image, use the "thumb" attribute. You may also add a caption. The size of the thumbnail depends on what each user sets in his or her preferences, but as default, it's 180 pixels. Example:
[[Image:Screenshot-lba2-ingame-island of the white leaf desert-school of magic entrance.gif|thumb|Twinsen at the School of Magic]]
example paragraph: I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?
Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.
Note that images smaller than 180 pixels in width, will always just be displayed in 100% size.
Resizing
If you wish to specify an exact size of the image, you may also do so. All you need to do is add the width (in pixels) as an attribute, and add "px" after that. Example:
[[Image:Twinsen.jpg|50px]]
You can also add an alternative text after that, by simply adding "|text":
[[Image:Twinsen.jpg|50px|Twinsen is now small]]
(position your cursor over the image)
Combining attributes
You can, of course, combine any attributes you wish in a displayed image. The order of attributes does not matter, as long as the file name is first, and the caption is last. For example, let's make Twinsen right-aligned, small and with a caption:
[[Image:Twinsen.jpg|right|100px|thumb|Twinsen]]
example paragraph: I've got to tell you something. It's awful! My best friend (Beatrice) is in love with Steven. But Paul, Steven's half brother, left Cindy when Linda got out of the clinic after her bobsleigh accident. But not for Linda, for Tatjana! Only Serge (who secretly admires Steven) has been trying for months to win the love of Tatjana who refuses to talk to Christy since she died. All the while Stephanie - who remarried Serge - discovered the letter from Paulina in which she explained where was the box of clover leaves left behind by Roy. So, evidently, Beatrice wonders if Linda knows about the accident. You get all that?
Go see Beatrice and tell her that Julia sent you. She'll explain all that better than I can. She lives on the outskirts of the Old Burg, in a house next to the sea, on Peg Leg Street.
Images gallery
There is also a cool option to create an entire image gallery. This is done using the <gallery> tag:
<gallery> Image:Bob.png|Bob Image:Aristide.jpg|Aristide Image:Jerome Baldino.jpg|Baldino Image:Luc.jpg|Luc Image:Miss Bloop.jpg|Miss Bloop Image:Mr. Bazoo.png|Mr. Bazoo </gallery>
Linking to images without displaying them
If you wish to link to an image, without displaying it in the article, there are a few ways to do so:
[[Media:Twinsen.jpg]] → Media:Twinsen.jpg
To display some other text than "Media:filename.jpg", use the pipe-technique:
[[Media:Twinsen.jpg|An image of Twinsen]] → An image of Twinsen
You can also remove the display of the image itself and only show the usual link to the image page with all the image's information. To do so, just insert a colon(:) before the "Image" keyword:
[[:Image:Twinsen.jpg]] → Image:Twinsen.jpg
And of course, you can also set an alternative text here as well:
[[:Image:Twinsen.jpg|The information page of Twinsen's image]] → The information page of Twinsen's image
Image list
To see a list of all images on the server, go to the Special:Imagelist page. You can also search an image for quicker finding (most images have a descriptive file name). To see a list of absolutely all images together, go this page (the 5,000 attribute in the address is just a random number which is hopefully bigger than the number of images on the server).