How to Hiding Sidebar from your blogger Post Page?

Are you looking for How to Hiding Sidebar from your Post Page in blogger?

Did You want to hide your sidebars in Blogger blog post page & display post in full width? Show Slide bars only in Main page or Homepage in blogger. Then you can follow that method. With that method displaying functions in your Blogger home page like Header, Posts, sidebar, the footer will be invisible in post pages after just one click on any post. Then you can display post in full width.

However, that method is not recommended for 100% for your blog. Because if you are using absence or other earning method then that will be caused to reduce your income earning by displaying ads which placed in sidebars.

For do that magic trick we use conditional tags. By using conditional tags, we can do that easily. Also, you can display wide images with full-width related post widget. Both default template and Custom template blogger template user apply that method. But the method can be different upon your blogger template. 

How to Hiding Sidebar in Post Page?

1.For Default Blogger(classic)template users,

If still, you are using Default blogger templates (Classic themes) you can easily follow the below steps. However, we recommend you to use Custom blogger template. Then you can get more advantages. 

  Step01. Log into your Blogger Account

  Step02. Click on Blogger Dashboard

  Step03. Click on Template -->>Edit HTML

 Step04. Now find </b:skin>inside the HTML (simply you can do it by Pressing CTRL+F then type </b:skin>, hit Enter button)

  Step05. Copy below code & Paste code “after or below” </b:skin>.

<b:if cond='data:blog.pageType == "item"'>

<style>

.main-inner .columns {

padding-left: 0px !important;

padding-right: 0px !important;

}

.main-inner .fauxcolumn-center-outer {

left: 0px !important;

right: 0px !important;

}

.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {

display: none !important;

}

</style>

</b:if>

 Step06. Click Save & save your template.

2.For Custom Blogger template users.

If you are using Custom blogger template now it’s your turn. But my friends there is some problem with the Custom blogger template code. Maybe you know that all Blogger designers are not using the same words when they are coding that template. As an example, Some designers use main-area or other words behalf of main-wrapper. So it’s your own job to find out exact code when you are changing. So let see how to change your template to hide your sidebars,

  Step01.  Log into your Blogger Account

  Step02.  Click on Blogger Dashboard

  Step03.  Click on Template-->>Edit HTML

  Step04.  Now find </b:skin>inside the HTML (simply you can do it by Pressing CTRL+F then type </b:skin>, hit Enter button)

  Step05.  Copy below code & Paste code after or below </b:skin>

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<style>

#main-wrapper .post {

padding-left: 1px !important;

padding-right: 1px !important;

}

#main-wrapper { width:99%!important;}

.post { width:99%!important; }

#sidebar-wrapper,#sidebar-wrapper .left,#sidebar-wrapper .right, #midsidebar-wrapper .post-header-line-1, .post-footer{

display:none !important;

}

</style>

</b:if>

Step06. Click Save & save your template.

OK. That’s it. Now check your Blogger. Everything including sidebars must be showing on the homepage but after you are entering to the posting page then that sidebars going to disappear and your blog post page is full width. That is the easy method to  Hiding Sidebar from your Post Page in blogger.

I Hope the above tips help you to Hiding Sidebar from your blogger Post Page. And if you have any problem or know more on this, Please share with us in the comments section below. 

How to Adding a Second sidebar into your blogger blog?

When you are maintaining a blogger blog and want to add the second or another sidebar or looking for doing any changes to your blogger blog layout, First of all, you have to understand your Blog Layout consists of several sections and it is very important to know about blogger blog template basic layout.

The standard Blogger template has a header section, a sidebar section, the main section, and a footer section. Inside these section Bloggers puts the widgets, these are the Page elements that you can select from the template tab.

Before adding a second sidebar or doing any changes to your blogger blog layout, first of all, you have to understand about how looks like the Blog layout? Basically, the Blog Layout consists of several sections. The standard Blogger template has a header section, a sidebar section, the main section, and a footer section. Inside these section Bloggers puts the widgets, these are the Page elements that you can select from the template tab.

Then, let's take a look at the common structure of a standard Blogger layout. If you create a fresh and new Blog site, the Page Elements Tab looks like this:

the common structure of a standard Blogger layout

This Layout has 4 sections:

·             Header

·             Main (with the Blog Posts),

·             Sidebar

·             Footer

