Full Blogging Tutorial and SEO Trick For Your Blog

Home » Archives for 2012

Christmas snowfalls with breeze for Blogger 2012

Posted by Unknown

Christmas is one of the largest festival celebrate all over the world. Christmas is the much awaited festival that knock the door of all Bloggers. And all are thinking about decorating their blog. How to decorate the blog with snowfalls and clouds ? Do you like to decorate your blog with beautiful snowflakes and clouds? Then here there is a article about how to add snowflakes with breeze to your blogger blog.

If your Blog has a dark interface then this widget serves better.The Snow flakes and the breeze are in white color so dark background will be better to get a good look.

If you want to get dark Christmas background ,set the following picture or search darker Christmas backgrounds.
Do you want to know how this work
Click below to view the demo

View Demo

Sign in to your Blogger Account
Go to Template > Edit HTML
Find ]]></b:skin> (Find using ctrl + F)
Copy the following CSS code above it [Alternate Way to copy css code]

/*-- Breeze for Snow flakes --*/
#mbl_snowflakes {
position: absolute;
height: 950px;
width: 966px;
overflow: hidden;

}
#snowContainer > div
{
position: absolute;
width: auto;
height: auto;
-webkit-animation-iteration-count: infinite, infinite;
-webkit-animation-direction: normal, normal;
-webkit-animation-timing-function: linear, ease-in;
}
#snowContainer > div > img {
position: absolute;
width: auto;
height: auto;
-webkit-animation-iteration-count: infinite;
-webkit-animation-direction: alternate;
-webkit-animation-timing-function: ease-in-out;
-webkit-transform-origin: 50% -100%;
}
@-webkit-keyframes fade
{
0% { opacity: 1; }
95% { opacity: 1; }
100% { opacity: 0; }
}

@-webkit-keyframes drop
{
0% { -webkit-transform: translate(0px, -50px); }
100% { -webkit-transform: translate(0px, 650px); }
}
@-webkit-keyframes clockwiseSpin
{
0% { -webkit-transform: rotate(-50deg); }
100% { -webkit-transform: rotate(50deg); }
}

@-webkit-keyframes counterclockwiseSpinAndFlip
{
0% { -webkit-transform: scale(-1, 1) rotate(50deg); }
100% { -webkit-transform: scale(-1, 1) rotate(-50deg); }
}

Search <body and copy the following below it

You are done... Save the Template

More about → Christmas snowfalls with breeze for Blogger 2012

Free Mobile Recharge using Amulyam,Embeepay,Way2sms,ULtoo

Posted by Unknown

free recharge amulyam airtel idea bsnl vodafone ultoo embeepay

Here i am going to say about free recharging sites in internet.Are you wasting money by making recharges,Then here is the time for changing that. There are many sites provides Free Recharge and many of that are fake and some them are good and we can trust.
One of the site is

Amulyam.in

Update [19-06-2013]: I noticed another site providing FREE Recharge its Laaptu. We can trust this site. It providing QUIZes, REFERALS for earning free recharge. A new feature Laaptu providing is it gives 2Rs. for each referal.
Update [8-1-2013]: I noticed that I couldn't get any recharge amount from Embeepay and mcent so I have removed it from the following list. The following sites are real and we can trust because I am earning free recharge from these sites.

There are many other sites for online recharge, some of them that i used are listed follows

Amulyam
ULtoo
Way2sms
Laaptu

Amulyam gains popularity in India in recent two years and very popular service among Indian mobile users. Amulyam has many ways to get talktime in our wallet. They provides emails of advertisers that sends to us and each opening of the mail will get .25ps in the wallet. They provide 2-3 advertisement mails every day. When the wallet reaches Rs.10 you can make recharge. Another way for increase the earnings in the wallet is to play and create contest or quiz. Playing contest will give .25ps and creating contests make you to earn high. Create a quiz with 10 questions will get you Rs.5. For Approved questions will get 50ps per question.
Another way is to purchase air tickets and buying things it will offer you Rs. 500 instantly. Also you can refer friends and make money. Each referral will get you Rs. 1.
Embeepay is a Facebook Application it provides points and when we sign up it gives 100 points. 30 points will give you 10Rs top up and 150 points will give you 50Rs Recharge.300 points will give you 100Rs
ULtoo provides free sms and get talktime to your account by sending sms.

Click here to get Rs.2 on your wallet instantly in amulyam

Click here to get 100points on Embeepay instantly

Click here to get Rs.2 on your wallet of ULtoo

Click here to get Rs.1 on your wallet of Way2sms

I hope this article will help you better.

More about → Free Mobile Recharge using Amulyam,Embeepay,Way2sms,ULtoo

How to Change comments style on Blogger?

Posted by Unknown

First of all i'm saying sorry to all for the delay of posting.
This is a tutorial about how to style your comments block with effective designs.
This is done using Simple css Scripts.
The demo of a styled comments block is as follows.

Click the link below to see demo
Demo page
What's inside this article?

Sign in to the Blogger Account
Select Template and click Edit HTML (Click on Proceed)
Find ]]></b:skin> (Find using ctrl + F) [Alternate Wayt to copy css code]
Copy any of the type of below css code just above it.
Click on Save

Comments Style version 1.0

.comments .comment .comment-actions a {
background: none repeat scroll 0 0 #FFD99E;
border: 2px solid #FFB43D;
border-radius: 3px 3px 3px 3px;
color: #000000;
font: bold 12px arial;
margin-right: 14px;
padding: 3px 9px;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;

}

.comments .comment-block {

background: none repeat scroll 0 0 #E2E2E2;
border: 4px solid #ABABAB;
border-radius: 3px 3px 3px 3px;
padding: 3px 10px;

}

.continue a {
background: none repeat scroll 0 0 #FFD99E;
border: 2px solid #FFB43D;
border-radius: 3px 3px 3px 3px;
color: #000000 !important;
display: inline-block !important;
margin-top: 7px;
padding: 3px 8px !important;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}
.comment-block:hover > .comment-header {
border-bottom: 2px solid #000;
-moz-transition: border-color .5s ease;

}

.comment-header a {

color: #000000 !important;

}

#comments .avatar-image-container img {
border: 2px solid #FFFFFF !important;
border-radius: 50px 50px 50px 50px;
height: 57px;
max-width: 57px;

}

