How To Hide Blogger Sidebar to display AdSense for Search Results

When visitors are searching for content on your blog, you have the following options for displaying search results: opening results in the same window, in a new window or in your own web page using an iframe.

But the best option is to display the results in the website / blog of your own, especially since you do not send people off your blog, and when they were taken to a new page of search results, so it can be confusing many times because it doesn 't see what such as your website or Google. Therefore, display search results in your site, can look more professional and can also increase your page views and income from ads on the search page.

One problem that many bloggers face is that sites that display AdSense for search results must be at least 800 px wide, so that the settlement must be a minimum of 800px and there's nothing like it in many blogs.

So, what we will do in this tutorial is to provide the search results will be displayed in the static pages (no posts or other sites that will be affected) where we will remove the sidebar, so we will have enough space to make a post / page section 800px wide. Also, we will make a static page specially designed for search results, then create a new AdSense for search AdSense account and finally add a small snippet of code in the top of your Blogger template to hide the sidebar in specific page.

Wide range of search result pages with the hidden sidebar:

Displaying AdSense for Search Results Page In Blogger

Step 1. Create a new static page on your blog, you can give 'Search Results' title but leave the content empty and then Publish the page.

Step 2. When you publish the page you have the option to add a page to the menu, choose the third option "No Gadget Links To Pages Manual 'click' Save and Publish '. OR in case this screen will not appear, right click on the Page View and select Copy Link Address. We need the URL of this page when creating AdSense for search.

Step 3. Go To your AdSense account, then go to my ads tab, select Search and Create New custom search engine. Follow these steps until you come to the Search Results option.

Step 4. Select the method of the 3 "on my website using iframe", then enter the URL of the page you created into the URL field and continuously.

Step 5. Follow the whole set of processes, in the end you will be given two pieces of code. The first piece of code is the actual search bar that you can paste into the html gadget / Javascript in your sidebar or wherever you want. The second piece of code you need to copy and paste into the HTML gadget / JavaScript new and after click on Save - pull on the Blog Posts

Now that you have your page set up with the search results code and your search bar code in your sidebar, it is time to add a snippet of code to your template to remove the sidebar.

Adding Code In Blogger To Change Result Page Layout

Step 1. In your Blogger Dashboard, go to Template> Edit HTML 

Step 2. Find (CTRL + F) the following code

"]]> </ b: skin>"

Step 4. Just below, paste this code:

<b:if cond='data:blog.url PAGE == "URL LINK PAGE"'>

<style>

. peek-inner. Columns {

padding-left: 0px! important;

padding-right: 0px! important;

}

. peek-inner. fauxcolumn-center-outer {

left: 0px! important;

right: 0px! important;

}

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

display: none! important;

}

</ style>

</ b: if>

Step 3. Now Save Template and you're done!

This simple trick allows you not only to hide the sidebar on the search results page, you can, as well, to hide in any page you want to ... just make your page and follow the same steps. It is also good to hide the sidebar on page Privacy Policy, Contact Page and in all non-content-based pages with little content or content that short all.

Ranking: 5