User blog:Neowitch/How to use images without uploading them to the Wiki

Hello everybody! This is a slightly passive aggressive Neo, teaching you how to put images on the wiki without uploading anything to the wiki, so you can have all the epic pictures, fanart and whatnot on your profile page/blog and not go against the Image Guidelines (which I pointed out to people about 60 times by now).

Direct Linking
The easiest way to do that is to upload an image on photobucket.com or imageshack.com. The latter might be the better choice because you don't have to register on it. Once you uploaded an image, zoom in till 100% and then simply click right and select "Copy Image URL". Then you paste the URL into your profile/blog/comment/whatever.


 * Wikia only supports images uploaded on either of those two sites above. Other domains will show the images as a link.
 * You need to zoom or click "enlarge to actual size" because otherwise the wiki won't support it and only show a link, too.

Let's give it a try: http://img528.imageshack.us/img528/2126/philosobrookimg.png

Thumbnail
The image is up but it's rather big, innit? Unfortunately, Wikia does not support the thumbnail function of either Photobucket or Imageshack. Therefore you need to make a thumbnail yourself by creating a smaller version of the image. Upload that one on either of the sites above, too.

To use it you have to go into the Source Mode of the editor and put both URLs in square brackets > [].
 * 1) URL of the big image
 * 2) space
 * 3) URL of the thumbnail
 * ]
 * ]

http://img560.imageshack.us/img560/5198/philosobrookimgsmall.jpg

So now it looks like this: http://img560.imageshack.us/img560/5198/philosobrookimgsmall.jpg

Alignment
Now we have a nice and small thumbnail leading to the bigger picture but the Wiki still treats it like part of the text and produces ugly white spaces, unlike wiki-native images where the text flows around the image.

To fix that you put the code above into a so called "p-tag": I am a text inside a p-tag

The p-tag can be styled. It requires a bit coding knowledge but to make it simple you can just copy the following code: insert your URLs here

All you might want to change about that code is the part that says "left". Right now the picture will be displayed on the left next to your text. Change it to "right" and your picture will be on the right.

And now we put it all together: http://img560.imageshack.us/img560/5198/philosobrookimgsmall.jpg

http://img560.imageshack.us/img560/5198/philosobrookimgsmall.jpg The image is at the left next to the text just like a wiki-native thumbnail. See?

I can put a lot of text here and it will flow around the image. That's pretty neat, innit? If you check my profile page you'll see that I put an image next to my introduction text with the exact same method.

I know this is a bit of an effort but it's better than big bulky images or no images at all. Hope you found my guide helpful. If you have any questions, just ask!

FAQ
Photobucket and imageshack usually show a scaled down version of the image uploaded. You probably used the URL of the scaled image which is not supported by wikia. You have to zoom it to 100% by clicking on the image. You can tell by the URL. If there is anything written after the image suffix (gif/png/jpg) it's scaled. Try deleting everything after the suffix. This should work.
 * Why does the image not show?
 * How do I know the image is zoomed to 100%?