.comments .avatar-image-container {
border: 2px solid #FFFFFF;
border-radius: 34px 34px 34px 34px;
box-shadow: 1px 1px 3px #ABABAB;
float: left;
margin-left: -40px;
max-height: 60px !important;
overflow: hidden;
width: 60px !important;
}

Comments Style version 2.0

.comments .comment-block {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6l27xpNVqixROGMH5W3r8VQ1K8lClwJ7jg3Qj7X8wLo8cDhxNJcAaV4ZhJPty17iH9ThLGpoCIRXyaHShQkETSvkWzDxIRrgKSKgqaqME7b2kLtTDJnasw3aVBaF1HGCMoma-C-t-Vm8/s1600/bg.png") repeat scroll 0 0 transparent;
border: 4px solid #EAEAEA;
border-radius: 3px 3px 3px 3px;
box-shadow: 3px 3px 0 #D6D6D6;
margin-left: 48px;
padding: 3px 10px;
position: relative;
}
#comments .avatar-image-container img {
border: 2px solid #FFFFFF !important;
border-radius: 50px 50px 50px 50px;
height: 57px;
max-width: 57px;
}
.comments .avatar-image-container {
border: 2px solid #FFFFFF;
border-radius: 34px 34px 34px 34px;
box-shadow: 1px 1px 3px #ABABAB;
float: left;
margin-left: -40px;
max-height: 60px !important;
overflow: hidden;
width: 60px !important;
}
.comment-header {
border-bottom: 2px solid #F1F1F1;
}
.comment-block:hover > .comment-header {
-moz-transition: border-color 0.5s ease 0s;
border-bottom: 2px solid #000000;
}
.comments .comment .comment-actions a {
background: -moz-linear-gradient(center top , #EEEEEE 0%, #CCCCCC 100%) repeat scroll 0 0 transparent;
border: 2px solid #E0E0E0;
border-radius: 3px 3px 3px 3px;
color: #000000;
font: bold 12px arial;
margin-right: 14px;
padding: 4px 11px !important;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}

More about → How to Change comments style on Blogger?

How to Make the Blogger Posts Have a Calendar for the Date in

Posted by Unknown

It's quite common to see calendar style dates next to some WordPress posts but for the Blogger platform it isn't always an very easy task to add this. But who said you can't do it? You need to look no further than this blog. In this tutorial, we'll learn how to create a calendar style date for your Blogger posts.

DEMO

How to create calendar style dates in Blogger

Step 1. Go to Settings > Language and Formatting - Date Header Format and change the date format as you can see in my example below (put day first, then the month and finally the year)

Step 2. Then go to Template > Edit HTML

Step 3. Select the "Expand Widget Templates" checkbox

Step 4. And search (CTRL + F) the following line:

<h2 class='date-header'><span><data:post.dateHeader/></span></h2>

Step 5. In case you find it twice, then you should replace it twice with this code:

<div id='Date'>
<script>changeDate('<data:post.dateHeader/>');</script>
</div>
<b:else/>
<div id='Date'>
<script>changeDate('');</script>
</div>

Step 6. Now search for this tag (CTRL + F to find it)

</head>

Step 7. And paste the code from below just ABOVE the </head> tag:

<script type='text/javascript'>
//<![CDATA[
var DateCalendar;
function changeDate(d){
if (d == "") {
d = DateCalendar;
}
var da = d.split(' ');
day = "<strong class='date_day'>"+da[0]+"</strong>";
month = "<strong class='date_month'>"+da[1].slice(0,3)+"</strong>";
year = "<strong class='date_year'>"+da[2]+"</strong>";
document.write(month+day+year);
DateCalendar = d;
}
//]]>
</script>
<b:if cond='data:blog.pageType != "static_page"'>
<style type='text/css'>
/* Calendar style date
----------------------------------------------- */
#Date {
background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8upN29wP_JxnM1LiGzp5E1FHUqU4XMrWEOtCNHIckLRi-bWC0hcb7BuRGopObciLhVZhJFRDDGCaFhGz1OYwNCQ6GIc8Rgku3Ctc4tztIWLNXhHviL1wW5LNgtPfaKe7CiYf5wy_UkfaQ/s1600/calendar07.png) no-repeat;
display: block;
width:60px;
height:60px;
float: left;
margin: 15px 2px 0 -108px;
padding: 0 0 8px 0px;
border: 0;
text-transform: uppercase;
}
.date_month {
display: block;
font-size: 15px;
font-weight:bold;
margin-top:-1px;
text-align:center;
color:#ffffff; /* Month's color */
}
.date_day {
display: block;
font-size: 28px;
font-weight:bold;
margin-top:-8px;
text-align:center;
color:#282828; /* Day's color */
}
.date_year {
display: block;
font-size: 10px;
margin-top:-8px;
text-align:center;
color:#282828; /* Year's color */
}
</style>
</b:if>

Before saving your Template, we can make some changes:

To change the calendar style, replace the url in blue with yours;
If the calendar doesn't appear correctly, change -108 with 0;
With green are marked the areas where you can change the color of the dates

Step 8. Now Preview your Template and if everything is ok, click on the Save button. Enjoy!

More about → How to Make the Blogger Posts Have a Calendar for the Date in

Protect all images in your Blog jquery trick

Posted by Unknown

Here is a most important trick every blogger need. This trick is about how to protect all your images in your blog with a transparent image covered on it. I recently posted an article about How to protect images? .This article about to protect all images.

Related Articles
How to protect images in your blog?
Do you want to see demo? Try to save picture in this blog.
----------------------------------------------------------
What's inside this article

Step 1: Add jQuery plugin (if your blog have a jquery plugin,ignore this step)

Go to Template->Edit HTML [A dialog box appears click Proceed]
Copy and paste the below code <head> and save it

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

Go to Blogger Account
Template->Edit HTML [Click Proceed]
Copy the code above </head>

Protect only First image in every Post

Protect all images in every post

I think you liked this article...please like and share..

More about → Protect all images in your Blog jquery trick

New Features and Tools in Bing Webmaster Tool

Posted by Unknown

With merger of Bing and Yahoo we lost very good link analysis tool (Yahoo! Site Explorer). Now with new look and user experience Bing has reintroduced that tool in its webmaster tool. Go and explore new tools under diagnostics & tools section of bing webmaster tool. Bing has introduced these new tools which are useful for any SEO:

Link Explorer (beta): Just like yahoo site explorer you can check backlinks of any website.

SEO Analyzer (beta): This tool generates SEO reports for websites which are verified by the account you are currently logged in with.

