Big Photos on Blogger

Here's a step-by-step on how to get your photos bigger and re-arrange your blog to fit them! It's really easy, but first you've got to get a Photobucket account, which is very easy and free. Okay, here we go.

~

1. Upload the image(s) you wish to have on your blog. Use the CTRL key to select several files at once.

2. Once the image(s) has/have uploaded, click on "Edit" on the left side by the top. Rather unfortunately, you have to do each picture separately.

~

3. Now, hit "Re-size."

4. I re-size it to about 530 pixels wide, but you can do whatever you need to suit your needs. Make sure, though, to have "Keep Proportions" selected!!! Or you can use one of their preset sizes for easy convenience.
EDITED 7-09... I now have my photos BIGGER... and I use 640 x 800, I think. Whatever it is, it's the large setting on photobucket. =)
This is very handy, since you can re-size them without editing at all! Just take a close look at the area where you begin the upload process. On the bottom corner, there is a small dropdown menu that has different sizes on it. You can simply re-size the photos as they upload by selecting a size. Unfortunately, there is no way to put in a custom size.

5. When you're done, hit "Replace Original." (on the bottom of the screen.) I don't save all the old ones, I just replace the originals in my account. After the image is done saving itself, you'll go to a new page where the image is on the left. Scroll down a teeny bit till you see this box on the right and grab that Direct Link.

~

6. Back on blogger, click "Upload image." (you know, the little photo on top of the post section.) Instead of uploading from your computer, look to the right of the screen where it says "Add an image from the web." and paste your direct link there. It uploads really quickly.7. Ta-da!! (note - this photo is still at the 530 px size I used to have my photos at.)

OKAY! Now about re-sizing that blog to fit the photos!

1. Make sure your template is Minima (I don't know how to work with Minima Stretch). From your dashboard, go to Layout -> Edit HTML.

2. Find the text that says...
/* Outer-Wrapper
---------------------------------
Now go under that... and under where it says #outer-wrapper { to where it says width____ px. This is set to somewhere in the 600s, I believe? Change that to a much larger number. (start with 800 for the moment.) The outer wrapper is the area of the entire blog (from the left side of the posts to the right side of the sidebar.)

3. Under that paragraph, find #main-wrapper. Change the width of the main wrapper to 600 for now. The main wrapper width measures the width of the posting area.

4. Even further down the list is #sidebar-wrapper. Change that to 200 px for now.

5. Click on preview to check your progess! You're doing great. Okay, now if you have a background, you'll need to do some custom adjusting.
• The smaller the width of the outerwrapper, the further to the right edge of the screen it will be.
• The widths of the sidebar wrapper and main wrapper must not exceed the width of the outer wrapper, or your sidebar will be shoved to the bottom. Now, that is the way I want mine. You can see this by scrolling down to the bottom of my blog, and there's my sidebar! If you don't want that sidebar at the bottom, simply make sure the measurements don't exceed the outer wrapper measurements.
• The size you re-size those photos too (example, 530 px) is the size you NEED to have your main wrapper at. It's really much better if you have your main wrapper at least 10 px wider than your photo size.

6. Enjoy your cool new blog look!!!