New Google style blogger Template for Free

Google recently changed the style of the Google page, which gave a new look to it. On seeing its simple and cool layout i started designing this template.
This template is designed user friendly. You no need to host any images since its already done. All you have to do is.

• Download the file and extract it.
• Goto Blogger Dashboard and select your blog to which you are willing to apply this template.
• Click on Design, then on Edit HTML
• There in 'Upload a template from a file on your hard drive:' Browse the downloaded xml file and upload it.
• You are done.

To change the links of Home, About, Services and so on. which is in top Navigation
Find the code

<li><a href='#'>Home</a></li>
<li><a href='#'>About Us</a></li>
<li><a href='#'>Services</a></li>
<li><a href='#'>Products</a></li>
<li><a href='#'>Contact</a></li>

and modify it as per your requirement.
Now again search for

<li class='home'><a href='http://www.techirsh.tk'>Home</a></li>
<li class='about'><a href='http://www.techirsh.tk'>About</a></li>
<li class='contact'><a href='http://www.techirsh.tk'>Contact</a></li>
<li class='fb'><a href='http://facebook.com/techirsh'>Facebook</a></li>
<li class='twitter'><a href='http://www.twitter.com/ishuspace'>Follow on twitter</a></li>

and modify as per your wish.

Preview Template | Download Template

Changing Favicon of blogger blogs made easy by Blogger in Draft

 For adding favicon in blogger blogs, earlier we have to use scripts with our own hosting for ico files. Blogger in Draft included option in Design area in Dashboard of blogger. All you have to do is create an .ico file, if you feel difficulty in creating .ico file. You can convert image file to .ico file from the site www.iconj.com.

 

Once you have converted the image file to ico file. Download it to your computer.
Now goto http://draft.blogger.com click on the link Design of your blog to which you want to add the favicon.
Click on Edit in Favicon which is on top left corner of design area.

Once you click on the Edit link, popup window will be open. There select the downloaded .ico file using browse/chose file option. Then click on Save

Now you are done.
In Blogger in Draft's it is also mentioned that later more supported files for favicon other than .ico files will be supported in future.

New Official Twitter Follow button with Followers Counter

Web developers were using various methods to add the twitter follow button with the Number of followers information. Twitter made it more easy to add follow button on your blogs or website. Twitter uses two methods for adding the follow button into your site.

• Using Javascript
• Using an iframe

We can easily embed the follow button to our blogger by adding the code in the HTML/Javascript under the Add a Gadget in blogger Dashboard.

When a visitor clicks on the follow button. A pop up window opens, which shows the recent two tweets of user and brief info about the user. On top right we can see the follow button. This is really an important and useful Resource of Twitter.
You can get the basic Follow button by providing your Twitter username and some customizing option from https://twitter.com/about/resources/followbutton
Advanced users can customize the button using the supported attributes from http://dev.twitter.com/pages/follow_button

How to send email using different email address in gmail

Earlier i made a post How to Manage Multiple Email ids in which i wrote how to manage multiple gmail account using mail forwarding, that allows you to read all the incoming mails of different email id in single id. Recently a new feature was added in gmail which allows you to send mail using a different sender address, you can add alternate email address from setting > accounts > Send mail as: for better understanding i have added a video tutorial.

Attractive Twitter timeline widget for blogger

Add attractive twitter timeline widget to your blogger sidebar. All you have to do here is that,

• goto blogger Dashboard 
• click on Add a Gadget
• Then click on HTML/JavaScript 
• Paste the below code in Content 
• Now change the word ishuspace which is in Red to your twitter profile name
• Here the number 5 is to display no of tweets to show, you can change it as per your wish.
• Save the template, You are done..

<style>
.tweetboxbg1 {
background: #017398 url(http://i319.photobucket.com/albums/mm445/itsmeeirsh/twitterboxbg1.png) no-repeat;
padding: 101px 3px 3px 3px;
border-radius: 5px;
}

#twitter_update_list {
color:#fff;
font-size:13px;
font-weight:normal;
}