Fetch as Bingbot (beta): See your website as seen by the crawler of bing (Bingbot).

More information can be found at Bing Webmaster Community Blog

More about → New Features and Tools in Bing Webmaster Tool

How to Create Drop Caps (Big First Letters) in Blogger/Blogspot

Posted by Unknown

Here's another way you can customize your Blog. In this case, your Posts and Comment's first letter. The effect is a large first letter stretching down three or four lines with the text wrapped around. The drop cap letter can also use a different font and can be a different color to the rest of the text. You often see this style in newspapers, literature, magazines. In this tutorial i will show you how to apply automatically Magazine text style in Blogger Posts and Comments. So let's start adding it!

-> Add Drop Caps For Blogger Posts

-> Add Drop Caps For Blogger Comments

Big First Letter for your Blogger / Blogspot Posts

Step 1.

If you are using the old Blogger interface:

Go to Dashboard - Design - Edit HTML - Expand Widget Template (make a backup)

If you are using the new Blogger interface:

Go to Dashboard - Template - Edit HTML - Proceed - Expand Widget Template (make a backup)

Step 2. Search (CTRL + F) for this piece of code:

]]></b:skin>

Step 3. Just above it, add the following:

.capital:first-letter {
float: left;
display: block;
font-family: Times, serif, Georgia;
font-size: 40px;
color: #000000;
margin:0px 5px 0 0;
padding:0 0 0 10px;
}

Customize:

Color - change the color highlighted in blue with the value of your desired color
Size - to change the letter size, increase/decrease the value highlighted in pink.

Step 4. Now search for this code:

<data:post.body/>

Step 5. Then immediately before and after add the red fragments you see in the example below:

<div class='capital'><data:post.body/></div>

Step 6. Save your template.

Important! If the above code is not working, add one of following codes from this example:

<p class="capital"><data:post.body/></p>

<span class="capital"><data:post.body/></span>

Big First Letter For Blogger/Blogspot Comments

Step 1. Log in to your Blogger account, then go to Design (Layout) >> Edit HTML >> check the "Expand Widget Templates" box

Step 2. Search (CTRL + F) for this piece of code (if you have already added this code, skip step 2 & 3):

]]></b:skin>

Step 3. Add the following code just above ]]></b:skin>:

.capital:first-letter {
float: left;
display: block;
font-family: Times, serif, Georgia;
font-size: 40px;
color: #000000;
margin:0px 5px 0 0;
padding:0 0 0 10px;
}

<data:comment.body/>

Step 5. Add the red codes before and after <data:comment.body/> as you can see in my example below:

<p class="capital"><data:comment.body/></p>

Step 6. Save your Template.

That's it! Now you have a cool drop cap first letter on your blog.
If you have any question, leave a comment below!

More about → How to Create Drop Caps (Big First Letters) in Blogger/Blogspot

Protect your images Blogger image hack

Posted by Unknown

This is an awesome trick to protect your images.You can protect your images from copying with this Simple CSS Blogger Tricks.After applying this trick the person who save the image will get a transparent image instead of the original image.

Demo

Try to Save the below image

Protect your image Trick for all images (UPDATED VERSION)
What's inside this article
Protect your image Trick 1 -With overlap image
Protect your image Trick 2 -With span background image

Protect your image with CSS overlapping

Go to Blogger Account
Use the Following trick

You can use this code anywhere, if you want to protect an image in your post. Add image and switch to HTML tab and copy the URL of image(eg- http://3.bp.blogspot.com/-xxxxx/xxxxx/s1600/name-of-image.jpg) and paste to that code mentioned above.
That's it.

Protect your image with SPAN background

Use the following code

You are done..

If you liked this article please share and like....

More about → Protect your images Blogger image hack

Numbered comments on threaded comments for Blogger/Blogspot

Posted by Unknown

In a past tutorial, I've been talking about how you can add numbered comments to your blogger blog and today we'll learn how we can add numbered comments along with comment bubbles on the threaded comments as well.

What the following CSS trick will do for you:

When the general block of comments is initiating (.comments-content) a counter called countcomments activates and starts with an initial value of 1.
Then, each time the code flow goes through a review of any level, either a principal or a reply comment (.comment-thread li), content will bring us in front (:before) of the body of the comment, the number that is the counter at the time.
Then is incremented in one unit the counter (counter-increment).

See the screenshot:

count comments, comment bubble, forum, blogger

Isn't that great? Well, i'm pretty sure many of you have been waiting for this cool trick. So let's begin applying it for our threaded comments system.

Steps to add bubble comments count

Step 1: Go to Dashboard - Template - Edit HTML (click on Proceed if needed)

...Expand Widget Templates:

Step 2: Search (CTRL + F) for this piece of code:

]]></b:skin>

Step 3: Add the following code just above it:

.comment-thread ol {
counter-reset: countcomments;
}
.comment-thread li:before {
content: counter(countcomments,decimal);
counter-increment: countcomments;
float: right;
z-index: 2;
position:relative;
font-size: 22px;
color: #555555;
padding-left:10px;
padding-top:3px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZRyiAnwuYWP82j_CXUUpoybmkCEMGsSoqZGBCd63ntSr49K8K-a2SHx_IMtF85ZvllWNzKd3lClSESZm1g8W7EVuQpfAUF5G1xOHsPzjdNZmnFXAYqA9LkTrs4y60Xscp6ItV_cZoIHES/s1600/comment+bubble2.png) no-repeat;
margin-top:7px;
margin-left:10px;
width: 50px; /*image-width size*/
height: 48px; /*image-height size*/
}
.comment-thread ol ol {
counter-reset: contrebasse;
}
.comment-thread li li:before {
content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin);
counter-increment: contrebasse;
float: right;
font-size: 18px;
color: #666666;
}

Note:

for no bubble icon, remove the code in red (including the blue code)
to change the comment bubble, replace the code in blue with the URL address of your own icon. If you're not sure what icon you should use, you can find some cool icons in my previous posts (see these tutorials here and here)
to change the position of comments count, increase/decrease the values (3 & 10) from padding-top and padding-left
to change the position of comments bubble/icon, change the values (10 & 7) from margin-left and margin-top

Step 4: Now Save the Template and you're done!

If you enjoy reading this blog, please share and subscribe. For any questions, leave a comment below.

More about → Numbered comments on threaded comments for Blogger/Blogspot

