Photobucket subtly changes their page layout, which resulted in some changes in this "How To". The following is a repeat of the bulk of the original post with some updated screen shots and instructions.
----------------------------------------------------------------------------------
I figured I would put up these instructions for anybody interested in the "How to" for Photobucket thumbnails. For this example lets assume that you are in the process of creating a new thread on Xweb and want to add a picture (or many pictures). You have entered the text and now your are ready to go get some pics. Here is what you do.
1. Open a new browser window (leaving your Xweb thread open and ready for action) then go to your Photobucket account and select an album to work with. I chose my 2007 FLOSTL Fall Drive:
2. Hover your cursor over the first picture in your album and you will see the little menu drop down. Note the empty check box next to the image file name directly below the picture. (In this example it is "IM002196.jpg")
NOTE: While not the subject of this post, the "IMG code" box is circled in RED. If you click that it will copy the HTML necessary to post the full size image for this one picture. Just copy and paste the contents of the box into your Xweb post.
3. Click in the empty box below the picture and a check mark will appear.
4. Do the same for a couple more pictures in your album and note that the border of each selected picture remains BLUE to remind you that you have selected these pictures.
5. Now scroll to the bottom of the Photobucket album page and find the button labeled "Choose action" which I have circled in YELLOW. When you click on "Choose Action" you will see a drop down menu. The last option is "Generate link codes for selected" which I have circled in RED.
6. Click on "Generate link codes for selected" and you will see the following dialog displayed. The second section is labeled "IMG for bulletin boards & forums" and this is the section of code that works best for Xweb. This section has two text boxes. The first text box is labeled "Clickable Thumbnails". This is the code we are looking for and I have circled it in YELLOW.
NOTE: I have circled the "Full Size" box in RED. Select this set of code if you want to post full size images of all selected pictures.
7. Click anywhere inside the "Clickable Thumbnails" box of text and Photobucket will automagically select all the text for you. The text will disappear the the word "Copied" will be displayed briefly.
8. The word "Copied" will go away and the screen will revert to showing the text that was just selected and copied into your buffer. Click the X in the upper right corner of the dialog when you are finished.
9. Now we shift back to the Xweb forum browser window we started in, which has been patiently awaiting our return. I will use the creation of this thread as an example.
10. Now use your Xweb browser windows paste feature to drop the text you copied earlier in the Photobucket browser window.
11. Step 10 above will drop in the preformatted text that will display the thumbnails of the pictures you selected from Photobucket. It will look like this when you paste it into your thread:
12. It will look like this in the "Preview Post" option if you want to look at your handiwork before hitting "Submit New Thread".
13. Now you can play around with it in preview a bit and put text between pics if desired. Which would look like this in text mode:
14. And will look like this in preview mode:
15. So when you are happy with your work you can finally hit "Submit New Thread" and wait for the flames... err.. I mean wonderful camaraderie Xweb is known for.
Good luck and happy posting.
----------------------------------------------------------------------------------
I figured I would put up these instructions for anybody interested in the "How to" for Photobucket thumbnails. For this example lets assume that you are in the process of creating a new thread on Xweb and want to add a picture (or many pictures). You have entered the text and now your are ready to go get some pics. Here is what you do.
1. Open a new browser window (leaving your Xweb thread open and ready for action) then go to your Photobucket account and select an album to work with. I chose my 2007 FLOSTL Fall Drive:
2. Hover your cursor over the first picture in your album and you will see the little menu drop down. Note the empty check box next to the image file name directly below the picture. (In this example it is "IM002196.jpg")
NOTE: While not the subject of this post, the "IMG code" box is circled in RED. If you click that it will copy the HTML necessary to post the full size image for this one picture. Just copy and paste the contents of the box into your Xweb post.
3. Click in the empty box below the picture and a check mark will appear.
4. Do the same for a couple more pictures in your album and note that the border of each selected picture remains BLUE to remind you that you have selected these pictures.
5. Now scroll to the bottom of the Photobucket album page and find the button labeled "Choose action" which I have circled in YELLOW. When you click on "Choose Action" you will see a drop down menu. The last option is "Generate link codes for selected" which I have circled in RED.
6. Click on "Generate link codes for selected" and you will see the following dialog displayed. The second section is labeled "IMG for bulletin boards & forums" and this is the section of code that works best for Xweb. This section has two text boxes. The first text box is labeled "Clickable Thumbnails". This is the code we are looking for and I have circled it in YELLOW.
NOTE: I have circled the "Full Size" box in RED. Select this set of code if you want to post full size images of all selected pictures.
7. Click anywhere inside the "Clickable Thumbnails" box of text and Photobucket will automagically select all the text for you. The text will disappear the the word "Copied" will be displayed briefly.
8. The word "Copied" will go away and the screen will revert to showing the text that was just selected and copied into your buffer. Click the X in the upper right corner of the dialog when you are finished.
9. Now we shift back to the Xweb forum browser window we started in, which has been patiently awaiting our return. I will use the creation of this thread as an example.
10. Now use your Xweb browser windows paste feature to drop the text you copied earlier in the Photobucket browser window.
11. Step 10 above will drop in the preformatted text that will display the thumbnails of the pictures you selected from Photobucket. It will look like this when you paste it into your thread:
12. It will look like this in the "Preview Post" option if you want to look at your handiwork before hitting "Submit New Thread".
13. Now you can play around with it in preview a bit and put text between pics if desired. Which would look like this in text mode:
14. And will look like this in preview mode:
15. So when you are happy with your work you can finally hit "Submit New Thread" and wait for the flames... err.. I mean wonderful camaraderie Xweb is known for.
Good luck and happy posting.