ID:257804
 
If you're wantin ta post an image in a forum or blog, there's a few ways to do it.

Generally, first you need to upload it from your computer to a host site. This can be your BYOND blog site (if you're a member) or an image host site (such as imageshack or photobucket).

Now, hosting on your blog is fairly easy, but it can eat up your bandwidth. Your bandwidth is the amount of data you're allowed to transmit from your byond website to someone else. So, for example, if you post an image on your blog that's stored in your BYOND website file manager (which we'll get to) and that image is 100kb in size, if 10 people view that picture (when they view it, their browser is automatically downloading the picture from your website), you've transmitted 1000kb of data and used 1000kb of bandwidth. Usually bandwidth is measured in gb over time. I believe the standard BYOND membership is 1gigabyte of bandwidth per month (?).

Uploading a pic to your BYOND website:

Uploading to you BYOND website is fairly easy.
First, make sure your image is saved in the form you like it and in a file format that browsers can display. Most browsers can handle jpeg or jpg (a very common format for photos), gif (good for pixel art, animations, and images withtransparency) and png (a very efficient format, good for pixel art and photos, that can provide transparency in most browsers (except IE)). Stay away from bmp's! They are only slightly compressed and can take forever for browsers to load.

Now, go to your BYOND site and click 'edit site'. On the top left of the site editing page will be a blue rectangular link that sez, 'Manage Files'. Click that. You'll see a new page that looks kind of like this:

Image Hosted by ImageShack.us

Next, click one of the 'Browse' buttons in the lower section. A file selector will pop up that lists your computer's directories and files. Find the file you want to upload and click the 'Open' button on the file selector.
Your file should now appear in the white text bar to the left of the 'Browse' button.
Then, click the 'Save Changes' button.

If BYOND could successfully upload your file, a yellow text message will appear above the dark grey 'manage files' bar saying something like '1 file successfully uploaded'.
Now, it should appear in the file list (the area with the two scroll bars in the pic above). The full name, or address, on the far right is the web address of your file being stored on BYOND and is also a link, you can click it to see your picture file as it would appear on a white background on the web.

Now, take that address (by highlighting it in the file manager window and edit>copy, or by clicking that link and copying it from the address bar of that window) and move to the forum post or blog post you want to display the pic.
Type this line:



Now, move the cursor in between the two quote above and paste in the address you copied in the steps above.

You've now included your pic in your post. You can hi preview post (in most BYOND sites/forums) to see if it worked.


Uploading a pic to a free image hosting site:

Back to that file manager page.
You'll also notice the 'Free Space Remaining' and 'Bandwidth Remaining' indicators right under the words 'Your Files' on the file manager page.

Usually, 1 gig is more than enough for the community here. However, lots of images + lots of viewers = lots of used bandwidth, so if you're interested in saving that, you can use a free image hosting service.
Also, you may not yet be a BYOND member and don't have access to the file sharing or website that members do.

No worries. Using a image hosting site is very similar to the Byond member method and won't cost you any bandwidth.

I generally use http://www.imageshack.us/ but there are others (such as http://photobucket.com/ *) that work as well. I prefer imageshack because I don't hafta log in and I'll be using them for this example.

So...go to the imageshack site:

Image Hosted by ImageShack.us

You'll notice that same 'Browse' button and text field from the earlier section. Use it the same way. When you've got your filename in the text field to the left of the browse button, this time, click 'Host It!'. A new page will load.

Amongst all the ads there is a series of five lightly bordered text boxes with html or PHP code with titles to their right.

Image Hosted by ImageShack.us

Other sites (like PixelJoint) use the PHP code, so search their forums for how to use it there. For the purposes of posting in a BYOND site or forum, we want the one titled 'Hotlink for Websites' (the third down).

Click inside the text box and copy that code.
Now move to the post you want the picture in and just paste that line into the post (you don't need to add the '< img src="" />' this time).

Now, imageshack includes a link back to their site in the code you just pasted, so any person that clicks on your pic will be taken to the imageshack site. I usually remove this link, and if you want to as well, you hafta delete two sections from that line of code. First, delete the

and the
This will remove the link from your picture (the picture I used above this includes the link so you can see the behavior, if ya want).

Now, you can hit 'Preview Post' and see if it worked.

And there ya go.
There's a lot more you can do with a little inline CSS so experiment.
Now, POST SOME PIXEL ART!!!!



*You can get more info about uploading to photobucket here:
http://tutorials.photobucket.com/tutorial_3.html