How to Add 'Print Page' option to blogger(blogSpot) blogs

1.Login to your dashboard--> layout- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see </head> tag.

4.Now copy below code and paste it before </head> tag.

<style type="text/css" media="print">
#noprint {display: none;}
// Hide unwanted elements
body {background:fff; color:000;}
// Black text on White background
a {text-decoration: underline; color:00f;}
//Underline Hyperlinks in blue
}
</style>

5.Now again scroll down to where you see this :

<p><data:post.body/></p>

6.Now copy below code and paste it after <p><data:post.body/></p> .

<a href="javascript:window.print()">Print Page</a>

7.Now save your template and you are done.

READ MORE - How to Add 'Print Page' option to blogger(blogSpot) blogs

How to Post HTML,CSS,JavaScript,... Codes As Plain Text In Blogger

1.First install Greasemonkey script for your Firefox browser.





2.Now click here to install 'Blogger - HTML encode on post edit' to blogger.



This adds a new button at the bottom of your new post area.It encodes the selected text so it can be posted as plain text in Blogger.It will look like this.



When you want to encode some code select it and cick on 'HTML ENCODE SELECTION' button.



Your code will look like this after being encoded:



Now publish your post and see the result.

READ MORE - How to Post HTML,CSS,JavaScript,... Codes As Plain Text In Blogger

How To Add You Tube embed code tool to blogger

This tools is very important to every blogger.When you put the video address and click Ok, embed code will appears in text box.

1.Log in to your dashboard--> layout- -> Page elements

2.Click on "Add a Gadget"

3.Select 'HTML/Javascript' and add the code given below and click save.

<script>function go(){var x=document.theform.url.value;var YT=(function(){return {getId:function(u){var a=u.match(/(\/vi\/|v=)([^&]+)/);return (a&&a[a.length-1]);}};})();document.theform.thelink.value=('<object width="'+document.theform.width.value+'" height="'+document.theform.height.value+'"><param value="http://www.youtube.com/v/'+YT.getId(document.theform.url.value)+'&searchbar=0&iv_load_policy=3&ap=%2526fmt%3D18" name="movie"></param><param value="true" name="allowFullScreen"></param><param value="always" name="allowscriptaccess"></param><embed allowscriptaccess="always" width="'+document.theform.width.value+'" src="http://www.youtube.com/v/'+YT.getId(document.theform.url.value)+'&searchbar=0&iv_load_policy=3&ap=%2526fmt%3D18" allowfullscreen="true" height="'+document.theform.height.value+'" type="application/x-shockwave-flash"></embed></object>');}</script><form action="#" name="theform" onsubmit="return go();"><input onfocus="this.value='';this.style.color='#72a8d2'" style="font-size:110%;color:#aaa" value="" name="url" size="50" type="text"/> <input style="font-size:110%;" value="Ok" onclick="javascript:go();document.theform.thelink.select()" type="button"/><br/>Width: <input onfocus="this.value='';this.style.color='#db0000'" style="color:#444;" value="660" name="width" size="3" type="text"/> &nbsp; Height: <input onfocus="this.value='';this.style.color='#db0000'" style="color:#444;" value="544" name="height" size="3" type="text"/><br/><div class="code-block-corner"></div><br/><div class="code-block"><div class="code"><br/><div style="background:#f3f6f7;padding:5px;"><textarea style="width:80%;height:100px;overflow:hidden" name="thelink"></textarea><br/><div style="text-align:center;color:#000;font-style:italic;font-size:130%;"></div></div></div></div></form>

Now you are done.Look at the picture below.

I found this tip from this site.

READ MORE - How To Add You Tube embed code tool to blogger

How To Compress CSS for Better Page Loading time

1.Log in to your blogger dashboard and go to--> layout- -> Edit HTML

2.Now Cut CSS Code of your template.

NOTE : CSS Code is the code between the <b:skin> and </b:skin> tags.

3.Now go to cssdrive.com

4.Paste your CSS Code into the box.



5.Select ,
(a).Compression mode:- Normal

(b).Comments handling:- Select Don't strip any comments.



6.Now click on "Compress-it!".

7.After compressing your css code you can see like this message.



8.Now copy your Compressed CSS Code and paste it between <b:skin> and </b:skin> tags.

9.Now save your template and you are done.

READ MORE - How To Compress CSS for Better Page Loading time

How To Add Adsense Parser to blogger

You must generate Parsed code for your adsense code because you cannot put adsense code directly in the xml.So parse it using Adsense Parser tools.This tool help your visitors to parse their adsense code.I found this tips from here .


Parsed code will look like this :



1.Login to your dashboard--> layout- ->Page Elements

2.Click on 'Add a Gadget'.

3.Select 'HTML/Javascript' and add the code given below and click save.

<iframe src ="http://tools.bloggerplugins.org/parser.php"width="100%" style="border: none" height="300"</iframe>

It will look like this.



Now you are done.

READ MORE - How To Add Adsense Parser to blogger

How To Add Word/character counter

This tool will be very useful to your visitors.It is provided by http://centricle.com.