#twitter_update_list a {
color:#42a9cc;
text-decoration:none;
font-size:14px;
font-weight:bold;
}

#twitter_update_list li {
border-bottom: 1px dotted #fff;
}
</style>
<div class="tweetboxbg1"><ul id="twitter_update_list"></ul></div>
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/ishuspace.json?callback=twitterCallback2&count=5" type="text/javascript"></script>

Gtalk bot for twitter - chitter.im

chitter.im is new Gtalk bot which posts the recent timeline of your twitter account in the gtalk or chat in gmail. You no need to open the twitter website when you are in gtalk or using any other gtalk client. The chitter.im bot send you message when ever you get a new tweet. There are various commands that will help you in using the bot. Just send /h as instant message to the bot id, it will listout various commands that will help you managing the bot. you need to send /on to start receiving the tweets. To stop the updates, just send /off look at the video tutorial for easy setup of the bot. 

Gmail guru bot which can provide you information about score, weather, define, translate, web.

guru@googlelabs.com is a cool bot id which provides you various information such as score, weather, define, translate, web.
To add this bot to your gmail id. Invite the id guru@googlelabs.com to chat. For your better understanding video tutorial is added below. Once you have added the bot send the message help which will list out the features of the bot. To know information about how to use the score feature or some other feature information, send help example: help weather.

• To know the score Enter 'score ' to get recent scores, i.e. 'score Arsenal'.
• To know the weather Enter 'weather ' to get weather info, i.e. 'weather Nairobi'.
• To get definition of a word Enter 'define or 'd ' to get definition of the term i.e. 'd internet'. Ask for one definition at a time.
• To translate a word Enter 'translate from to ', i.e. 'translate goodbye from English to French'. If 'from ' is omitted we will try to detect the language of your phrase. You can abbreviate 'translate' to 't', i.e. 't goodbye to German'.
• To get web result for a query Enter 'web ' to get results from the web and then type 'next' to scroll to see more results. Only text is displayed.

Round Cornered Navigation Menu without using Image-CSS

Mozilla CSS Extensions is a cool extension for designing attractive website, round corner box is one of the feature which allows you to add rounder corner to a div content or even a list item. I would like to add some of the CSS style using which a stylish Navigation Menu can be designed. This type of menu works fine in browsers like Mozilla Firefox, Opera and Chrome Browser. I have designed some 7 CSS here with id as ishumenu1, ishumenu2 and so on.

Demo

Mozilla CSS Extensions is a cool extension for designing attractive website, round corner box is one of the feature which allows you to add rounder corner to a div content or even a list item. I would like to add some of the CSS style using which a stylish Navigation Menu can be designed. This type of menu works fine in browsers like Mozilla Firefox, Opera and Chrome Browser. I have designed some 7 CSS here with id as ishumenu1, ishumenu2 and so on.

// Style 1
#ishumenu1 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu1 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu1 a {color: #ffffff;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu1 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu1 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:5px;-moz-border-radius:5px;background: #730948; -webkit-border-radius:5px;}
#ishumenu1 li:hover { background: #b13866;}
#ishumenu1 li:hover a { color: #ffffff;}

// Style 2
#ishumenu2 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu2 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu2 a {color: #000000;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu2 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu2 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:5px;-moz-border-radius:5px; -webkit-border-radius:5px;border:1px solid;}
#ishumenu2 li:hover { background: #b13866;}
#ishumenu2 li:hover a { color: #ffffff;}

// Style 3
#ishumenu3 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu3 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu3 a {color: #000000;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu3 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu3 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:5px;-moz-border-radius:5px; background: #ffffff;-webkit-border-radius:5px;}
#ishumenu3 li:hover { background: #a7a505;}
#ishumenu3 li:hover a { color: #ffffff;}

// Style 4
#ishumenu4 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu4 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu4 a {color: #000000;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu4 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu4 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:5px; -moz-border-radius:5px;-webkit-border-radius:5px;border:1px solid #ffffff;}
#ishumenu4 li:hover { border:1px solid #057fa7;}
#ishumenu4 li:hover a { color: #057fa7;}

