Few days ago Twitter has introduced their own tweet buttons for web masters.Now you can use this twitter button directly share your posts through twitter without any third party web site.So you and your visitors don't want to authenticate any third party web site to access your Twitter account.These new tweet button loads very fast and anyone can share your article with in few seconds.There are 3 types of Beautiful Tweet buttons : Vertical count, Horizontal count and No count.Here I am going to describe how to add these Twitter buttons to your blogger blog.

If you like o add these Twitter official share button to your blogger blog,then follow the steps given below.



1.Login to your blogger Dashboard--> Design- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see below code:

4.Now Copy your "Twitter tweet button" code and paste it just below the above code.

NOTE: If you can't find

in your template, paste your "Twitter tweet button" code just before .

Code 1 : Vertical Count

TWITTER-USERNAME">Tweet

Result:


Code 2 : Horizontal Count

TWITTER-USERNAME">Tweet

Result:


Code 3 : No Count

TWITTER-USERNAME">Tweet

Result:


Note :
Remember to replace "TWITTER-USERNAME" with your real Twitter username.

If you want to show Tweet buttons not only Post pages but also Home page,Archive pages,Label pages,etc... , then remove "" and "" from above codes.

5.Now save your template.

You can view more info from here:

http://twitter.com/goodies/tweetbutton

Want to build a custom tweet button for your site? Check out developer documentation for the Sharing API to provide the same Tweet Button sharing functionality with your own style :

http://dev.twitter.com/pages/tweet_button

Blogger New Commenting Feature

Blogspot has a new feature implemented again - this time it's a new feature for comments.

Now you can manage the comments received on your Blogger blog. It will be with one of the tabs with the other navigation, such as Edit Post, Settings, Designs and Monetize.

Here's how the navigation bar look now.

With the commenting feature, now you can easily check on published comments, comments that are awaiting moderation and spam comments.

To be honest, it's almost like Wordpress now - except Wordpress has a "Trash" are once you deleted a particular comment, probably just in case you want to recover it back.

But when you delete comments on Blogspot, that cannot be undone.


This is how the "Published" section look like - with complete information such as comment author, commented blog post and the date.


Comments "Awaiting Moderation" section. It's self-explanatory.


And lastly, the "Spam" section. Haven't gotten any in my spam inbox right now, hopefully it works against automated spam comment bots.

Take note: It's not implemented on all blogs, yet. Only a handful of blogs has this feature - probably all will have it in the near future.

New Comments System on Blogger : Spam Filtering | Comments "Inbox"

Commenting is one of the most important parts of blogging. it’s what makes blogging a conversation. Now Blogger has introduced 2 new improvements to Blogger’s comments system: Spam filtering(Spam Inbox) and the ability to view all comments on your blog in one place(Comments Inbox).





Comment Inbox

The Published sub-tab(under Comments tab) provides a similar view as your email inbox. You can see all of the comments on your blog in one place.



Also you can mark them as "spam",delete or remove content of the comments.When you mark a comment as Spam, it will be deleted immediately from your blog.



Comment moderation has also moved under the Comments tab and has been extended to allow you to mark comments as Spam.



Comments Spam Filtering(Spam Inbox)

To fight with spam, some of you enabled moderation of all comments or required word verification or login. While somewhat effective, these checks limit real-time conversations around your blog.To address this,Blogger have integrated Google’s spam filtering technologies into the Blogger comment system.

The comments in the Spam inbox are not visible to your readers. Here, you can permanently delete spam comments by selecting them and choosing Delete. You can also mark comments as Not Spam that have been incorrectly classified as spam.Choose Not Spam and the selected comments will be moved out of the spam list and will be immediately published on your blog.

Want to Read More?

http://www.google.com/support/blogger/bin/answer.py?&answer=187141

http://buzz.blogger.com/2010/08/new-comments-system-on-blogger.html

Pure Magazine V1 Premium Blogger Template

This is a magazine style free premium blogger template created by me.It has many advanced features, you can see in a blogger template.I hope you will like it very much.To configure this template read the instructions given below.And also read the instruction inside the downloaded zip file.

Template Features