How to add “Email Subscription Form” to Blogger Blogspot

Posted by Unknown

email subscription form, blogger blogspot, gadgets

When you are providing useful information in your blog, then many times some readers will need to get the latest updates from your blog. For that purpose, you need an Email Subscription Form in your blog, so that the interested visitors can easily get the latest updates.

To add email or Feed Subscription Form to your blogger blog (blogspot) is very easy.
Just follow the next steps:

1. Log in to Blogger, then go to Layout > click on "Add a Gadget" link:

2. From the pop-up window, scroll down and click on the "HTML/JavaScript" gadget:

3. Paste the following code inside the empty box:

<style>
.hl-email{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5KjUxZvyBZYotHczIddYtvFJ4UTNqvizkxdjJJPTrefERGoLt8FKVdd4lFp453ExHhTSGlOy-DVscvG1asNXiZol7hqUmZXpQfq4eYeo2-03_QMSw6T3xaF4EoGrhUtEWU-2OBVeA17k/s1600/mail.png) no-repeat 0px 12px ;
width:300px;
padding:10px 0 0 55px;
float:left;
font-size:1.4em;
font-weight:bold;
margin:0 0 10px 0;
color:#686B6C;
}
.hl-emailsubmit{
background:#9B9895;
cursor:pointer;
color:#fff;
border:none;
padding:3px;
text-shadow:0 -1px 1px rgba(0,0,0,0.25);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
font:12px sans-serif;
}
.hl-emailsubmit:hover{
background:#E98313;
}
.textarea{
padding:2px;
margin:6px 2px 6px 2px;
background:#f9f9f9;
border:1px solid #ccc;
resize:none;
box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
width:130px;
color:#666;}
</style>
<div class="hl-email">
Subscribe via Email <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=fe-blogger', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == "") {this.value = "Enter email address here";}" onfocus="if (this.value == "Enter email address here") {this.value = "";}" value="Enter email address here" type="text" />
<input type="hidden" value="fe-blogger" name="uri"/><input type="hidden" name="loc" value="en_US"/>
<input class="hl-emailsubmit" value="Submit" type="submit" />
</form>
</div>

Settings

Replace the url address in green to change the email icon
Increase/Decrease the 130 width value for a wider text area
Replace http://feedburner.google.com/fb/a/mailverify?uri=fe-blogger with your Feedburner Email Feed link. You can get it by visiting your feedburner account then navigate to Publicize and then to Email Subscriptions.
Replace fe-blogger with your feed title. It appears at the end of your feed link. In my case it is http://feedburner.google.com/fb/a/mailverify?uri=fe-blogger

4. Now Save your widget and check your blog. Enjoy!

More about → How to add “Email Subscription Form” to Blogger Blogspot

Awesome fe-blogger Subscription Widget for blogger

Posted by Unknown

This post is about how to add a Subscription Box like our NetOops blog. Subscription box contains Facebook, Twitter, RSS Feed, e-mail subscription. This widget is based on a wooden theme. Facebook, Twitter, RSS Feed links are shown as Natural Wooden Sticky Boards. In this tutorial i am adding a new e-mail subscription box with wooden theme.

Demo is in the Right of this Blog

What's inside this article??

Subscription box with Fully Wooden Theme

Go to Blogger Dashboard
Go to Layout
Select Add a Gadget
You can type title any
And Copy the following code in the content.

Demo of Fully Wooden Theme

Important: If you don't want Mouse over effect of Images in the Subscription box, please delete the RED highlighted code,. If you want then leave it there.

img.beintouch:hover {

background: none repeat scroll 0 0 #D6D6D6;

border-radius: 16px 16px 16px 16px;

box-shadow: 0 0 10px #565656;

}

/* Delete to Here*/
.emailtext {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdPM9VubZpVOmzkgFxhYwtUmlgPUoJ-ZJI7OPL73bexG_yd9rF8_0WYdM_bjZIeCgSimnxAKkJhmfNSTrASwh7tsjmetY-P-csXdo49uYCytrzORMJPIvYPBVUjgpgc6fcZ1j3gub85nU/s1600/mailbox.png") no-repeat scroll 4px center transparent;
    border: 1px solid #7E4E27;
    border-radius: 4px 4px 4px 4px;
    box-shadow: 1px 1px 4px #7E4E27 inset;
    color: #444444;
    font-weight: bold;
    margin-left: 2px;
    padding: 7px 15px 7px 35px;
    text-decoration: none;
    width: 176px;
}
.ebutton {
    background: -moz-linear-gradient(-45deg, #3C1F0E 0%, #D28A47 30%, #F9E183 30%, #D28A47 55%, #3C1F0E 100%) repeat scroll 0 0 transparent;
    border: 1px solid #D3D3D3;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    cursor: pointer;
    font-weight: bold;
    margin-left: -18px;
    margin-top: 5px;
    padding: 6px 15px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #000000;
}
</style>
<table align="center" width="317px" cellspacing="0px" cellpadding="1px"><tbody><tr><td><a target="_blank" rel="nofollow" href="http://www.facebook.com/pages/NetOops-Blog/159796530791611"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvDiVIRrm6TJL9n2aN42X6qjbGXHrkugSqAkrvdf0HxqLSDeyhGdqqf5X0P8DUHmvyGwDNHR_PPOpXqovv_n8IygFRthVYrhXVQRglaqLJRi04XdkUCAc9r5bBoH9-pzpufw6PPUX1lgY/s1600/woden+board+facebook_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://twitter.com/fe-blogger/" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsSqTKTWCiHGLruyXPTAbCBHoJRIXf90G8QEDk3hEK_gGMVwSlvSdibK57wAVYLq2-dBb0rRAexv9QITRA2kdb1aLWnEv6gIAosZvMFLJfTNoYXkl4qPml9GZTKabYCJyd4-8vjzNKPPw/s1600/woden+board+twitter_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://feeds.feedburner.com/fe-bloggergerTricks" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVKt5G5FaUPY1JcvOjMVa49kYZMl5Y7mgwIKxbJRkqToFvc4Wzfq_g52ITMAMFer2PA-i-POkVrzNWABj13C8MtHp3qKKsFt2gvl09xx2kVf3NtvhRhCAe-j-3JUrfY6mm-fDzC1m_-hE/s1600/woden+board+RSS1_netoops.png" class="beintouch" /></a><a href="http://fe-blogger.blogspot.com"></a></td></tr></tbody></table>
<div>Get Latest Tips via e-mail</div>
<form target="popupwindow" style="margin: 0pt;" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=fe-bloggergertricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="fe-bloggergerTricks" name="uri" />
<input type="hidden" value="en_US" name="loc" />
<input type="text" value="Enter your email..." onfocus="if (this.value == "Enter your email...") {this.value = ""}" onblur="if (this.value == "") {this.value = "Enter your email...";}" name="email" class="emailtext" />
<input type="submit" value="Subscribe" title="" class="ebutton" alt="" />
</form>

Change the BLUE highlighted code with FACEBOOK PAGE URL, TWTTER, FEED URL, FEED ID respectively.

Subscription box with Default Basic Wooden theme

Go to Layout
Select Add a Gadget

Important: If you don't want Mouse over effect of Images in the Subscription box, please delete the RED highlighted code,. If you want then leave it there.

img.beintouch:hover {

background: none repeat scroll 0 0 #D6D6D6;

border-radius: 16px 16px 16px 16px;

box-shadow: 0 0 10px #565656;

}

/* Delete to Here*/

.emailtext {

}

.ebutton {

}

</style>
<table align="center" width="317px" cellspacing="0px" cellpadding="1px"><tbody><tr><td><a target="_blank" rel="nofollow" href="http://www.facebook.com/pages/NetOops-Blog/159796530791611"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvDiVIRrm6TJL9n2aN42X6qjbGXHrkugSqAkrvdf0HxqLSDeyhGdqqf5X0P8DUHmvyGwDNHR_PPOpXqovv_n8IygFRthVYrhXVQRglaqLJRi04XdkUCAc9r5bBoH9-pzpufw6PPUX1lgY/s1600/woden+board+facebook_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://twitter.com/fe-blogger/" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsSqTKTWCiHGLruyXPTAbCBHoJRIXf90G8QEDk3hEK_gGMVwSlvSdibK57wAVYLq2-dBb0rRAexv9QITRA2kdb1aLWnEv6gIAosZvMFLJfTNoYXkl4qPml9GZTKabYCJyd4-8vjzNKPPw/s1600/woden+board+twitter_netoops.png" class="beintouch" /></a></td><td><a target="_blank" href="http://feeds.feedburner.com/fe-bloggergerTricks" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVKt5G5FaUPY1JcvOjMVa49kYZMl5Y7mgwIKxbJRkqToFvc4Wzfq_g52ITMAMFer2PA-i-POkVrzNWABj13C8MtHp3qKKsFt2gvl09xx2kVf3NtvhRhCAe-j-3JUrfY6mm-fDzC1m_-hE/s1600/woden+board+RSS1_netoops.png" class="beintouch" /></a><a href="http://fe-blogger.blogspot.com"></a></td></tr></tbody></table>
<div>Get Latest Tips via e-mail</div>
<form target="popupwindow" style="margin: 0pt;" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=fe-bloggergertricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">
<input type="hidden" value="fe-bloggergerTricks" name="uri" />
<input type="hidden" value="en_US" name="loc" />
<input type="text" value="Enter your email..." onfocus="if (this.value == "Enter your email...") {this.value = ""}" onblur="if (this.value == "") {this.value = "Enter your email...";}" name="email" class="emailtext" />
<input type="submit" value="Subscribe" title="" class="ebutton" alt="" />
</form>

Change the BLUE highlighted code with FACEBOOK PAGE URL, TWTTER, FEED URL, FEED ID respectively.

I think this widget helps you, Please share and like...

More about → Awesome fe-blogger Subscription Widget for blogger

Add Floating Social Media Sharing Buttons To Blogger

Posted by Unknown

The Floating Social Media Sharing is a very popular widget on all the top blogs, being a very good way to increase the number of times your posts get shared on Twitter, Facebook and other social networks. It has some of the following functions: Facebook Like, StumbleUpon, Twitter Share, Digg This, Google+ and RSS Feed Icon and each of them comes with a live counter. You can add more sharing buttons or social bookmarking icons later if you wish.

How to add the scrolling social bookmarking bar

Go to Layout
Click on Add A Gadget link
From the pop-up window, scroll down and select HTML/Javascript
Copy the code below and paste it inside the empty box.
Save the gadget.

The code to copy-paste (updated!):

<style type="text/css"> #pageshare {position:fixed; bottom:5%; margin-left:-721px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;} #pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;} .fb_share_count_top {width:48px !important;} .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;} .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;} .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;} </style> <div id='pageshare' title="Get this from Helpblogger.com">
<div style="margin-left:8px;"><div class='sbutton' id='like' style='margin: 5px 0 0 5px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:like layout='box_count' show_faces='false'></fb:like> </div></div>
<br /><div class='sbutton'><a class='twitter-share-button' data-count='vertical' data-via='fe-blogger' expr:data-counturl='data:blog.url' href='http://twitter.com/share' rel='nofollow'>Tweet</a><script src='http://platform.twitter.com/widgets.js'; type='text/javascript'></script>
<br /><div class='sbutton' id='su'> <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script> </div> <div class='sbutton' id='digg' style='margin-left:3px;width:48px'> <script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script> <a class="DiggThisButton DiggMedium"></a> </div> <div class='sbutton' id='gplusone'> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <g:plusone size="tall"></g:plusone></div><br/><a href='http://feeds.feedburner.com/fe-blogger' rel='nofollow' target='_blank' title='Subscribe To Our Rss Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3nTdcAzarRY6ueNI6RYp92BYQrUnqyYmIwj-i2pzBMl_1NnbYv24n_tHQcf5yoC-vQghLRDRsmUbPJWJhsjzcOqE7RZ8noRv1oWkb63tBM4X8ErwjOXpsu9pbeWTbujWHLJ4EXqFDBv6j/s1600/icon_rss_reader.png'/></a><div style="clear: both;font-size: 9px;text-align:center;">Get <a style="color: #3399BB;" href="http://fe-blogger.blogspot.com/">widget</a></div> </div> </div>

Customization:

Vertical alignment - Change the value of bottom in code line 3. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.
Horizontal alignment - Change the value in red of margin-left. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right. Increase or decrease the value based on your needs.
Twitter setting - Replace fe-blogger with your Twitter username
Replacing and removing buttons - You can replace existing buttons with your own. Each button is represented by this code: <div class='sbutton'> BUTTON CODE HERE </div>
RSS Feed - Change the text in blue with the url address of your RSS feed.

Enjoy :)

More about → Add Floating Social Media Sharing Buttons To Blogger

Create A Rollover Image Effect (change image on mouseover)

Posted by Unknown

The Rollover effect is one in which an image web object changes (swaps itself) on mouse over to another web object (called rollovers) and reverts back to the original image on mouse out. Rollover images are preloaded into the page when it is loading, this ensures that the rollovers are displayed quickly. The onMouseOver and onMouseOut attributes of the link tag are used to make this functional.

Demo: Place your mouse over the image below to see its rollover effect

Making Rollover Effect Image

You have the following code:

<a href="URL ADDRESS"><img src="URL OF THE FIRST IMAGE GOES HERE" onmouseover="this.src='URL OF THE SECOND IMAGE GOES HERE'" onmouseout="this.src='URL OF THE FIRST IMAGE GOES HERE'" /></a>

Change the colored texts as it follows:

1. URL ADDRESS

This is the address where somebody will be sent when clicks on the image.
Example, my blog address: http://www.fe-blogger.blogspot.com

2. URL OF THE FIRST IMAGE GOES HERE

Replace the orange text (two times) with the URL address of the image which will appear before you hover over it.

3. URL OF THE SECOND IMAGE GOES HERE
Replace the text in blue with the url of the image that will appear when the cursor hovers over it.

Now you can paste your image inside a blog gadget, going to Layout > click on Add a Gadget link (right side) > Select HTML/JavaScript from the pop-up window, then add it to your sidebar.

You can also add it inside your post by going to New Post > Switch to HTML tab and then paste the code in the empty box.

That's it. Enjoy ;)

More about → Create A Rollover Image Effect (change image on mouseover)

How to Backup/Restore template in new blogger interface?

Posted by Unknown

Backup restore new Blogger Template easily

Here i'm saying about an important topic that i had posted early " How to Backup/Restore Blogger Template? ". But i'm going to show you How to Backup/Restore Blogger Template in New Blogger Template . Now a days Blogger default interface is Upgraded New Blogger Interface. Backup/Restore Template is so important,So don't take this as a silly matter.
Read Following see How to backup template in New Blogger Interface..

CHECKOUT OTHER SIMILAR POSTS

How to Backup/Restore Old Blogger Interface

How to Backup/Restore Template

Go to Blogger Account
Select Template [as shown in fig.]

Click on the Button Backup/Restore in Left top .

A box appears [as shown in fig.]

As shown in the above fig.
Click on Download Full Template to download Template.Save it
Click on the Browse to Restore the early downloaded Template.
That's all ..Enjoy with us...

Check out other Blogger Tricks HERE and Blogger jquery Widget Generators HERE

More about → How to Backup/Restore template in new blogger interface?

Optimize your post title to H1 tags better SEO Blogger Hack

Posted by Unknown

This is an important SEO Blogger trick to increase SEO. Heading tags have a great importance in Search engine results, Heading tags helps Search engines to recognize what is important in your blog.Heading are form H1 to H6 .H1 tags have higher priority.So we are going to hack blogger template by changing H3 tags to H1 tags. By default blogger post title is in H3 tag,here is a trick to change it to H1 tag for more SEO.

Go to Blogger Account
Select Template -> Edit HTML [click Proceed]
Find the code like below [Find easily using Crtl+F]
Or simply find <H3

and Change it with <H1 [Change all H3 to H1]
Change all H3 tags with H1 tag
Done ..Wait for few weeks you can find the change in Google SERP.
Your Blog pages will show in Google Search Page.

Update [21.11.2012] : I have noticed that this trick displays error in some webmaster like Bing. If you get error message from the webmaster then change the H1 tags which we changed before to H2.
Note: Only change the H1 tags you changed earlier.
Google Webmaster will not show error on this trick.

I think you enjoyed this ..if so please share...

More about → Optimize your post title to H1 tags better SEO Blogger Hack

Protect Your Blog posts from Copying Blogger Trick

Posted by Unknown

Copying blog posts or articles from sites/blogs on internet is a usual thing.Here i am going to share you how to protect your blogger posts/articles form getting Stolen.This is a trick to lock your text and the visitors of your blog can't select the text only they can read the text. If they cracked that method and select the text there is another trick to disable right click menu,so they can't copy text.. Enjoy...

To view Demo click the link below:- Open this link and try to select text..Or do a right click..

View Demo

Copy the Following CSS codes to your Blog

Go to Blogger Dashboard
Select Template->Edit HTML click Proceed [or Use Alternate Way to copy CSS code]
Find ]]></b:skin>
Copy the following code and save