// Style 5
#ishumenu5 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu5 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu5 a {color: #000000;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu5 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu5 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;background: #f5a146;-webkit-border-radius:5px; -moz-border-radius: 10px 2px;border-radius: 10px 2px;} #ishumenu5 li:hover { background: #bb660b;}
#ishumenu5 li:hover a { color: #ffffff;}

// Style 6
#ishumenu6 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu6 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu6 a {color: #ffffff;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu6 a:hover {color: #56bb33;display: block;text-decoration: none;}
#ishumenu6 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:10px 10px 0px 0px;-moz-border-radius:10px 10px 0px 0px;background: #047ecc;-webkit-border-radius:5px;}
#ishumenu6 li:hover { background: #8fd0f9;} #ishumenu6 li:hover a { color: #000000;}

// Style 7
#ishumenu7 {padding: 0px 15px;list-style: none;height:25px;text-transform:uppercase;}
#ishumenu7 ul {margin: 0px;padding: 0px 5px;list-style: none;height:25px;}
#ishumenu7 a {color: #ffffff;display: block;font: 14px Georgia,Century gothic,verdana, Arial, sans-serif;text-decoration: none;}
#ishumenu7 a:hover {color: #56bb33;display: block;text-decoration: none; }
#ishumenu7 li {float: left;margin: 2px 5px;padding: 5px 10px 0px 10px;height:25px;border-radius:0px 0px 10px 10px;-moz-border-radius:0px 0px 10px 10px;background: #047ecc;-webkit-border-radius:5px;}
#ishumenu7 li:hover { background: #8fd0f9;}
#ishumenu7 li:hover a { color: #000000;}

Blogger Page Navigation Hack for colorful Numbering

Page Navigation hack for blogger is really awesome trick to stylish the older post and newer post link with attractive page number buttons. You can easily get the Page Navigation Hack trick in the web. Almost all the sites provide the same style of page numbering. I would like to share some of the CSS design which will really change the style of your Page Navigation. To add these styles. Just replace the CSS of the Page Navigation with the CSS available here. You can select the style with the preview. This style includes Gradient effect without any image and has round cornered edges which give more effect to the button.

The Default Buttons look like this.

/* www.techirsh.tk */
.showpageArea {font-weight: bold;margin:5px;}
.showpageArea a {text-decoration:underline;color: #fff;}
.showpageNum a, .showpage a {text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #9dd53a; /* old browsers */
background: -moz-linear-gradient(top, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom,
color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217),
color-stop(100%,#7cbc0a)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a',
endColorstr='#7cbc0a',GradientType=0 ); /* ie */
}
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc;
background: #6db3f2; /* old browsers */
background: -moz-linear-gradient(top, #6db3f2 0%, #54a3ee 50%, #3690f0 51%, #1e69de 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6db3f2),
color-stop(50%,#54a3ee), color-stop(51%,#3690f0),
color-stop(100%,#1e69de)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6db3f2',
endColorstr='#1e69de',GradientType=0 ); /* ie */
}
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #e2e2e2; /* old browsers */
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1),
color-stop(100%,#fefefe)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',
endColorstr='#fefefe',GradientType=0 ); /* ie */
}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}

/* www.techirsh.tk */.showpageArea {font-weight: bold;margin:5px;}
.showpageArea a {text-decoration:underline;color: #fff;}
.showpageNum a, .showpage a {text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #789EB1; /* old browsers */
background: -moz-linear-gradient(top, #789EB1 0%, #618FA7 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#789EB1),
color-stop(100%,#618FA7)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#789EB1',
endColorstr='#618FA7',GradientType=0 ); /* ie */
}
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc;
background: #7d7e7d; /* old browsers */
background: -moz-linear-gradient(top, #7d7e7d 0%, #6B6B6B 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d),
color-stop(100%,#6B6B6B)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d',
endColorstr='#6B6B6B',GradientType=0 ); /* ie */
}
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #e2e2e2; /* old browsers */
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1),
color-stop(100%,#fefefe)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',
endColorstr='#fefefe',GradientType=0 ); /* ie */
}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}