• Column: 3 Columns/2 Sidebars/Right Sidebars
• Fixed Width Template (1000px width)
• 2 Horizontal Navigation Menus
• Auto Read More Feature with Thumbnails.
• 468*60 Header Ads banner
• 1 CSS Search Box
• CSS Subscribe Box included
• JQuery Featured Post Content Slider included
• 4 Column Footer section
• Meta tags installed
• SEO friendly blogger title hack installed to help you rank higher in Google
• Facebook Like button installed
• Hosted images on blogger. Free use forever!
• Favicon support so you can add your own url icon
• Compressed CSS to speed up your page load times
• Modified "Older Posts","Home","Newer Posts" Links
• Automatically highlight author comments
• Modified Comments Section to Enable Avatars in Blogger Comments
• More...
  

Demo Download Template name : Pure Magazine V1 Template type : 2 Sidebar, 3 Column, 4 Column footer, Elegant, Featured Section, Fixed width, Header Banner, Magazine, Premium, Right Sidebar, Rounded corners, Slider, Top Navigation Bar, Web 2.0, White Release date : 08-12-2010 Coder/Designer Name(s) : Lasantha Bandara Coder/Designer URL(s) : http://www.premiumbloggertemplates.com/ http://www.bloggertipandtrick.net/ Advanced Details : http://www.premiumbloggertemplates.com/2010/08/pure-magazine-v1-blogger-template.html

Template Layout Structure



4 Column Footer Section



Template Customization

Basic Template Installation:

1.First download the template and unzip the file.

2.Now, sign in to Blogger dashboard and click on the layout.

3.Here is the important step, after uploading any new Blogger template, all of the previous widgets like your google adsense ads,text,profile,poll,etc etc will be lost.
So, to avoid this to happen, in this step click on 'edit' on all the widgets and copy the codes into notepad,etc.

4.Now click on the 'Edit html' tab

5.First of all please Download Full Template.This is to back up your present template.If the new template that you are going to upload makes/gets into some errors or if you make more complex errors in that,then you will loose everthing.So make sure that you back up your template.

6.Just below that,there's an option of uploading new template.So, use the Browse button and upload the downloaded xml file.

7.Now, a message appear saying that your widgets are about to be deleted.Click on the Confirm & Save (no problem doing this because we already copied the widget codes in Step 3).

8.Now click on "confirm and save".Now you successfully installed the template.

8.Click on the 'Page elements' page now and add the codes that you copied in step3 using the 'Add a Page Element' option.

How To Configure Meta Tags

Find this code in your template:

Now Replace,

DESCRIPTION HERE with your site description.
KEYWORDS HERE with your site keywords.


How To Configure First and Second Navigation Bar

Login to your blogger dashboard--> design- -> Edit HTML.Now Scroll down to where you see below code :

Link-Name-X

Now Replace Your-Link-Here,Link-Title,Link-Name-X with your details.


How to Configure Featured Content Slider

Add this code into a HTML/JavaScript box and place it into above "Blog Posts" section:

NOTE :
Replace "featured post x link"s with your real featured posts links.
Replace image addresses with your real featured posts image addresses.

How To Show Slider only in homepage

Read the instruction inside the downloaded template file.

How to Configure Reply Option of Comments

Find this text in your template : YOUR-BLOG-ID

Now replace it with your real blog ID.

More Details : http://www.bloggertipandtrick.net/2010/06/add-reply-option-to-blogger-comments.html

How to Add Search Box

Add this code into a HTML/JavaScript box:

How to Configure subscribe box

Enter Below code into a HTML/JavaScript box to Add Slider to your blog:

Twitter



Facebook Page



Subscribe via Email

Remember to Replace,

"pbtemplates" with your feedburner ID.(you can find it 3 times)

"btipandtrick" with your twitter ID.

"http://www.facebook.com/pages/Premium-Blogger-Templates/10150130448820134" with your Facebook URL.


How To Configure Favicon

Login to your blogger dashboard--> Design- -> Edit HTML.Now Scroll down to where you see below code :

Now replace "YOUR-FAVICON-URL" with your Favicon address/url.


Configure "Timestamp Format" Format

Login to your blogger dashboard--> Settings- -> Formatting.Now set your timestamp format as the picture below.





Important !!!:

Please do not remove the footer credit. I spend several hours to create this blogger template. So that you can use it for your blog. All I ask is, stay the credit intact.

License:

This free Blogger template is licensed under the Creative Commons Attribution 3.0 License,which permits both personal and commercial use.
However, to satisfy the 'attribution' clause of the license, you are required to keep the footer links intact which provides due credit to its authors. For more specific details about the license, you may visit the URL below:
http://creativecommons.org/licenses/by/3.0/