-moz-user-select:none;
-webkit-user-select:none;
-khtml-user-select:none;
-ms-user-select:none;
user-select:none;

Disable Right Click

Copy the following code inside <head>

I think this article will surely help you...if you liked this please share...

More about → Protect Your Blog posts from Copying Blogger Trick

HTML Character Count SEO Tool for Blogger

Posted by Unknown

HTML Character count Tool is a popular tool to count characters that is used for SEO.You can count characters in the following Tool.Character count is mainly used to count Blogger post title characters. In Google SERP(Search Engine Result Page), Google shows 61characters of title of blog post.So keep Blog Title less than or equal to 61 characters. Manual counting of characters in title with white spaces is, i think it is bit difficult So use this tool to count..

I hope you are enjoyed with this article please share it...
Thanks...

More about → HTML Character Count SEO Tool for Blogger

15+ Smooth Jquery Scroll to Top widget generator for Blogger v.1

Posted by Unknown

jquery scroll to top widget generator blogger

Jquery scrolling to top buttons help visitors to jump to top of page with smooth automatic scrolling.So the user/visitor of your blog can go to top of page with a single click.This smooth jquery scrolling makes your blog impressive.
I created a Blogger widget generator for ease of use.Create your favorite scroll to top Button with a single click.

To view demo look at right-bottom of this blog or Click on the following link

