About Me

The Full Story

Hi! I’m Will and I created a passive 5 figure passive income, within 5 years, through SEO and an effective blogging strategy. I share my incites exclusively on Ask Will Online.
Learn more about Me
dark

How to Change the Width of a Blogger Site

For anyone using blogger, blogspot or however you want to call it, you may find it quite restrictive in the sense that your blog can only be 1000 pixels wide. I don’t want this, you don’t want this so lets change it.

The problem with the new blogger is that when you click on design, then template designer, then adjust width, the maximum you can go is only 1000 pixels. Here’s a easy way of increasing the width of your blogger website to how ever long you want it if that’s 1200 pixels to 1500 pixels. However, always remember to save your template before you change it.

 
Go into your blogger dashboard and click on design, then edit HTML, search for the following HTML code: (press control and f then copy the code into the search bar to find it more easily)


<b:template-skin>
      <b:variable default=’930px’ name=’content.width’ type=’length’ value=’1000px‘/>
      <b:variable default=’0′ name=’main.column.left.width’ type=’length’ value=’260px’/>
      <b:variable default=’360px’ name=’main.column.right.width’ type=’length’ value=’180px’/>


With this one, just change the bold and underlined number to how wide you want it


or 

#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
…………………………….

#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
…………………………….

#main-wrapper {
width: 410px;
float: $startSide;
…………………………….

#sidebar-wrapper {
width: 220px; float: $endSide;
…………………………….
#footer {
width:660px;
clear:both;
 
Now, here the header-wrapper is the header
the outer-wrapper is the main section of your blog
the main-wrapper is the post section of your blog
the side-wrapper is the sidebar
and the footer is the footer 🙂
 
If you can’t find this, simply search for wrapper and then the following terms above.
Now, as you can see beside them, there are numbers with ‘px’ at the end of them. This stands for pixels and by changing the number you change the width. It’s as simple as that but just remeber the main-wrapper and side-wrapper must add up to the same pixels as the footer, outer-wrapper and header-wrapper.
 
e.g.
header-wrapper = 1200 pixels
outer wrapper is therefore 1200 pixels
main-wrapper could be lets say 1000 pixels
therefore, side-wrapper must be 200 pixels
and footer is 1200 pixels 🙂
 
With this information, you should be able to customize the width of your blog to as long or short as you want. It’a very useful tool as the restriction of 1000 pixels is just to short compared to other websites.
 
Happy blogging 🙂
Total
0
Shares

Leave a Reply

Related Posts