Category / Blogger Tweak

by Nirupam Biswas

Make the top bar (navbar) disappear.

I once made a similar post. That trick no longer works since blogger.com’s upgrade. Now I have a new cleaner and better trick to make the top banner disappear. Add a new HTML/Javascript widget to your template. Now in this template add the following code.

<!--exclusively BY APPLEGREW (applegrew.blogspot.com),
HIDES Navbar -->
<style type="text/css">
div#navbar { display: none; }
</style>
<!--end of HIDE Navbar-->

Now save the widget and reload the page.

A tip. The navbar won’t disappear until this code gets loaded, hence make it gets loaded faster. Simply put it in head portion of your template.

by Nirupam Biswas

Posting PHP codes on blog.

If you want to post PHP code on blog or any web page then its easy. Use the command:-

php -s /path/to/your/php/script > The_Code_to_post

This will generate a html code that you can directly paste in the web page’s code to display your code with syntax highlighting, but if you post this code in Blogger.com or Drupal then you will notice extraneous blank lines after every line of your code. This is due the fact that Blogger.com and Drupal insert a line break themselves whenever they encounter a new-line or carriage-return. To fix this problem, use the following command instead of the above one.

php -s /path/to/your/php/script | tr -d ‘\n\r’ > The_Code_to_post

by Nirupam Biswas

Fixing – Blogger.com won’t publish ur posts sent from ur mail or other such remote locations.

For past few months all my posts sent remotely (eg. sent from by email, Google Video or Digg) were being saved as drafts and not published. I had the Publish option turned on even then. I informed Blogger.com help desk about it, but as usual they never responded.

Well now it turns out that their bot had actually flagged my blog as a ‘spam blog’. (Click here to read what a spam blog is.) The solution is to go to the following url

http://www.blogger.com/unlock-blog.g?blogID=x

replace x by your blog’s ID. To know what is your blog’s ID. Login to your Blogger.com account and click on the concerned blog’s name. See the address box of your browser it will contain something like

http://www.blogger.com/posts.g?blogID=x

There will be a number instead of x. This is your blog’s ID.

When you are at that page then the page will guide you from there. Happy blogging!

by Nirupam Biswas

How to make the top banner of Blogger.com disappear!

Note
This trick no longer works. For a better and newer trick that actually works now see my post Make the top bar (navbar) disappear.

As u can see at the top of my blog, there is no banner. I read about tricks to do that. That trick required us to remove a code in the template, but it seems that Blogger has become wiser and now it directly inserts the code at the appropriate place at the moment when the page is requested. So, the old trick now fails. How can we prevent Blogger.com from inserting that damn code? Simple, we don’t need it to do that.

In my technique I just hide the banner by placing a layer of my theme colour over it. Simple. If u too want to do that then copy the following code

<!-To make top bar disappear, exclusively by AppleGrew-> <div style=”position: absolute; width: 100%; height: 32px; z-index: 1; left: 0px; top: 0px; background-color: #CCDDBB” id=”layer1″> </div> <!-by Apple Grew->

and paste it between
<!– Begin wraps –>

and

<div id=”wrap”><div id=”wrap2″>

Please change CCDDBB to the HEX value of the colour u want. To know the HEX value of the colour u want, enter the RGB values of ur colour at this site at http://www.kenjikojima.com/java/RGBHexConverter2.html .

by Nirupam Biswas

Blogger troubleshootings, and tips and tricks.

Yesterday (night) I struggled to put some bits of code into my site and crank it up a bit. It was a real struggle, which took 4hrs! Well the blame is shared by both blogger.com and the very slooooowwww net. So, here u may find some workarounds to get over the nasty bugs in blogger.com; particularly when the help is not handy and the helpdesk is deserted. (I am still awaiting replies from the helpdesk. They r taking eternity). So, below r the problems I faced.

Prob1: In the template edit window when I click preview, all I get is a pile of codes and no webpage.
Cause: Look closely. Scroll to the bottom of the field showing the code in the template edit window. The code u see is incomplete.
Sol: I found that reloading that page always works. Now u should be able to see the full code. Hit preview and it is alright.

Prob2: Previously the Google ads window was single lined box. Now, as u see, it is multi-lined. U can change this from template edit section’s Adsnse page. But I had a problem. Blogger didn’t save the changes. It just gave me an error 113. This was the problem.
Cause: I don’t know. Ask blogger helpdesk and wait for eternity as me.
Sol: U need to edit the code manually. Frightened? Oh no, be brave. I did it all by myself, and the only thing I know about CSS and html things is that they r used to make web pages. I figured out what I need to do from the pattern in the code. For u the task is even easier, just follow me…

First locate the code for adsense. It should be near the top. Search for the word ‘adsense’ in the code. The code may look-like.

<div class=’adsense’ style=’text-align:center; padding: 0px 3px 0.5em 3px;’> <script type=”text/javascript”><!– google_ad_client=”ca-pub-3649938949418707″; google_ad_width=300; google_ad_height=250; google_ad_format=”300x250_as”; google_ad_type=”text_image”; google_color_border=”FFFFFF”; google_color_bg=”CCDDBB”; google_color_link=”333333″; google_color_url=”333333″; google_color_text=”FFFFFF”; //–></script> <script type=”text/javascript” src=”http://pagead2.googlesyndication.com/pagead/show_ads.js “> </script> </div>