/* www.techirsh.tk */.showpageArea {font-weight: bold;margin:5px;}
.showpageArea a {text-decoration:underline;color: #fff;}
.showpageNum a, .showpage a {text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #f85032; /* old browsers */
background: -moz-linear-gradient(top, #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c),
color-stop(51%,#f6290c), color-stop(71%,#f02f17),
color-stop(100%,#e73827)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032',
endColorstr='#e73827',GradientType=0 ); /* ie */
}
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc;
background: #aebcbf; /* old browsers */
background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a),
color-stop(100%,#0a0809)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf',
endColorstr='#0a0809',GradientType=0 ); /* ie */
}
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #e2e2e2; /* old browsers */
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1),
color-stop(100%,#fefefe)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',
endColorstr='#fefefe',GradientType=0 ); /* ie */
}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}

/* www.techirsh.tk */.showpageArea {font-weight: bold;margin:5px;}
.showpageArea a {text-decoration:underline;color: #fff;}
.showpageNum a, .showpage a {text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #ffb76b; /* old browsers */
background: -moz-linear-gradient(top, #ffb76b 0%, #ffa73d 50%, #ff7c00 51%, #ff7f04 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb76b), color-stop(50%,#ffa73d), color-stop(51%,#ff7c00),
color-stop(100%,#ff7f04)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb76b',
endColorstr='#ff7f04',GradientType=0 ); /* ie */
}
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc;
background: #9dd53a; /* old browsers */
background: -moz-linear-gradient(top, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217),
color-stop(100%,#7cbc0a)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a',
endColorstr='#7cbc0a',GradientType=0 ); /* ie */
}
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #e2e2e2; /* old browsers */
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1),
color-stop(100%,#fefefe)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',
endColorstr='#fefefe',GradientType=0 ); /* ie */
}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}