Tutorial: How To Set Password for Blogger Post

How to make blogger post private?
How to encrypt blogger post?
How to create blog post with password?

First, please proceed to http://www.vincentcheung.ca/jsencryption/instructions.html.

Go to Dashboard > Design > Edit HTML.

Then add the JavaScript decryption code after the tag in the HTML code of your blog. Copy and paste the following code:

Then proceed to http://www.vincentcheung.ca/jsencryption/.

You'll see this page.


Then type for secret key at the "Key" area and the secret message at the "Plain Text" area.


After doing so, hit the Encrypt button under the "Plain Text" area.

Then scroll down a little and you'll see the "HTML Code" area. Highlight, copy and paste the HTML code into your POST EDITOR.



And that's it!

Here's the result of the example shown. The secret key is "the key". Go and click on it.

Show encrypted text

How To Display Recent Twitter Tweets Using JQuery

Do you want to show your recent tweets inside your website or blogger blog?Then,this tutorial will helpful for you, to add recent tweets into your website using Jquery.Your recent tweets will load fast using jquery and also you can change number of tweets must display very easily.If you want you can read advanced details about tutorial from here: http://www.thewebsqueeze.com/web-design-tutorials/displaying-your-tweets-on-your-website-with-jquery.html

Twitter is a social networking and microblogging service, owned and operated by Twitter Inc., that enables its users to send and read other user messages called tweets. Tweets are text-based posts of up to 140 characters displayed on the author's profile page.

Now follow the steps given below to add this recent tweets widget to your website or blog.

1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .

NOTE :
btipandtrick : Replace this with your twitter username.

5 : Number of tweets must appear.

4.Now save your template.

5.Go to Layout --> Page Elements.

6.Click on 'Add a Gadget'.

7.Select 'HTML/Javascript' and add the code given below:

There was a problem fetching tweets
Currently loading your tweets...

btipandtrick">Follow me on twitter

You are done.

How To Manage External Links Using JQuery

In this tutorial I am going to show how to style your external links differently from the other links using Jquery.Also after adding this trick to your blogger blog or web site,all external link of your site will open in new window.This is very easy to do and you can view a DEMO HERE.If you want to know further details about this trick you can read this : http://www.madeincima.eu/blog/jquery-tutorial-external-links/

Now to add this jquery external links effect to your site follow the steps given below.



1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .

4.Now save your template.

You are done.Now all of your external links open in new windows and can identify external links from other links.

How To Use Own Photo as Blog Background

How to add photo as Blogger blog background?
How to upload own photo to blog background?
How to change blog background to own photo?
How to modify Blogspot blog background to own photo?
How to put image as blog background?

Blogger in Draft's Template Designer now has a new feature which allows users to upload their own photos as background easily.

To do so, go to Dashboard > Design > Template Designer > Background.

Click on the "Background image" and you'll be able to see the "Upload image" feature. Click it and you'll be able to select the preferred picture as your blog's background.

According to Blogger in Draft blog, for images that fill the entire background, a resolution of 1800px wide and 1600px high is recommended and image size less than 200KB to minimize loading time of the blog. It support JPEG, GIF, and PNG format images.

At the end, additional background settings are available by using the Alignment, Repeat and Scroll options.

How To Add Smart Jquery Featured Slider to Blogger/Websites

This is a another tutorial about, how to add great featured jquery content slider to your blogger blog or other website.Read the instruction given below to add this featured content slider to your blog with in few minutes.Remember to use 307px width and 254px height images for this slider.I recommend to DOWNLOAD java script files and host it yourself.Also you can see the DEMO of this slider HERE.

1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .

4.Now save your template.

5.Go to Layout --> Page Elements.

6.Click on 'Add a Gadget'.

7.Select 'HTML/Javascript' and add the code given below:

NOTE : Replace,

SLIDE-X-LINK-HERE with your real featured posts links.

SLIDE-X-IMAGE-ADDRESS-HERE with your real slide images addresses.

Look at the example below:

You are done.

How To Create JQuery Featured Content Slideshow

In this tutorial I am going to explain,how to create a slideshow to show your featured content to visitors.This is very easy to add and configure.This slideshow is working using jquery.You do not want to host any java script file yourself to add this slideshow to your blog.So you can add this slideshow to your site with in few minutes.Default width=600px and height=240px.But you can change it easily to match it for your website.

