Anda di halaman 1dari 2

Menyembunyikan Sidebar Blogspot

Menyembunyikan Sidebar pada Halaman Statik tertentu Blogspot


http://maiasfotos.blogspot.com/2010/12/hide-sidebar-on-designer-templates.html

Hide the sidebar on designer templates, on static pages or any other page.
On some static pages (and not only) you may want to hide the sidebar on your Blogger
blog.
In this tutorial I'll share how to hide the sidebar on designer templates on only specific
pages.
For Layout templates, please read the previous tutorial.

I applied this method on one of my blogs using an Awesome Inc. template. See the demo.
It displays correctly in all major browsers (IE including).
Designer templates are relatively new and there are a great variety of them. Therefor, your
template codes could be different from this, bellow.

1. Check your template

Open the source code of any page of your blog, from the view menu of your browser:
View|page source - in Firefox and View|Source in IE.
Look for the following section of code with your browser (Find or Ctrl+F):

If you find the two pieces of code, highlighted in yellow, in your source code, than you can
continue with this tutorial.
<style id='template-skin-1' type='text/css'><!--
body {
min-width: 950px;
}
.content-outer, .content-fauxcolumn-outer, .region-inner {
min-width: 950px;
max-width: 950px;
_width: 950px;
}
.main-inner .columns {
padding-left: 0px;
padding-right: 340px;
}
.main-inner .fauxcolumn-center-outer {
left: 0px;
right: 340px;
/* IE6 does not respect left and right together */
_width: expression(this.parentNode.offsetWidth -
parseInt("0px") -
parseInt("340px") + 'px');
}
.main-inner .fauxcolumn-left-outer {
width: 0px;
}
.main-inner .fauxcolumn-right-outer {

www.isparmo.web.id Halaman : 1
Menyembunyikan Sidebar Blogspot

width: 340px;
}
.main-inner .column-left-outer {
width: 0px;
right: 100%;
margin-left: -0px;
}
.main-inner .column-right-outer {
width: 340px;
margin-right: -340px;
}
#layout {
min-width: 0;
}
#layout .content-outer {
min-width: 0;
width: 800px;
}
#layout .region-inner {
min-width: 0;
width: auto;
}

2. Insert the code

In the highlighted code you can see the 340 digit in red. This is the width of my sidebar.
No matter what is the width or your sidebar, the following code will hide the sidebar,
anyway:
Step 1. Back up your template!
Step 2. Go to Dashboard | Design | Edit Html.
Step 3. Copy the following code and paste it right above </Head>
<b:if cond='data:blog.url == &quot;http://yourblog.blogspot.com/p/about.html&quot;'>
<style type='text/css'>
.main-inner .columns {
padding-left: 0px;
padding-right: 0px;
}
.main-inner .column-right-outer {
display: none;
}
</style>
</b:if>
Step 4. Replace the code in red with your own page url.
Step 5. Preview the page to be sure there is no mistake and save your edits.

Enjoy the result!


These changes will affect only the page with the url specified in the conditional tag, which
can be any page, static page of post page.
There are probably many ways to hide the sidebar. I find this method easy and fast, I hope
it works for you too.

www.isparmo.web.id Halaman : 2