/* www.techirsh.tk */.showpageArea {font-weight: bold;margin:5px;}
.showpageArea a {text-decoration:underline;color: #fff;}
.showpageNum a, .showpage a {text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #3b679e; /* old browsers */
background: -moz-linear-gradient(top, #3b679e 0%, #2b88d9 50%, #207cca 51%, #7db9e8 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b679e), color-stop(50%,#2b88d9), color-stop(51%,#207cca),
color-stop(100%,#7db9e8)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b679e',
endColorstr='#7db9e8',GradientType=0 ); /* ie */
}
.showpageNum a:hover, .showpage a:hover {border: 1px solid #ccc;
background: #aebcbf; /* old browsers */
background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#aebcbf), color-stop(50%,#6e7774), color-stop(51%,#0a0e0a),
color-stop(100%,#0a0809)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aebcbf',
endColorstr='#0a0809',GradientType=0 ); /* ie */
}
.showpagePoint {color: #aaaaaa;text-decoration:none;border:1px solid #999;-webkit-border-radius:3px;-moz-border-radius:3px;
margin:0 3px;padding:3px 5px;
background: #e2e2e2; /* old browsers */
background: -moz-linear-gradient(top, #e2e2e2 0%, #dbdbdb 50%, #d1d1d1 51%, #fefefe 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e2e2e2), color-stop(50%,#dbdbdb), color-stop(51%,#d1d1d1),
color-stop(100%,#fefefe)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2',
endColorstr='#fefefe',GradientType=0 ); /* ie */
}
.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}
.showpageNum a:link,.showpage a:link {text-decoration:none;color:#fff;}

Styling 'Contact form 7' Contact form for Wordpress

The 'Contact Form 7' is really an awesome plugin for Wordpress for adding contact form to our wordpress blog and getting mail to our inbox instantly. I guess maximum number of users might be using it in their blog. I thought of making the contact form more stylish and colorful using the CSS3. Styling the contact form is no way difficult. You just need to add the code you get here in the bottom of the css code of Contact Form 7.
looks confusing ??

1. Go to Plugins
2. Click Edit in Contact Form 7
3. Click on contact-form-7/styles.css in Plugin Files list (which is at the right sidebar)

Now add the additional code in the bottom of the codes. You can see some sample contact forms and its code below the image preview

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #000;
padding: 6px 6px 6px 8px;
border: solid 1px #bcbbbb;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #ffffff; /* old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff),
color-stop(100%,#e5e5e5)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',
endColorstr='#e5e5e5',GradientType=0 ); /* ie */
}

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #000;
padding: 6px 6px 6px 8px;
border: solid 1px #bcbbbb;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #49c0f0; /* old browsers */
background: -moz-linear-gradient(top, #49c0f0 0%, #2cafe3 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#49c0f0),
color-stop(100%,#2cafe3)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#49c0f0',
endColorstr='#2cafe3',GradientType=0 ); /* ie */
}

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #000;
padding: 6px 6px 6px 8px;
border: solid 1px #bcbbbb;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #ffd65e; /* old browsers */
background: -moz-linear-gradient(top, #ffd65e 0%, #febf04 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffd65e),
color-stop(100%,#febf04)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd65e',
endColorstr='#febf04',GradientType=0 ); /* ie */
}

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #fff;
padding: 6px 6px 6px 8px;
border: solid 1px #bcbbbb;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #a4b357; /* old browsers */
background: -moz-linear-gradient(top, #a4b357 0%, #75890c 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a4b357),
color-stop(100%,#75890c)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b357',
endColorstr='#75890c',GradientType=0 ); /* ie */
}

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #09749f;
padding: 6px 6px 6px 8px;
border: solid 1px #bcbbbb;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #a9e4f7; /* old browsers */
background: -moz-linear-gradient(top, #a9e4f7 0%, #0fb4e7 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a9e4f7),
color-stop(100%,#0fb4e7)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9e4f7',
endColorstr='#0fb4e7',GradientType=0 ); /* ie */
}

.wpcf7 input,.wpcf7 textarea {
margin: 4px 0px;
color: #686868;
padding: 6px 6px 6px 8px;
border: 1px solid #5998f7;
outline: none;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
box-shadow: 0 1px 3px #5998f7;
-o-box-shadow: 0 1px 3px #5998f7;
-webkit-box-shadow: 0 1px 3px #5998f7;
-moz-box-shadow: 0 1px 3px #5998f7;
}

You can request me if you would like to have different design based on your website design.

How to use Multiple gtalk Windows OS

Previously we discussed how to use multiple Gmail id in single browser now lets see another interesting thing, the most easiest and useful tips to use multiple gtalk application just by adding /nomutex as suffix to the Target link of the gtalk icon. confused still ? The screenshot below will explain you very easily.

Steps:

1. Right Click on the gtalk icon in start menu.
2. select properties
3. add /nomutex at the end of the Target link.
4. Click apply and ok
5. Now again run gtalk application by clicking on gtalk icon. you can see a new gtalk window, where you can sign in to your new alternate account.

You can run n number of applications you want :)

Google Priority Inbox Beta

Learn more: http://mail.google.com/mail/help/priority-inbox.html

How to Login in Multiple Gmail id in single Browser

The eagerness of Gmail users who were waiting for gmail to enable Multiple login in single browser is now gone.
Gmail now enables user to use Multiple id login in single browser. Here are the simple steps with image preview which will help you learn how to use this new awesome feature of Gmail.

 Steps:
1.  visit Google Account Setting and click on change in Multiple sign-in

2. Check On - Use multiple Google Accounts in the same web browser. 
    Read the conditions carefully and check all the fields, then click save. The save button will be disabled until you select all the check box.

3. Once you have saved the setting visit your inbox and select sign in to another account in the drop down option in the right corner of your account as shown in the image below.

4. Once you have clicked the link you will be redirected to login page, in which there will be the list of id(s) which are already logged in. Now login to the other id which you are willing to use simultaneously, using the login form in this page.

5. You are Done.
    The list of id(s) which are logged in simultaneously are listed in right corner of the page, as shown in the image. You can select the desired login and start using its service.

Add Indian Rupee symbol to a document

The New indian rupee symbol is not yet available in the keyboard. Mangalore-based Foradian Technologies Pvt Ltd has created a font called Rupee Foradian which will allow you to add the rupee symbol to the document.

1. To add the symbol you need to download the font Rupee Foradian and install it on your pc. 
2. Once you have downloaded the font, just copy the Rupee_Foradian.ttf font file to the Window's Font directory.

                     C:/ > Windows > Fonts 

1. Once you have copied the font successfully. Change your font face to Rupee Foradian and press the ` key. It will display the Indian Rupee symbol 

WindowBlinds

 


A WindowBlinds skin can make Windows look like an alternative operating system, like their favorite sports or car brand, or something completely new.Because WindowBlinds uses the latest hardware acceleration features of modern video cards, WindowBlinds won't slow down your computer and uses very little memory.
 

WindowBlinds is safe and easy to use. It doesn't alter any system files and users can switch between the default Windows look and feel and a custom WindowBlinds skin with the click of a button. In addition, WindowBlinds has been tested to ensure it works with Windows Vista, so you know it is compatible, reliable, and more secure.

A Windows utility that enables users to personalize nearly every aspect of the Windows graphical user interface. Part of Object Desktop.

Download

3D Crash Icons Screensaver

3D Icon Crash screensaver is a beautiful screensaver. Screensaver contains real physics engine which makes collisions between icons look very realistic like in real world.User can set up camera to see your PC desktop in 3D world.

Download

undisclosed recipients in Yahoo! Mail

Send an email message to undisclosed recipients in Yahoo! Mail

Normally if you send messages to a group of email addresses then the recipients can easily see the list of addresses for whom you have send the mail.
Its easy to hide your recipients addresses.

To do so Continue Reading

• Add your own id in the address book with the name Undisclosed in the First Name and recipients in the Last Name and click SAVE
• Create New Mail
• Type undisclosed under To:
• Select Undisclosed recipients from the auto-complete list
• Now Click Show BCC and enter all desired recipients under BCC:
• Now compose your mail and Click SEND
  

Its done

Give a Try

How to Manage Multiple Email ids

Are you tired using multiple ids or you miss some important messages of your alternate Gmail id ?
Here is the solution.
Some have multiple email ids like personal id and business ids, in this case it becomes difficult to keep on switching between ids. To overcome we can use the Forwarding option in Gmail.


Steps:

1. Goto Setting
2. Select Forwarding and POP/IMAP tab
3. There we have "Forward a copy of incoming mail to" click on it. You will be asked to enter the email id to which the messages is to be forwarded.
4. After adding your email id to which you need the messages to be forwarded, goto inbox of the given id, there you might have received a confirmation code.
5. Submit the confirmation code in the verify text box.
6. Once your id is verified your email id will be listed in Forwarding and POP/IMAP just select your id and select the actions to be made to the mails which will be in the current id.
7. Final and important is to click Save Changes. 
8. You are done

Now enjoy reading mails of multiple id in single id.

Orange Dark Ash - New Blogger Template

Orange Dark Ash is a new Blogger template with almost all default features of Blogger. You can customize the Font color and size and can make much more changes using blogger template editor. Orange Dark Ash gives a cool dark look to your blog.
Its comment area is made more stylish and attractive.
Demo Download

Mail filter in Gmail

Gmail's filters allow you to manage the incoming messages to your mail. Using filters, you can automatically label, archive, delete, mark star, or forward your mail, even keep it out of Spam . this is all done based on a combination of keywords, sender address, recipients, and more.

steps to create filter :

1. Click Create a filter (next to the Search the Web button at the top of any Gmail page as shown in the above picture).
2. Enter your filter criteria in the appropriate fields(we have given subject as www.buzz11.com).
3. Click Test Search to see which messages currently in Gmail match your filter terms. You can update your criteria and run another test search, or click Next Step.
4. we can select more than one action from the list(we have selected archive it and apply to label as personal)
5. if you want to filter messages that are already in gmail then select Also apply filter to x conversations below checkbox.
6. finally Click Create Filter.