Note the code
google_ad_format=”300x250_as”;

This is the place where u mention the ad format. As u can notice that the syntax of ad format is dimension_as. When I had the 234×60 format then the code was
google_ad_format=”234x60_as”;

U can know the ad dimension from the dimensions mentioned in parenthesis in the Adsense tab in Template Edit section. And don’t forget to set the heights and width of the ad window accordig to this dimesion. See codes
google_ad_width=300; google_ad_height=250;

Note the lack of quotes around the numbers 300 and 250. Also note the code
google_ad_type=”text_image”;

If u set the type to text then only text ads will appear. For the current setting, as u can see above; text or picture will appear. Other codes r self explanatory. They r to set colours of different things. If u don’t find any colour which u like, then this is the place to change them. First u should find out the RGB values of that colour. If u have that colour in some pictures on ur computer then use Paint (pre-installed in WindowsXP) or Photoshop or GIMP to find the RGB values, using their dropper or color pick tools. Then u must find the corresponding HEX (hexadecimal) code for them. U can do that at this site: http://www.kenjikojima.com/java/RGBHexConverter2.html . Now paste these characters replacing the original ones. Mind the quotes around them.

Prob3: Look at the side bar in the right. See the Google Search there? Well its background was blue before, now it has my theme’s colour. I used the method described just above. The problem here was that it used to show a long text like ” applegrew.blogspot.com” instead of the present “This blog”. Adsense doesn’t have anyway of coustomising the text to be shown. U need to do it manually. My motivation for doing this was to contain the search box within the side-bar. Previously due to the long text my search box used to stick its belly out of the side-bar. Now this trick slimmed it down. BTW, when I used to previwe my blog then even with the long text my search box remained within the side-bar, but when published, the search-box used to bully its way out of the side-bar.
Cause: I don’t know.
Sol: Have a look at the code below. U will be given a similar code from Adsense. <!– SiteSearch Google –> <form method=”get” action=” http://www.google.co.in/custom” target=”google_window”> <table border=”0″ bgcolor=”#CCDDBB”> <tr><td nowrap=”nowrap” valign=”top” align=”left” height=”32″> <br/> <input type=”hidden” name=”domains” value=”applegrew.blogspot.com“></input> <input type=”text” name=”q” size=”31″ maxlength=”255″ value=””></input> </td></tr> <tr> <td nowrap=”nowrap”> <table> <tr> <td> <input type=”radio” name=”sitesearch” value=”” checked=”checked”></input> <font size=”-1″ color=”black”>Web</font> </td> <td> <input type=”radio” name=”sitesearch” value=” applegrew.blogspot.com“></input> <font size=”-1″ color=”black”> applegrew.blogspot.com</font> </td> </tr> </table> <input type=”submit” name=”sa” value=”Google Search”></input> <input type=”hidden” name=”client” value=”pub-3649938949418707″></input> <input type=”hidden” name=”forid” value=”1″></input> <input type=”hidden” name=”channel” value=”8766575449″></input> <input type=”hidden” name=”ie” value=”ISO-8859-1″></input> <input type=”hidden” name=”oe” value=”ISO-8859-1″></input> <input type=”hidden” name=”safe” value=”active”></input> <input type=”hidden” name=”flav” value=”0000″></input> <input type=”hidden” name=”sig” value=”AqHpMLRK75FykyuG”></input> <input type=”hidden” name=”cof” value=”GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;
BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;
GFNT:0000FF;GIMP:0000FF;FORID:1;”></input> <input type=”hidden” name=”hl” value=”en”></input> </td></tr></table> </form> <!– SiteSearch Google –>

Here the thing of interest is the code portion
<td> <input type=”radio” name=”sitesearch” value=”applegrew.blogspot.com “></input>
<font size=”-1″ color=”black”>applegrew.blogspot.com</font>
</td>

U will just need to edit the portion
<font size=”-1″ color=”black”>applegrew.blogspot.com</font>

Change applegrew.blogspot.com to whatever text u may will. In my case I changed it to This blog. And yes obviously for ur blog u will have ur blog’s address written instead of applegrew.blogspot.com .

Prob4: This isn’t really a problem, but just a tip. As u can see in the side-bar I have my custom headings like ‘hit map’, ‘sponsors’, ‘site stats’, etc. This is relatively simple to do. Edit the code.
Sol: Just at the place where u want the heading to appear just insert the following code.
<h2 class=”sidebar-title”>Heading Here</h2>

But within the
<!– Begin #sidebar –> <div id=”sidebar”><div id=”sidebar2″> . . . </div></div> <!– End wraps –>
portion.

Change Heading Here to ur custom heading. Note as I am not a html coder or a CSS stylist, I am dont know if this will work for other templates (mine is 565 by Douglas Bowman); though I see no reason that it shouldn’t work for others.

———————————————
Precaution: Always copy, paste and save the code of ur template before making changes. U never know when u may mess things up. Also I am never the person to be blamed ever for anything wrong happens to ur blog because of following the above guidelines.