The HTML-template looks like this (the line-numbers are added for reference only):

010: <body>

020: <div id='outer-wrapper'>l<div id='wrap2'>

030: <!-- skip links for text browsers -->

040: <span id='skiplinks' style='display:none;'>

050: <a href='#main'>skip to main </a>

060: <a href='#sidebar'>skip to sidebar</a>

070: </span>

080: <div id='header-wrapper'>

090: <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

100: <b:widget id='Header1' locked='true' title='Second Sidebar (Header)' type='Header'/>

110: </b:section>

120: </div>

130: <div id='content-wrapper'>

140: <div id='main-wrapper'>

150: <b:section class='main' id='main' showaddelement='no'>

160: <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

170: </b:section>

180: </div>

190: <div id='sidebar-wrapper'>

200: <b:section class='sidebar' id='sidebar' preferred='yes'>

210: <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>

220: <b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>

230: </b:section>

240: </div>

250: <!-- spacer for skins that want sidebar and main to be the same height-->

260: <div class='clear'> </div>

270: </div> <!-- end content-wrapper -->

280: <div id='footer-wrapper'>

290: <b:section class='footer' id='footer'/>

300: </div>

310: </div></div> <!-- end outer-wrapper -->

320: </body>

Lines 010 and 320 are the body-tags. All code has to be between these two tags.

Lines 020 and 310 are the div-tags for two wrappers, that wrapper called "outer-wrapper" and the wrapper called "wrap2". In CSS you can define fonts, colors and other styling for these wrappers. We can look about CSS code after that.

Lines 080 - 120 contain the header. There is a div-wrapper (080 and 120) as you can see, section tags (090 and 110) and the widget that contains the header itself (100).

Lines 130 - 270 contain the content. That content means by blog posts and sidebars. There is a div wrapper called "Content wrapper"

(130 and 270) and inside this wrapper there are 2 more wrappers, they are the "Main wrapper" (140-180) and the "Side wrapper" (190-240).

Inside the Main wrapper, we find the Main section (150 and 170) with the Blog widget (160). This widget contains our posts.

Inside the Sidebar wrapper, we find the Sidebar section (200 and 230) with an Archive widget (210) and a Profile widget (220).

 Finally, we have a Footer (280-300).

Now that we understand the common structure of standard blog site layout, then let's take a look at How about the formatting of this template. In the style-sheet you will find the following code:

#outer-wrapper {

width: 660px;

padding: 10px;

....... }

#main-wrapper {

width: 410px;

float: left;

....... }

#sidebar-wrapper {

width: 220px;

float: right;

........ }

The outer wrapper has a width of 660 pixels. The padding is set to 10 pixels so that everything that is inside the Outer wrapper stays 10 pixels from the border. So that leaves 660 - 20 = 640 pixels for the main wrapper and sidebar wrapper.

The main-wrapper has a width of 410 pixels and floats to the left.

The Sidebar wrapper had a width of 220 pixels and floats to the right. Together, Main wrapper and Sidebar wrapper have a width of410 + 220 = 630 pixels. In the middle, there is a space of 640 - 630 = 10 pixels.

So, if we want to squeeze in a second or more sidebar, we have to do something to create some space. As it is now, it won't fit in.

How to Adding a second sidebar?

For adding a second sidebar to blogger blog, First, we will add the sidebar to the structure of the template, then we will add it to the CSS and make it fit into the page. Then finally, we can place the second sidebar into the blogger template as we prefer. 

So let’s see how to add a second sidebar to our blog.

Step 1: Backup the template.

Step 2: Make your right sidebar unique.

Change lines 190 and 200:

190: <div id='right-sidebar-wrapper'>

200: <b:section class='sidebar' id='right-sidebar' preferred='yes'>

In your CSS style sheet, change "#sidebar-wrapper" to "#right-sidebar-wrapper".

If you save your template then view your blog, it should look okay.

Step 3: Add a left sidebar by adding new lines of code, (After content wrapper & before main-wrapper).

         <div id='content-wrapper'>

131. <div id='left-sidebar-wrapper'>

132. <b:section class='sidebar' id='sidebar-wapper' preferred='yes'/>

133. </b:section></div>

Now save your template, and take a look at the Page Elements tab.

You can see there is a new section, just below the header and above the posts. But the problem is that it is not on the left side of the screen jet. Therefore, we have to add some CSS.