View Demo

I think you liked this generator,Check out our other awesome widget generators here.
Don't forget to say thanks at least for appreciating us.. Also expect more form us.. thanks..

I found that some sites copy our code,a notice for those Blog owners: please at-least say thanks or provide our blog link within your post. Thanks

More about → 15+ Smooth Jquery Scroll to Top widget generator for Blogger v.1

Add Facemoods Emoticons To Your Blogger Comments

Posted by Unknown

Here are some amazingly funny emoticons compatible with your Blogger comments - also with threaded commenting system! If you want to know how to add them, just follow the next steps:

DEMO

Step 1.

Go to Dashboard - Template - Edit HTML - Proceed

...and select Expand Widget Template (don't forget to make a backup)

Step 2. Search (using CTRL + F) for this code:

For previous commenting system:

<h4 id='comment-post-message'><data:postCommentMsg/></h4>

For threaded comments:

<div class='post-footer-line post-footer-line-3'>

Step 3. Add the below code just above it

(for threaded comments, add the code after):

<b:if cond='data:blog.pageType == "item"'>
<div style=' width: 450px; text-align: left; border: 1px dashed #0084ce; background: transparent; padding: 10px; color:#000000; font-weight:bold; '>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGoD-ANA9wIwb-7NG7PTpHwMILwi5n1RD4codZ_L_7l7hugQtEDUGJTh8prkEcx2B22FXrcpt4W60WV1inn6D2LV_Wi74dOzo8XDB0vDEakkdgF8RLuXXODmSR_WColvn8YBjCEUW_-b35/s1600/fe-blogger.blogspot.com(1).gif'/> :a
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmqw9b2Akf2HGdIS7ccZXLNIl-Kxa1X5CNpa58DQ7vfhz4WNts5Z1DMvSm8JhbAGEeBA3PBAvT7uAjeiCTNfV209WqhD07cErGy3X1VOBOKApluoz9-NVq_1ngiodvZBR2d5bXJQvuL84c/s1600/fe-blogger.blogspot.com+(2).gif'/> :b
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHQ1ZJjDclbTpkN6H12G7Xf1ZYCTbxNcXhF0UoUrOzBd9wBwrfkltjWhx9t_17t3iwTmcaPxWSSQo0Jn4yi2jEghcWvrX2GFmTMm-kgI-440RxKGditN-Xxb5cI7sxKeFlAHKE0LqEosbZ/s1600/fe-blogger.blogspot.com(3).gif'/> :c
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHMlYagHeazTQPpahzcCkDKEB2u1F8tlGdD2Zwn7saSHO7kvZmB6Bmq0DIMcOuRJD0soOetMl8TCRnXvF1IM3b_4MRZKZOeH6Nxz9t3dVUIiLEaP7G-0Yf-q0_OEyB3ThS0ufawp6swR1I/s1600/fe-blogger.blogspot.com(4).gif'/> :d
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGNDeSl0mgwOdIahjOK0KVYSyViIYqdyg1tyo9U9cAPGE75G3q13aM_2swwtEYnwEAXy61jWeezhxz4AuIvPQ2QiP9q6amVrpsBrVyqtapanvRgZJ7n1k9tylupEyi3ncwFiwih0TpjhAN/s1600/fe-blogger.blogspot.com(5).gif'/> :e
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4rgS70JIeVdH72XmdB-DMD0gVqMBN0Ck_olh92NXsPTCy3evorlCShfVDGon_abyCAEQRQSuf1PykTIXksOhbdK5rLzeTEXH5WVUIlfvQ3p0S_fBhLODoyKUwdDCPHeG2m63c-e6Bjyry/s1600/fe-blogger.blogspot.com(6).gif'/> :f
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGRolLr9Os2ucUfRfnm6Iszvg38RuD2y7tj2RpVDFRJlJAnp5MpqNIuHVXeq6Tb97Fqwb1QCT4y-MAJPCsdzDXo2gb2NIWm7pg0vTuTkZ5zMT8OgxoB3Ea9Og3PUApe4cdtQJZckiFRnu7/s1600/fe-blogger.blogspot.com(7).gif'/> :g
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpwVoL6kCwmM0PJZcQYjjxdjknp2iIlFETjAERgUkIdvyiw6ZIiJa98V8ATkoxgX_2BGard3SpenINwYX0tKIyXhhfP08gtlYAYYBRRYrCUXDZScSjUIFB9QJa8NdWfr-tKb3YbQ2b3CsL/s1600/fe-blogger.blogspot.com(8).gif'/> :h
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiubzUbcUTv4JkFW-kzf7UEgD0-Wg-Uc3Ibw64Ae-vXlkqL0gFwlb1ymq0ULevCqgBnWSD_FLf260S4i-31GUEumwMu6tN9vXRwJYRG5YvkFXWSgs72yFnik7SXQTyYRpFUL2V4wGSNRO7B/s1600/fe-blogger.blogspot.com(9).gif'/> :i
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfiSdB0rYqCnu9z605qgCM24FfqKyVxmgOzkQPre8wYj_l_HsLy6qzIdAeHwYuXsOTAuHIiCLqQmiqxAao90oaaUOUQT2Iq4rgCPqAqO3oNLCVUxm2UjD7qWny-EnCVvra-TxHKYFStQPc/s1600/fe-blogger.blogspot.com(10).gif'/> :j
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkuTvg0use8hL0k-t9Lko_vMS9H9HbccxMgeRxA0WzB8XKy4Zl694dGi9s3aGfJurt7DeMFZuiq6hCiDJf23jonFeJf46J7_18y-LvrJPB1vne_R6-WX8vEAH-v1HxVUJEC3f1MuIBitVd/s1600/fe-blogger.blogspot.com(11).gif'/> :k
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTFhs5jUptqEcfZQdbl-NAeG7F90sMK-pGLgmRi7CgBgaYPUMnf1XwLujhMCNc6v8-cel4PLQJpq8-a4sr7QdBTqVpBYDcrK2RXJ_5ekn0Iovqi_jGw2fEAogQMM3IF9UorTN2Btk5RZ-1/s1600/fe-blogger.blogspot.com(12).gif'/> :l
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhy91EU8iMRDCLJ_2eFRNBoaZhfImjRe6v69G4mhpeUTx0hzlRMYAOfzqQUQUzQqxV1229efFFqAXvtPTR5pWuegGZZ14N3qzs6eiOpid2PpCNJEGvYuAZ5aDaoVBQU28DfTaWS4BtX_j5I/s1600/fe-blogger.blogspot.com(13).gif'/> :m
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmJcCqD4SC7-8QPrItrfGGXIqfgkLyHeg8juyHRjiaXOLfsvInoJrZCChJwrDlrItKoY13kLklXyUWb7OOVq3B3wxRnvWAVxNkF6Xjz57Wxh-aLmJZHrric5pTNPbLswFnLCgko1tVqDD_/s1600/fe-blogger.blogspot.com(15).gif'/> :n
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxq3DBB9EAMlE9qjN9F13jd3zcGqlA29zmHZG9Bv8ROtOchncs323vXfoVu0tA2bw21ojE8y9F2GKzi4XpfKlXUYpLXOfkiUOt9hfLgEnmYYO0HCjTWHnvJatRnOzBrsIII1ocncL_bUeQ/s1600/fe-blogger.blogspot.com(16).gif'/> :o
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjP5d0-jWsob1tf-NXPEwKELSEpCaHuv4wYXGvUbab3Zok8guYuHXreg1txhswMgTVdpZI01Wlvo5O6sHO3u560gGSWwBlS7KAw1haiNo8lvfT67KmK4VfdlPnqmyLVXt17hJ15fnFEXHKH/s1600/fe-blogger.blogspot.com(14).gif'/> :p
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg424HwV59aSlsDD16bA1MIA-HsdiLdE7asWkMI4KgrrrAbSTjjDrqz8OQOdTxIoic97vwGnbZGTPbdDbSB5Y7WpKoXsVOG1oq2EtiqdxecGaFNJZotWl-tANKvFuZNfSz_OhL2FaviMBBg/s1600/fe-blogger.blogspot.com(17).gif'/> :q
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9m0ksj-ned5it2JRRakjzMjwC2b4LVhSPbOFxa00aePymHJNPI9Zk0O3hRtirH8oJwXsy_fvDPoOxQLgMFIkV6kUmgevspG7RtrW7XDX45aDrVfVZ6RhZ03ByGAfnLYeWXzeqwIxSeG2E/s1600/fe-blogger.blogspot.com(18).gif'/> :r
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghuBBAIcA6z4p-swdYES-T-IrO1w3gXd_Ed87uoEk9wWtbMNdJZJs7BceGjBe-Z1R2a8nS6UXSiPLW066BwRiz4OH-B50stJZCMnqQncQVmu4Z4iiEe20FSNyLQYnLx-iiAUB78hug8PPY/s1600/fe-blogger.blogspot.com(19).gif'/> :s
 
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzhA-yCMuWybOrwR4mikKpDbLsacTbkFbdim8R6AqU6CU9E5-TX5c1wkzs9Y6GN9N4p9yX9e1rB6VxPBbkWvNnbCjHIj9KsbHTyViPpu-_2bDgBMYFsSflyyXtbsqFExtXeweo0faNvGzk/s1600/fe-blogger.blogspot.com(20).gif'/> :t <a href='http://fe-blogger.blogspot.com/2012/05/add-facemoods-emoticons-to-your-blogger.html' style='color: rgb(30, 122, 183); font-size: x-small;'>Add smileys to Blogger + </a>
</div></b:if>

Step 4. Now search for this piece of code:

</body>

Step 5. And add the following code immediately above it:

For previous commenting system:

<script type='text/javascript' src="http://fe-blogger.googlecode.com/svn/trunk/facemood emoticons.js"/>

For threaded comments:

<script type='text/javascript' src="http://fe-blogger.googlecode.com/svn/trunk/facemood emoticons threaded.js"/>

Step 6. Save the Template. Now, enjoy your comments!

More about → Add Facemoods Emoticons To Your Blogger Comments

Pages

Christmas snowfalls with breeze for Blogger 2012

Free Mobile Recharge using Amulyam,Embeepay,Way2sms,ULtoo

How to Change comments style on Blogger?

Comments Style version 1.0

Comments Style version 2.0

How to Make the Blogger Posts Have a Calendar for the Date in

Protect all images in your Blog jquery trick

Protect only First image in every Post

Protect all images in every post

New Features and Tools in Bing Webmaster Tool

How to Create Drop Caps (Big First Letters) in Blogger/Blogspot

Protect your images Blogger image hack

Protect your image with CSS overlapping

Protect your image with SPAN background

Numbered comments on threaded comments for Blogger/Blogspot

How to add “Email Subscription Form” to Blogger Blogspot

Awesome fe-blogger Subscription Widget for blogger

Subscription box with Fully Wooden Theme

Subscription box with Default Basic Wooden theme

Add Floating Social Media Sharing Buttons To Blogger

How to add the scrolling social bookmarking bar

Create A Rollover Image Effect (change image on mouseover)

How to Backup/Restore template in new blogger interface?

How to Backup/Restore Template

Check out other Blogger Tricks HERE and Blogger jquery Widget Generators HERE

Optimize your post title to H1 tags better SEO Blogger Hack

Update [21.11.2012] : I have noticed that this trick displays error in some webmaster like Bing. If you get error message from the webmaster then change the H1 tags which we changed before to H2.
Note: Only change the H1 tags you changed earlier.
Google Webmaster will not show error on this trick.

Protect Your Blog posts from Copying Blogger Trick

Copy the Following CSS codes to your Blog

Disable Right Click

HTML Character Count SEO Tool for Blogger

15+ Smooth Jquery Scroll to Top widget generator for Blogger v.1

I found that some sites copy our code,a notice for those Blog owners: please at-least say thanks or provide our blog link within your post. Thanks

Add Facemoods Emoticons To Your Blogger Comments

Translate

Total Pageviews

Popular Posts

Labels

Blog Archive

Pages

Comments Style version 1.0

Comments Style version 2.0

Protect only First image in every Post

Protect all images in every post

Protect your image with CSS overlapping

Protect your image with SPAN background

Subscription box with Fully Wooden Theme

Subscription box with Default Basic Wooden theme

How to add the scrolling social bookmarking bar

How to Backup/Restore Template

Check out other Blogger Tricks HERE and Blogger jquery Widget Generators HERE

Update [21.11.2012] : I have noticed that this trick displays error in some webmaster like Bing. If you get error message from the webmaster then change the H1 tags which we changed before to H2.Note: Only change the H1 tags you changed earlier.Google Webmaster will not show error on this trick.

Copy the Following CSS codes to your Blog

Disable Right Click

I found that some sites copy our code,a notice for those Blog owners: please at-least say thanks or provide our blog link within your post. Thanks

Translate

Total Pageviews

Popular Posts

Labels

Blog Archive

Update [21.11.2012] : I have noticed that this trick displays error in some webmaster like Bing. If you get error message from the webmaster then change the H1 tags which we changed before to H2.
Note: Only change the H1 tags you changed earlier.
Google Webmaster will not show error on this trick.