1.Login to your blogger dashboard--> layout- ->Page Elements

2.Click on 'Add a Gadget' .

3.Select 'HTML/Javascript' and add below code and click save.

<form action="http://centricle.com/tools/word+character-counter/" method="post" target="blank"> <fieldset> <label for="pad">String:</label> <textarea cols="60" rows="15" name="pad" id="pad"></textarea> <input class="submit" type="submit" name="countem" value="How many?" /> </fieldset> </form>

Now you are done.

String:

READ MORE - How To Add Word/character counter

How To Add Encode/decode HTML entities

This tool will be very useful to your visitors.It is provided by http://centricle.com .This tool generate Parsed codes for adsense codes(not only adsense-chitika,bidvertiser,....) because we cannot put adsense code directly in the xml.



1.Login to your blogger dashboard--> layout- ->Page Elements

2.Click on 'Add a Gadget' .

3.Select 'HTML/Javascript' and add below code and click save.

<form action="http://centricle.com/tools/html-entities/" method="post" target="blank"> <fieldset> <input value="y" name="s" type="hidden"/> <label for="pad">Convert text to HTML entities (and vice-versa):</label> <textarea id="pad" rows="15" cols="60" name="pad"></textarea> <input value="Encode" name="submit" type="submit"/> <input value="Decode" name="submit" type="submit"/> </fieldset> </form>

Now you are done.

Convert text to HTML entities (and vice-versa):

READ MORE - How To Add Encode/decode HTML entities

Useful Widgets,Add-Ons & Tools for Your Blog,Website

Adding Widgets, Add-Ons & tools to your blog You can improve performance of your website.

Here's a collection of best and most useful blog widgets or add-ons that can be easily integrated with any website/blog. All these below add-ons are 100% Free.

Outbrain Star Ratings Widget:




ShareThis or AddThis :

whos.amung.us :




Web2PDF Online :




ZOHO Creator:




Google Talk Badge:



Yahoo Media Player:




Cbox:




Google Translate:

READ MORE - Useful Widgets,Add-Ons & Tools for Your Blog,Website

How To Show HTML TEXT in Blogger Posts

As many visitors ask how to embed html text in a way that it is displayed as it is in the published post and also their visitors can copy the content, so here's a way to do that quite easily:

The main problem that bloggers face is that, typing/pasting the html code in either Edit html or Compose sections during posting a blog entry is that, after publishing they dont find the code, rather the code lines are simply missing from their original place.

The reason for this to occur is that if you try to type the HTML as it is (example
), the web browser will interpret that as an instruction to display what follows in a new line (line break) but not display the HTML.

What you can do is:

change the "<" symbol with &lt; , and also the symbol ">" with &gt; , but as to do all this manually is quite difficult, so you can use this website tool for simply converting the html code into embeddable text:

Now you can copy this embeddable text to your blog post.

READ MORE - How To Show HTML TEXT in Blogger Posts

Useful Widgets,Add-Ons & Tools for Your Blog,Website

Adding Widgets, Add-Ons & tools to your blog is not just a lot of fun for your blog readers, but can also be very useful and help you to create a community for your blog or even a loyal reader base.

Here's a collection of best and most useful blog widgets or add-ons that can be easily integrated with any website/blog. All these below add-ons are 100% Free and they are very easy to install.

Outbrain Star Ratings Widget: Very eager to know what your readers think about your posts?
Here is a cool star rating widget by Outbrain. The insttallation is very simple,
just follow the step by step instructions on their site.

ShareThis or AddThis : Sharethis or Addthis social bookmarking buttons makes it easy for your visitors to share your content with others. It is a good way to increase your link popularity and publicity. Their nice css dropdown icons reduces the clutter on your pages and eliminates the need to add a different button for each social bookmarking service.

whos.amung.us : This is a real time visitor tracking widget and displays
the number of people currently on your site and what pages they are
reading. You don't need any sign-up's to grab this widget.

Web2PDF Online : With this widget installed, your visitors can easily download
your articles in PDF format with just a click. The downloaded PDF's are
free of any advertising and you can get full access to download stats,etc.

ZOHO Creator: With Zoho Creator, you can create professional online
contact forms/web forums in minutes. The good things about this is
there are no data limits and readers can also upload attachments while
submitting the form.

Google Talk Badge: Google Talk Badge will let your visitors to
chat with you.The badge will active whenever you sign in to
Googletalk. The nice thing is your visitors can chat with you even
if they don't have a google account.

Yahoo Media Player: With this very useful widget, you can easily add a simple media player to your blog which can auto detect mp3 links and create an embedded player. This tool is very useful for especially audio,music blogs.


Cbox: Cbox or Chatbox is a chat widget which can be easily embedded
in any web page. It is free and have many features including message
history, spam blocking,etc. It can be easily customizable to fit your
blog layout.

Google Translate: This widget lets your non-English speaking
visitors to quickly translate your webpage in their native
language with just a single click.

READ MORE - Useful Widgets,Add-Ons & Tools for Your Blog,Website