Home Life Trends How to Hide Blogger Sidebar to Display AdSense For Search Results

How to Hide Blogger Sidebar to Display AdSense For Search Results

When guests are trying to find content material in your weblog, you may have three choices to show the search outcomes: opening the leads to the identical window, in a brand new window or inside your individual website utilizing an iframe.

The best choice could be, nevertheless, to show the search outcomes inside your individual website/weblog, primarily as a result of you aren't sending people off your weblog when they're taken to a brand new web page of search outcomes which could possibly be complicated for a lot of as a result of it does not look something like your website or Google. Therefore, displaying the search outcomes inside your website, may make it look rather more skilled and can also improve the web page views and the income from the adverts on the search web page.

A Challenge that many bloggers are going through is that the web page which shows the AdSense for search outcomes have to be not less than of 800 px broad, so the posting space have to be of minimal 800px and there is nothing like this in many of the blogs.

So, what we'll do on this tutorial is to arrange the search outcomes to be displayed in a static web page (none of different posts or pages shall be affected) by which we'll take away the sidebar in order that we'll have sufficient house to make the publish/web page part of 800px broad. Moreover, we'll create a static web page designed just for the search outcomes, then create a brand new AdSense for search in our AdSense account and at last add a small snippet of code prime in your Blogger template to disguise the sidebar in that particular web page.

Search outcomes span the width of the web page with the sidebar hidden:

Display AdSense For Search Results Within Blogger Page

Step 1. Create a brand new static web page in your weblog, you can provide it the title 'Search Results' however depart the content material part empty after which Publish the web page.

Step 2. When you publish the web page you may have the choice to add the web page to a menu, select the third choice 'No Gadget Link To Pages Manually' click on 'Save and Publish'. In case this display screen does not present, proper click on on View Page and choose Copy Link Address. We will want this URL of the web page later once we will create the AdSense for search.

Step 3. Go To Your AdSense account, then go to My adverts tab, choose the Search choice and Create a New customized search engine. Follow the steps till you come to the Search outcomes choice.

Step 4. Select the third methodology "on my web site utilizing an iframe", then Enter the URL of the web page you created into the URL discipline and proceed.

Step 5. Follow the remainder of the arrange course of and on the finish you'll be given two items of code. The first piece of code is for the precise search bar which you'll be able to paste right into a Html/JavaScript gadget in your sidebar or wherever you need it. The second piece of code you want to copy and paste it into a brand new HTML/JavaScript gadget, click on on Save, then drag it above the Blog Posts space

Now that you've got your web page arrange with the search outcomes code and your search bar code in your sidebar, it's time to add a snippet of code to your template to take away the sidebar.

Adding The Code In Blogger To Change the Results Page Layout

Step 1. From Your Blogger Dashboard, go to Template and click on on the Edit HTML button

Step 2. Click anyplace contained in the code space and press the CTRL + F keys to open the Blogger' search field

Step 3. Find (CTRL + F) the next piece of code

]]></b:pores and skin>

Step 4. Just beneath it, paste this code:

<b:if cond='information:weblog.url == &quot;PAGE-URL-HERE&quot;'>
<model>
.main-inner .columns {
padding-left: 0px !vital;
padding-right: 0px !vital;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !vital;
proper: 0px !vital;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
show: none !vital;
}
</model>
</b:if>


Note: Replace PAGE-URL-HERE with the url of the web page the place the search outcomes shall be displayed (the one you may have added on the step 4)

Step 5. Now Save Template and also you're accomplished!

This easy trick permits you not solely to disguise the sidebar within the search outcomes web page, you'll be able to as nicely, disguise it on any web page you need... simply create your web page and observe the identical steps. It can be really useful to disguise the sidebar in Privacy Policy Pages, Contact Pages and on all of the non-content-based pages with little content material or no content material in any respect.