If you like add this slideshow to your blogger blog or website,then follow the steps given below.



1.Login to your blogger dashboard--> Design - -> Edit HTML.

2.Scroll down to where you see tag .

3.Copy below code and paste it just before the tag .

4.Now save your template.

5.Go to Layout --> Page Elements.

6.Click on 'Add a Gadget'.

7.Select 'HTML/Javascript' and add the code given below:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaKEHbH9evHLCjhyphenhyphenhuiVFc2DIcHpnW3zbChzf8fWQnt4FhliRMdav1KdpiG0YD6-4p0cWjDjve4wvrHrWpkL2g4tu8MQZq4FZnRAdnOG2EE4mkVB8yQN2uZlJgV3YTEHeCnwGj7DdIQoc/s1600/1.jpg" title="This is featured post 1 title" alt="Replace This Text With Your Featured Post 1 Description." />

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi98bwJbpZHmK7UnfB00w8ZH9bCg3haRd_sgZhDd_-G0zFkJZkK9RIBt4wJ0-SlIAv2c0CGxqcKTJrNHLKnBTscyevXvLn2V5bUBisl5W8RYT1OrFXoclxhfXJvmoReOJ9GsAaNEomtmHE/s1600/2.jpg" title="This is featured post 2 title" alt="Replace This Text With Your Featured Post 2 Description." />

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAf-m-Kcy_NahYNCC4d7ftCY4R7XF5VDvD1nBuE8939Dp4Husi9TPqOHC0SEluWuGREUB3_qBQd-tLKAt9INY5PTyc8U3xt3OryNfYIBgibYI_PXU622AdmZWOpN0mP-kzTjjGe4wsidw/s1600/3.jpg" title="This is featured post 3 title" alt="Replace This Text With Your Featured Post 3 Description." />

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpoeHL0qZzTNGxw88yxWPEN7h6zjD75sxzpik5B3IE4C3GzXjcbDjSVmcT_qn7HcxgQDkrjdHX3_t25Ne5_rGYU-Vuwx0_4ujGq24-bKzWFJu2cnbCo0bgMzGT730-bLvMiUTocednQ3M/s1600/4.jpg" title="This is featured post 4 title" alt="Replace This Text With Your Featured Post 4 Description." />

You can add more slides as you like.

Note : Replace images URLs,"This is featured post X title","Replace This Text With Your Featured Post X Description" with your content.

You are done.

How To Add Random,Rotating Images for Blogger Header

In this tutorial I am going to explain how to add random,rotating images for your blogger header background.When after you adding this feature to your blogger blog,header image of your blog will rotate/change in each page refresh.Before doing this trick you must create header images for your blog.In this tutorial I am going to show how to rotate 5 header images.

1.Log in to your dashboard--> Design- -> Edit HTML

2.Scroll down to where you see tag.

3.Now copy below code and paste it just after the tag.

NOTE :

Replace "URL-OF-HEADER-IMAGE-X" with your image URLs.

If above code doesn't work for your blog,then replace "#header-wrapper" with "#header".(ID or Class of your header section).

You can add different number of images than 5.But remember to change "4*Math.random()" according to the number of images you add.For example,when you want to add 8 different images for your blog header background, then code should be change as "7*Math.random()".Look at the example below:

4.Now save your template and your done.Refresh your site few times to see the result.Your header image will be rotate.

How To Add Twitter Follow me Button to Blogger/Website

This tutorial will explain to you how to add Twitter Follow me Button to your blogger blog or any other web site.This service is provided by Tweetmeme.com.This Follow button is for website and blog publishers that want to encourage their audience to follow them on twitter. This button provides the interface to see the follower count of a particular user and a button which upon pressing opens the follow pop-up providing a number of different views and statistics about the user from additional services such as Twitter Grader, Twitalyzer and Twitter Counter.

If you are a blogger then follow the steps below to add this 'Twitter follow button' to your blogger post.



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

2.Click on "Expand Widget Templates"

3.Scroll down to where you see below code:

4.Now Copy your "Tweetmeme Follow Button" code and paste it just below the above code.

NOTE: If you can't find

in your template, paste your "Tweetmeme Follow Button" code just before .

Code 1:

Result:


Code 2:

Result:


Code 3:

Result:


NOTE : Remember to replace yourtwitterusername with your real twitter username.

If you are not a blogger,you can too add this code simply your website.

5.Now save your template and you are done.