How to use www.Photobucket.com

Your photo—in digital format on your computer hard drive—can only be seen by people who look at it on your screen, or people who you email the digital file to.

A hosting site gives your photo a URL of its own—an address on the Web—that people can visit, or that you can "point to" by linking to it on another Web site.

First, you need to upload the photo to the hosting site. Because it seems to be one of the most popular and easiest photo hosting sites to use, I will focus this tutorial on the Photobucket site.

How do I upload a photo?

You need to send your photo to the hosting site before they can give it a URL of its own.

There are several ways to upload a photo to Photobucket:

• simple upload
• drag-and-drop

We'll start with the simple upload method.

screencap of basic upload window

When you first log in to your account, you will see the above box (or something similar) and may be tempted to start uploading right away.

STOP!

Before you start, figure out the best way to organize the files you will be hosting online. If you upload all of your files here on the main page, you'll soon have a big mess of unrelated files. And if you try to sort them later, all of the links will break because the URLs will change.

So, come up with a plan for arranging the files, much like you would sort them into folders on your hard drive for ease of use, and then check the left side of your screen for something like this:

screencap of albums window

Yours may look a little different, as under my main account login of xpsquid I have already created an "album" called TITAN.

Click in the box beneath "Add a new album" to enter a name for your album, and click "SAVE."

Important! When you add a new album, you will be automatically transported from your main account area into that new album! Before you add the next album, be sure to click back to [account] so all of your folders are on the main level.

Once you have created all of the albums you need, click on the name of the album you want to upload files to. In the example below, I have clicked on Squidoo.

screencap of albums window from inside an album

This window shows that I am now "inside" the Squidoo Album. Now I'm ready to upload files that pertain to Squidoo.

screencap of basic upload window with two files selected

Click "browse" to find files on your hard drive. Once you find the 1-3 files you want to upload (click the "Add More" option if you have 4-10 files ready to go), click the blue UPLOAD button and wait a moment.

When your upload is finished, below the basic upload window you will now see small "thumbnail" versions of the files you have uploaded, and below them, codes and boxes of text that probably make no sense at all.

Next, we are going to explain some of those codes and how they will help you post your photo on a site!

How do I link to a photo?

You figured out how to upload your photo or other digital image file.

Now, you need to learn how to post the image (or more appropriately, the link to the image) on another Web site.

Take a quick look at this screen capture from my Photobucket account:

Photobucket does not just give you one piece of "code" ... there are several options because various sites have different requirements.

• Email & IM
• Direct Link
• HTML Code
• IMG Code

Email & IM: In the example above, the full code in the first box is:
  http://smg.photobucket.com/albums/v50/freelief/
  ?action=view&current=allhorses-card.png

You can paste this URL (all on one line) into an email you are sending, so that you don't have to attach one or more files to the email. You can also paste it into your instant messaging window (AOL, Gmail Chat, etc.) and it will become a hyperlink the other person can click on to view your photo.

Direct Link: The code in the next box looks like this:
  http://img.photobucket.com/albums/v50/freelief/allhorses-card.png

If you are asked to give an "Image URL" when composing a blog post in Blogger or on some types of message board, this is the URL you should paste in.

HTML Code: There is more to the next code than just the photo URL. Take a look:
  <a href="http://photobucket.com" target="_blank">
  <img src="http://img.photobucket.com/albums/v50/freelief/allhorses-card.png"
  border="0" alt="All Horses"></a>

This is the code that Photobucket provides to make it easy for users to post on HTML-enabled forums, and sites such as Myspace and Squidoo. However, since the entry-level user relies on Photobucket to produce the code for them, the image host includes a promotional link back to their site.

In many cases, you probably won't want that. So, you may need to touch up the code just a little. To do this, carefully remove everything from the first <a all the way to the first > (be sure to stop before <img) and then also remove </a> at the end.

You've just removed the code that creates a link from the image to Photobucket, while retaining the HTML image code you need.

(Alternately, you can simply change http://photobucket.com to another Web site that you DO want the person who clicks on the image to be forwarded to ... like your Squidoo lensmaster profile!)

An easier way is to use the Direct Link code provided by Photobucket, and carefully adding the necessary HTML code <img src=" at the beginning and a closing "> at the end. Once you've memorized these few keystrokes, you can post images with ease!

IMG Code: This is provided for easy posting of photos on message boards and forums that do not support HTML but instead offer a way of coding that will display your photo if you simply "wrap" the URL where the photo is hosted (your Direct Link) in their own bracketed codes:
  [IMG]http://img.photobucket.com/albums/v50/freelief/allhorses-card.png[/IMG]

On a few message boards, it is [IMAGE] instead of [IMG] but the results are the same. You need only to paste this code into your message where you want it to appear. Use the forum's "Preview" feature, if there is one, to see how it will look.

My image is way too wide for the Squidoo module ... what can I do?

Insert width="500" into your IMG tag as shown in the example below, and the display will be forced to a 500 pixel wide frame:
  <img src="http://imagehost.com/file.jpg" width="500">

Why change the way the image is displayed rather than simply upload a smaller file (or have Photobucket resize the photo for me)?

One good reason to keep your image its original width is when you want to create a visual link to a screencap. These tend to be 800 pixels wide or more, which won't work within a Squidoo module, but reducing the size of the original file may make them unreadable.
  <a href="http://imagehost.com/file.jpg">
  <img src="http://imagehost.com/file.jpg" width="500"></a>
By making the image link to its own Direct Link, the user can click it to see it full size. (Alternately, users can right-click to "view" the original image. How you present the options is up to you!)

Wait... did you say Photobucket will resize my HUGE images for me?!

Yes. This can be done during upload. You can upload the same file several times with the maximum image size set to different sizes and preview the results.

image size options for free Photobucket accounts

I'm not going to cover the bulk uploading feature offered by Photobucket at this time. I have either browser or operating system issues that leave me watching this for some time:

(sorry, no interest in creating animated gifs today)

If there is enough interest, I can see about getting an expert at SquidU to tackle this module for me.

Photobucket offers a number of FREE photo editing tools you can use if you don't have any software on your computer.

Click on this screencap to view it full size
(be sure to click BACK to return to this lens):

If anyone would like any of the tools covered in more detail, please leave a message in the guestbook below and I will do my best to help.

Drop by our SquidU.com forum. Ask for help, don't be stingy, be sure to smile, and we're betting someone will come to the rescue.