Step 4: Add CSS for the left sidebar.

In your CSS style sheet, add the following code:

#left-sidebar-wrapper {

width: 220px;

float: left;

word-wrap: break-word;

overflow: hidden;

}

Now your page layout tab will show something just like this: Click here to view.

The sidebar section is now to the left side, but your right sidebar is suddenly below to your posts. That is because of the width of 2 sidebars and a Main section counts up to 840 pixels and that is more than the width of the Outer wrapper (660 pixels).

Step 5: Change Outer wrapper & Header wrapper width.

In your CSS style sheet look for the #header-wrapperand #outer-wrapper definitions and change the width from 660 to 860.

Step 6: Add a page element.

Now finally, you can add a page element to your left sidebar.

Your Blog Layout will look like below,

If you want to add another section or more sections to add more elements, then you can add another section to existing sections. Click here to view

Just Copy & paste below code.

                      

<b:section class='sidebar' id='sidebar2' preferred='yes'>

 </b:section>                       

OK, my friends. Now I think you have a better idea about adding the second sidebar to blogger blog.

Then you can add more sections to add more elements.

I Hope the above details help you to Know about your blogger blog template basic layout and to add a second sidebar into your blogger blog? And if you have any problem or know more on this adding a second sidebar into your blogger blog, Please share with us in the comments section below. Enjoy your blogging.

How to Disable Automatic Updates in Microsoft Office 2016? Try this 5 methods.

It is better to try below 5 methods to Disable Automatic Updates in Microsoft Office 2016.

If you are using the new Microsoft Office 2016 package on your Windows, then you may find that it automatically updates every time when the internet network is available on your computer. That’s because Microsoft Office 2016 comes with the auto-update feature, which is enabled by default so that it will automatically update without any informing for you. The auto-update feature saves users from manually updating. 

However, constant updates may make the drives or applications on some computers not perform well, also it effects to your speed up internet connection so that some users may want to disable auto updates feature and stop Office 2016 from updating. Also if you are using a limited internet plan that auto-updates can be a huge headache for you. 

How to add a new Blogger Template for your blogger blog? - Search Engine Optimization

Adding a new Blogger Template for your blogger blog helps you to give a new looking for your blogger blog as well as the development of your blogger SEO.

If you are still using the particular default blogger theme, then it’s now time to change for the professional template. A blog using the default blogger template won't ever get a better rank in the search engine as well as also it has many fewer subscribers and visitors. For default template no specialized design & appears to be ugly, right? This is actually little about building. As a beginner of the blog site, it's OK if you are using that, but with the time it’s better to move the professional temple. 

A default blogger template is just not SEO friendly as well as not robots friendly. Also, that will not provide you with a lot in search results & the blog is ready to get more organic traffic. We can ensure it is highly friendly for everyone as well as search robots.

Also, your visitors also want to watch the blog having professional looks. Because of that, we have to move to a third party template which was designed by others or by us. That is SEO friendly as well as robots friendly. That will provide you with a lot in search results as well as it is highly friendly for everyone including search robots.

So then why are you currently waiting for just change your blogger template?

How to add a new Blogger Template for your blogger blog?

If you cannot develop your own template, you can get third party support from web/blog designer or You can download Professional blog template from popular blog template providing sites. Most of them are free.

Below there are some listed some popular Blogger Templates blog which provides SEO Friendly and Professional looking.

•     SoraTemplates.com
•     DesignCart.org
•     BTemplates.com
•     Deluxe Templates.net
•     Templateism.com
•     Templateify.com 

First You have to download your favorite third-party template from above-listed sites and use its .xml file to change your template.

1.    Log in to your Blogger account.
2.    Then click on the drop-down menu and choose Template.
3.    Press Backup/Restore button located at the top right corner.
4.   First, you should download your existing template as a backup. So, click on the “Download full template”  button
5.    Now click on the Choose File button and choose your new template which you want to apply to your blog.

   

               06.    Once you select your template, simply click on the Upload button for the final step

You are done!

* Most of the above template provided that template for money. If you want a premium blog template with advanced facilities, you have to pay some money for those providers. But you can download the free version of that template. But that includes their footer credit links, encrypted code, and scripts.

I Hope the above tip help you to add a new Blogger Template for your blogger blog? And if
you have any problem or know more on this, Please share with us in the comments section below.