The Nest - Buying a Home, Money Advice, Decorating Ideas, Easy Recipes

Message Boards | Recipes | Blogs
Photos | Tools | Q & A

community

all boards

my blog

my photos

my boards


200+ Easy Weeknight Meals!

Green living: Eco-friendly tips & tricks!

All Boards > Photography

This thread is no longer active. See our most recent posts and join!
06-08-2010 at 1:17 PM
stina-bear
Not Ranked
Joined on 05-19-2009
Central NJ
4,436 Posts
90,009 Points
stina-bear is not online. Last active: 07-19-2011, 6:49 AMSilver

How to make blog columns wider

I really love using blogspot for my personal blog (link in siggy), but I dislike their standard blog templates -- not only are they boring, but they also force you to use teeny little columns, so you can't post photos larger than about 400px.

((NOTE: The following is a writeup of how *I* changed the coding on my blog.  There are easier ways to get similar results -- for instance, just downloading a photoblog template from Our Blogger Templates, which will give you a nice wide post column, a horizontal linkbar, and a three-column footer.  I like having more control over the colors and backgrounds in my blog, though, so I went about it the hard way.)

In order to post larger photos, you need to change two things about your blog: the width of the main post column, and your background (so that your new wider columns aren't going to be obscured by the design going down the sides of your blog).

Your blog likely has two columns -- one for the posts, and one sidebar for widgets.  In your HTML, the width of the whole blog is the "outer wrapper," the width of the post column is the "main wrapper," and the width of the sidebar is the "sidebar wrapper."

Go to your dashboard, then Layout, then the Edit HTML tab.  Find the code that starts with #outer-wrapper {.  You'll see three sections of code -- one for outer-wrapper, one for main-wrapper, and one for sidebar-wrapper.  Each section has a line for width.  Change these to your liking -- just remember that the outer-wrapper has to be large enough to encompass both the main-wrapper and the sidebar-wrapper (plus about 20 pixels so you have some space between the two columns).  Back when I had two columns, I had my outer set at 750px, main at 500 and sidebar at 230.

If you want something like my blog (where there's just one column, for posts stretching across the entire page), you can set your outer to 750px, your main to 730, and your sidebar to 0.

Save your template, and then view your blog.  If your new wider columns are bumping up against the borders of your background, you'll need to change your background image.

I had a cute background from Cutest Blog on the Block that has a scrapbook-like border along the two sides.  Creating a wider post column would have made my blog posts be superimposed over the border design.  So I downloaded the image file for the background -- go into the code of your background (in the widget where you downloaded the background code), look for the image URL (starts with http://, ends with .jpg), and copy and paste that URL into your browser.  Then right-click on the image and save it to your computer.  I opened it in PSE, and basically stretched the middle of the image -- let me know if you want a step by step tutorial on how I did that.  Then I uploaded my new image to my own image hosting site (I use Smugmug), went back into my background code widget on my blog, and replaced the CBotB background image URL with my image URL.

So that's how I did mine!  It's a lot of text, writing out all the steps, but it's actually super easy.  Let me know if you have any questions or need any more help.


Joshua looooved his birthday cake!


In my camera bag:
Canon 7D (squeee!)
Canon 24mm f/1.4L, 17-55mm f/2.8, 50mm f/1.8, 85mm f/1.8
Canon 430EX-II Speedlite 
06-08-2010 at 1:22 PM
lizlemon77
Not Ranked
Joined on 01-23-2009
Wauwatosa, WI
4,523 Posts
18,862 Points
lizlemon77 is not online. Last active: 06-01-2011, 5:58 AMSilver
Yikes.  I'm a whole lot dumber than I thought.  You lost me during the first paragraph!  Is there a blogging for dummies site out there somewhere?
Amy,

Isabelle 11/26/06 and Sophie 02/22/08
When you have children
Your days seem so long
But the years fly by!
__________



 
06-08-2010 at 1:22 PM
janineb
Not Ranked
Joined on 12-08-2006
hiding in your interwebz
10,940 Posts
3,602 Points
janineb is not online. Last active: 05-16-2012, 5:07 PMGold

FYI, blogger also has a "draft" blogger format. In it they are testing their new templates wizard, and if you use it to build/reformat your blog, it allows greater customization of columns, headers, background etc, without having to understand html or change your code.

go to draft.blogger.com. under the blog you want to change,  choose "design". Before where it said "change template", there is now a template designer button.

I was able to use this to instantly make my columns wider just by dragging them.

Make sure to save a copy of your current blog code, in case you want to go back.

AlternaTickers - Cool, free Web tickers 
06-08-2010 at 1:32 PM
grinsandgi...
Top 150 Contributor
Joined on 11-20-2008
18,207 Posts
46,524 Points
grinsandgiggles is not online. Last active: 12-21-2011, 9:25 PMPlatinum
janineb:

FYI, blogger also has a "draft" blogger format. In it they are testing their new templates wizard, and if you use it to build/reformat your blog, it allows greater customization of columns, headers, background etc, without having to understand html or change your code.

go to draft.blogger.com. under the blog you want to change,  choose "design". Before where it said "change template", there is now a template designer button.

I was able to use this to instantly make my columns wider just by dragging them.

Make sure to save a copy of your current blog code, in case you want to go back.

Holy crap, thank you!

 
06-08-2010 at 1:35 PM
stina-bear
Not Ranked
Joined on 05-19-2009
Central NJ
4,436 Posts
90,009 Points
stina-bear is not online. Last active: 07-19-2011, 6:49 AMSilver
janineb:

FYI, blogger also has a "draft" blogger format. In it they are testing their new templates wizard, and if you use it to build/reformat your blog, it allows greater customization of columns, headers, background etc, without having to understand html or change your code.

go to draft.blogger.com. under the blog you want to change,  choose "design". Before where it said "change template", there is now a template designer button.

I was able to use this to instantly make my columns wider just by dragging them.

Make sure to save a copy of your current blog code, in case you want to go back.

Dude.  I just spent all that time writing it out, and you're telling me there's an even EASIER way of doing things??

Sigh.  Story of my life...

Next up, a tutorial on how to manually focus...  :)



Joshua looooved his birthday cake!


In my camera bag:
Canon 7D (squeee!)
Canon 24mm f/1.4L, 17-55mm f/2.8, 50mm f/1.8, 85mm f/1.8
Canon 430EX-II Speedlite 
06-08-2010 at 1:44 PM
janineb
Not Ranked
Joined on 12-08-2006
hiding in your interwebz
10,940 Posts
3,602 Points
janineb is not online. Last active: 05-16-2012, 5:07 PMGold

I am sorry! I think what you posted IS incredibly helpful, especially if someone has already customized their blog and just wants to tweak the column size

the draft blogger wizard thing will basically erase any customizations you have done to now and I think you have to repick your template, so if you use a customized template already, it won't help you. 

But for people who are not attached to their current blog template/layout, it is easier to use the draft blogger thing and start from scratch.
AlternaTickers - Cool, free Web tickers 
06-08-2010 at 1:46 PM
afwells
Not Ranked
Joined on 10-05-2007
Virginia
9,990 Posts
21,374 Points
afwells is not online. Last active: 03-20-2012, 9:17 PMGold
Okay.  So.  Who can I pay to fix my blog for me?  Although by nature I am a control freak, and love graphic design & such, I really just already have so much to do.  I'd rather spend the time entertaining you all with witty anecdotes, and editing my photos, that trying to decipher HTML. 

SO, who wants to make $10?  Because, uh, that's like, all I have.  I can barter, though.  I can help pick paint colors for houses and stuff.  I'm really good at that. =D  Oh, and I get 10% off of Pottery Barn & all those WS affiliates (yeah, I know, it's like free shipping, but still, it adds up).  And Restoration Hardware too!  So, that's like, all I have going for me.
 
06-08-2010 at 1:47 PM
stina-bear
Not Ranked
Joined on 05-19-2009
Central NJ
4,436 Posts
90,009 Points
stina-bear is not online. Last active: 07-19-2011, 6:49 AMSilver
janineb:

I am sorry! I think what you posted IS incredibly helpful, especially if someone has already customized their blog and just wants to tweak the column size

the draft blogger wizard thing will basically erase any customizations you have done to now and I think you have to repick your template, so if you use a customized template already, it won't help you. 

But for people who are not attached to their current blog template/layout, it is easier to use the draft blogger thing and start from scratch.

Ahh, I see.  I feel better now!

That's really useful for people starting out, though.  I know tons of people who are thinking about starting blogs, so I'll be sure to file away this bit of info to help them out!


Joshua looooved his birthday cake!


In my camera bag:
Canon 7D (squeee!)
Canon 24mm f/1.4L, 17-55mm f/2.8, 50mm f/1.8, 85mm f/1.8
Canon 430EX-II Speedlite 
06-08-2010 at 4:51 PM
goteamgo
Not Ranked
Joined on 07-15-2007
Chicago Area, IL
4,181 Posts
835 Points
goteamgo is not online. Last active: 05-04-2012, 9:59 PMSilver
Thanks, Stina! I made mine wider. I like my simple layout, so it was easy.
weddingpic jamessmall gracied
Susan & Mark ... Married June 14, 2008 ... Chicago Area
James Tomasz born 1-5-10
Grace Dorothy born 7-13-11

PROJECT BALANCING ACT: BIO and BLOG- yeah... needs to be updated. 
06-08-2010 at 6:44 PM
smfinallym...
Not Ranked
Joined on 01-23-2005
----
4,563 Posts
2,551 Points
smfinallymg is not online. Last active: 02-02-2011, 2:57 PMSilver

afwells:
Okay.  So.  Who can I pay to fix my blog for me?  Although by nature I am a control freak, and love graphic design & such, I really just already have so much to do.  I'd rather spend the time entertaining you all with witty anecdotes, and editing my photos, that trying to decipher HTML. 

SO, who wants to make $10?  Because, uh, that's like, all I have.  I can barter, though.  I can help pick paint colors for houses and stuff.  I'm really good at that. =D  Oh, and I get 10% off of Pottery Barn & all those WS affiliates (yeah, I know, it's like free shipping, but still, it adds up).  And Restoration Hardware too!  So, that's like, all I have going for me.

 You have PM!

A Grande Life
Image and video hosting by TinyPic

Baby Birthday Ticker Ticker
Pregnancy Ticker 
hot topics

"Dealing with weddings post divorce..."
R&B3-26-05 on Starting Over

"How often do you typically have sex a week?"
sweetsunset08 on Sex & Romance

"Are you friends with 'that couple'?"
OrangePixyStix on BNTOB

search boards

choose another board

most active posters
papagena
138 posts
pixy_stix
104 posts
Tambcat
90 posts
thejennigi...
75 posts
IrishBride...
53 posts
marriedchi...
49 posts
gymnst1013
43 posts
**Gretchen...
43 posts
Dr.Loretta
42 posts
LoriFalce
38 posts

connect with these online Nesties
mnbv9502! love2b_mrst
smiley289 heymommy
oncoRN nfrtny
MTNurse skibi83
LucyLove657 kujayhawkgirl
MoonBaby123 caprisunn22
amy052006 barnwife
raashton juliane2004
ryeleeandrori agentash
aveeh JojoGracielou
biblionerd sydsmom04
lruloph Mrs Castillo
CityBee mjledwith
Jessii266 vivi85
Erin&Rod BuffaloMomToBe
From The Nest Boards:
"Finding couple friends?"
marinomelissa on Relationships

"Favorite pumpkin recipes?"
laurasr1984 on What's Cooking?