Display Your Feed On A HTML Page

About every blogger now is using feedburner to publish their feed. By using feedburner, you can get realtime stats and subscriber count. You can even use a custom domain with feedburner. You can display your feedburner feed on Blogger with a simple feed widget but you can't use that widget on your html site. Don't worry, you can still display your feed on a static html or your website by using BuzzBoost. Here we go:

Go To FeedBurner > Click on your feed:

Click on the "Publicize" tab, and then click on "BuzzBoost" in the list at the left side of the screen (see image below). At this point BuzzBoost will give you a number of different options. Choose your preference and click on "Active" button. If you’ve already activated BuzzBoost you’ll see the option to save instead of activate.

Once you choose your settings and activate BuzzBoost you will be provided with the piece of code. Copy the code provided by FeedBurner and paste it into your page wherever you want it to be displayed. You're completely free to use my feeds on your blog:

<script src="http://feeds.feedburner.com/WidgetCraft?format=sigpro" type="text/javascript" ></script><noscript><p>Subscribe to RSS headline updates from: <a href="http://feeds.feedburner.com/WidgetCraft"></a><br/>Powered by FeedBurner</p> </noscript>

It's done, you can also style this code by using some css:

.feedTitle {
background: none repeat scroll 0% 0% whitesmoke;
padding: 10px;
text-align: center;
font-size: 20px;
font-weight: bold;
border: 1px solid rgb(81, 104, 59);
}
.feedburnerFeedBlock ul {
margin-left:0;
padding-left:0;
list-style-type: none;
}

.feedburnerFeedBlock ul li {
padding: 5px;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #E0E0E0;
}

.feedburnerFeedBlock ul li span.headline a {
color: #990000;
text-decoration: none;
display: block;
}

.feedburnerFeedBlock ul li span.headline a:hover {
color: #535353;
}

#creditfooter {
display: none;
}

Create A Free Android App For Your Blog

Android is a Linux-based operating system designed primarily for touchscreen mobile devices such as smartphones and tablet computers. Initially developed by Android, Inc., which Google backed financially and later purchased in 2005.

It's really great idea to create a native Android app for your blog. In this tutorial I'll show you how to create an Android app without any App Development knowledge. Download an example at this link.

AppsGeyser is a free service that converts your content into an App and makes you money. Your app will have all you need including messaging, social sharing, tabs and full support for HTML5 enhancements.

Visit AppsGeyser and Sign Up. After signing up, click on 'Create App' button. You'll see a big list of app tabs. Now we have to choose a suitable tab for our app. I'll tell you about two different methods:

Using Mobile Site

If you're using Blogger Mobile template or you have a mobile version of your site then you can choose 'Website' option:

In next page fill up your site details and preference (I'll use my second blog WWE Fans Nation to explain this tutorial):

In Website URL section fill your mobile sites url (http://www.yourblog.com?m=1 for blogger users.) Fill all fields and then click on 'Create App' button. It's Done!!! In next page you'll receive downloading link and more options about your app. You can download this app by clicking here.

Using Feed

You can also create an Android app using your blog's feed. Click on 'Create App' button and in next page choose 'NEWS Feed' option:

Hope you're using feeds on your blog. In next page fill up your feed's url and some details:

Now fill your feed url (Ex: http://feeds.feedburner.com/WWEFansNation) and fill your app's details. After completing this form click on 'Create App' button. In next page you'll receive downloading link and more options about your app. You can download this app by clicking here.

You can add more than one tabs to your app. Also, you can monetize your Android app using AppsGeyser's publishers program.

You can also publish your app on Google Play by paying one time 25$ fee. Don't forget to leave a comment.

Stylish CSS Sprites Menu For Blogger

It's always hard to find a suitable menu for your blog. We're making that decision more hard for you by sharing another awesome menu... :p Remember, you can't change menu option, because it's an image based menu. Here we go:

• Go To Blogger > Template > Edit HTML > Find ]]></b:skin>.

• Just above ]]></b:skin> post following css:

/*Menu Stars BWidgets.com */
.bwidgets-nav {
    display:block;
    height:72px;
    margin:30px auto;
    position:relative;
    width:525px; }
.bwidgets-nav ul {
    float:none;
    list-style-image:none;
    list-style-type:none;
    margin:3px 0; }
.bwidgets-nav ul li {
    background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdoeMzNPpTXbvyIK9XVcaPLMaIhPyECOa_ZkXtlYYXdu1DqXelgqfZhxHE9Ps3pQcNvJU6MsF1FRkgyF9aPSF5-FTLhZUMgTU32xvQK_9YRann8kyme9ND8jXlg-9vDc28lmAL2s0yW9I/s1600/SpritesMenu.png');
    background-repeat:no-repeat;
    float:left;
    height:72px;
    margin:0px;
    padding-top:5px;
    position:absolute; }
.bwidgets-nav ul li a {
    display:block;
    height:100%;
    width:100%; }
.bwidgets-nav ul li.sm1 {
    background-position:0 0;
    left:0px;
    width:125px; }
.bwidgets-nav ul li.sm2 {
    background-position:-125px 0;
    left:100px;
    width:124px; }
.bwidgets-nav ul li.sm3 {
    background-position:-249px 0;
    left:200px;
    width:124px; }
.bwidgets-nav ul li.sm4 {
    background-position:-373px 0;
    left:300px;
    width:125px; }
.bwidgets-nav ul li.sm5 {
    background-position:-498px 0;
    left:400px;
    width:126px; }
.bwidgets-nav ul li:hover {
    z-index:1000; }
.bwidgets-nav ul li.sm1:hover {
    background-position:0 -75px; }
.bwidgets-nav ul li.sm2:hover {
    background-position:-125px -75px; }
.bwidgets-nav ul li.sm3:hover {
    background-position:-249px -75px; }
.bwidgets-nav ul li.sm4:hover {
    background-position:-373px -75px; }
.bwidgets-nav ul li.sm5:hover {
    background-position:-498px -75px; }
/*Menu Ends BWidgets.com */

• Now save your template...

All done with this past, now it's time to add html mark-up of this menu on your layout.

• Go To Blogger > Layout > Add A Gadget > HTML/JavaScript > Paste following code:

<div class="bwidgets-nav">
<ul>
<li class="sm1"><a href="#"></a></li>
<li class="sm2"><a href="#"></a></li>
<li class="sm3"><a href="#"></a></li>
<li class="sm4"><a href="#"></a></li>
<li class="sm5"><a href="#"></a></li>
</ul>
</div>

Replace all # in above code with your links.....Save It.......

Don't forget to leave a comment.... :)

We Are Now Accepting Guest Posts

It's time for me to take some rest, while you can get featured on TricksPanda.com & BWidgets by writing a guest post for our blog. It's a great way to promote your blog or profiles. You'll be free to write any legal thing on your guest post.

How To Submit?

It's easy, just email me your guest post on contact[at]bwidgets.com. (.html or .zip)

You'll Get...

You'll get full credit of your guest post, also a backlink to your blog. Don't forget to email me your name and website. I'll also post "About Author" column below your guest post. It's great way to get more fans.

More Info:

Niche:

• Blogging
• Web Designing
• Internet
• Android
• Google
• Social Media
• Money Blogging
• WordPress

Supported formats:

• .zip
• .html
• .txt

By submitting a guest post you accept:

• It's an original and fresh post. (No Copycats Allowed)
• We can modify your post. (Only to make some changes, not much)
• Your post is totally legal. (Only legal posts accepted. Not for hackers.)
• I'am Awesome. (Most important point)

Blogger File Hosting Solution

Unlike WordPress, Blogger doesn't provides file hosting. You can only upload images on your blog via Picasa. Every blog owner needs some kind of file hosting to host their scripts, projects, documents and all. In this post, I'll discuss upload several sites, which provides free file hosting. All sites are powered by Google.

Picasa: Picasa is Google's official image hosting website, where you can host all your images. It's totally free and it works via Blogger's image uploader. Your blog's all images are hosted in Picasa.

YouTube: YouTube is Google's video hosting website also world's #1 video hosting website. You upload and embed your videos on your blog via YouTube. It's a great way to promote your blog with your videos. It's totally free, and you can also earn some money via YouTube.

Google Code: Google Code is best place for all developers. You can host your js, css, html, swf, zip, images, txt and bunch of more files formats on Google Code. Google Code is also totally free and it provides 4GB space. You can learn about hosting your files on Google Code on our site.

Google Sites: Google Sites is a free and easy way to create and share webpages. You can also hosts your files on Google Sites. It supports css, js, zip, swf, images and bunch more files formats. It provides 100MBs of free storage per site. You can create unlimited sites on Google Sites. Best part of Google Sites is that you can use your custom domain.

Google Drive: Google Drive is a file storage and synchronization service by Google. Google Drive gives all users 5 GB of cloud storage to start with. A user can get additional storage, which is shared between Picasa and Google Drive, from 25 GB up to 16 TB through a paid monthly subscription plan. It supports images, videos, html, js, css and more. You can learn more about Google Drive's supported file formats at this link.

How To Screen Capture Your Android

So recently i bought a new Android phone, and i was trying to capture above screenshot. It's going to be a very useful tutorial for you. We just need a free software from Google Play. You don't need a rooted for this tutorial. First go and download Screen Capture Shortcut from Google Play. After downloading and installing open the software:

As you can see in above picture, In first option (Capture From Notification) select Yes. Now your software is totally activated and you can capture image any time. So still wondering who to capture?

Now when you want to capture any screenshot just slide your notification bar down:

As you can see in above picture, after clicking on 'Screen Capture Shortcut,' your phone will capture your screen in 0.5 seconds.

You can also change notification type, capture time and all other options in your app. Hope this will work you...Don't forget to leave a comment...

Monetize Your Blog With InfoLinks

Lots of peoples are blogging just for money, and they are not getting much success in it because Google Adsense is still not accepting their application or they banned them. If you want to earn some money with your blog with some high-quality ads (Way much better than ClickSor) then you should join InfoLinks.

InfoLinks is world's leader in Text-Links advertising. It's very easy to use, and you earn some good amount with it. It gives you four different types of advertising options (including inText, inTag, inSearch and inFrame), and you choose any of it (maybe all four).

For those of you who are wondering about payment options, you can get your payment via eCheck, Paypal, Wire Transfer and Payoneer pre-paid debit card.

Even if you're using Adsense on your blog, then InfoLinks is also a good way to get more from your blog. In my opinion Adsense + InfoLinks is best way to earn for small and medium publishers. Don't worry....It's 100% safe to use InfoLinks with your Adsense account.

Get Started By Clicking Here.

Optimize Blog Title For Search Results

Your traffic from search depends on your content and post titles. I guess now it's time to give a bit attention to your blog/post title for a better SEO. Sorry for bad editing, i recently formatted my pc, and right now i don't have Photoshop. Let's focus on topic....

It would be better if Title Starts with your Post Title and ends with your Blog Title.I do believe that it will definitely improve your Click Through Rate.

• Go To Blogger > Template > Edit HTML

• Find following code in your template:

<title><data:blog.pageTitle/></title>

• and replace it with:

<!-- Start www.BWidgets.com: Changing the Blogger Title Tag -->
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<title><data:blog.pageTitle/></title>
<b:else/>
<title><data:blog.pageName/><b:if cond='data:blog.pageName'> ~ </b:if><data:blog.title/></title>
</b:if>
<!-- End www.BWidgets.com: Changing the Blogger Title Tag –>

• Save Your Template......That' IT!!

After saving the template take a look at your blog post pages and your will notice the change in titles in your browser's title bar.

Soon Google bot will re-index your pages with new improved page titles.

Manually Adding Disqus Comment Box On Blogger

Previously we discussed about adding Disqus comment system to Blogger. Now i'll tell you how to add Disqus comment system manually on your blog.

If the Disqus gadget installer isn't working, you have the option of manually installing the gadget on your Blogger site. This will require editing your Blogger template HTML, so it won't work with Dynamic Views templates.

• Go To Blogger > Layout > Add A Gadget > HTML/JavaScript

• Enter Disqus as the title and the following code for the content:

<!-- Disqus comments gadget -->

• Click save and the window will close....

Now all done in Layout section of your blog, now it's time to move to the Template section.

• Go to your blog's Template section and then click the "Edit HTML" button > Proceed

• Click 'Expand Widget Templates' box

• Search for the widget you just created in your HTML template by pressing Ctrl-F (Command-F on OSX) then typing Disqus. You should find the following line: 

<b:widget id='HTML1' locked='false' title='Disqus' type='HTML'>

• Below that locate and DELETE the following code right before the closing tag. The section you're deleting should look like this:

<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:includable>

• Now before the closing </b:widget> tag, add the following Disqus code

<b:includable id='main'>
            <script type='text/javascript'>
                var disqus_shortname = &#39;EXAMPLE&#39;;
                var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;;

                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = &quot;<data:blog.url/>&quot;;
                }

                var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;;
                var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
            </script>

            <b:if cond='data:blog.pageType == &quot;item&quot;'>
                <style type='text/css'>
                    #comments {display:none;}
                </style>

                <script type='text/javascript'>
                    (function() {
                        var bloggerjs = document.createElement(&#39;script&#39;);
                        bloggerjs.type = &#39;text/javascript&#39;;
                        bloggerjs.async = true;
                        bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_item.js&#39;;
                        (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
                    })();

                </script>
            </b:if>
                <style type='text/css'>
                    .post-comment-link { visibility: hidden; }
                </style>

                <script type='text/javascript'>
                (function() {
                    var bloggerjs = document.createElement(&#39;script&#39;);
                    bloggerjs.type = &#39;text/javascript&#39;;
                    bloggerjs.async = true;
                    bloggerjs.src = &#39;http://&#39;+disqus_shortname+&#39;.disqus.com/blogger_index.js&#39;;
                    (document.getElementsByTagName(&#39;head&#39;)[0] || document.getElementsByTagName(&#39;body&#39;)[0]).appendChild(bloggerjs);
                })();

            </script>
</b:includable>

• Now change EXAMPLE to your site's shortname.

• Click Save template. Assuming there are no errors, Disqus should properly show up on your site now.

Blogger Add Widget Not Working

Want to add a new widget but Add Widget button is not working? Yea, you're are not the only one who is facing this problem. Blogger has a new bug, in which Add Widget button is not working. Thus, you can't add Disqus and other type of widgets on your blog.

If you're new to Blogger, then you should know that you can still add widget to your blog. Browse some widgets from our site or other sites. Click on Add to Blogger button and a pop-up will appear. In that window, Add Widget button will not work so Copy all the code from 'Edit Content' box and manually add that code to your blog:

How To Add Disqus Comment Box

Now, you can't add Disqus widget from this way....To add Disqus comment box on your blog read this article.

Floating Social Sharing Bar Widget For Blogger

This amazing sharing bar is created by W2B. It's a horizontal sharing bar with several social sharing options. Lot's of big websites are using this type of widget on their sites. It'll surely approach your readers to share your posts on their social profiles. Time to add it..

• Go To Blogger > Template > Edit HTML > Proceed > Check the 'Expand Template Widgets' checkbox.

This widget contains jquery so if your blog already has jquery script then remove it from our code.

• Now search for </head> and just above it paste the following script.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
    #w2bSocialFloat {clear:both;padding: 6px 0;display:block;background:#FFFFFF;}
    #w2bSocialFloat td{padding:4px;margin:0;border:none;}
    #w2bSocialFloat td iframe{max-width:82px;width:82px !important;}
    #w2bSocialFloat.w2bFloatSocial{position: fixed;top:0;z-index:9999999;border-bottom:1px solid #ccc;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.15);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.15);box-shadow:0 1px 1px rgba(0,0,0,0.15);}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
// Set the Top Offset
$theOffset = 0;

jQuery(document).ready(function(b){var a=b("#w2bSocialFloat");a.wrap('<div id="w2bSocialPlaceholder"></div>').closest("#w2bSocialPlaceholder").height(a.outerHeight());a.width(a.outerWidth());e=a.offset().top-$theOffset;b("#w2bSocialFloat iframe[src*=plusone]").closest("div").css("max-width","82px");b(window).scroll(function(){d=b(this).scrollTop();d>=e?a.addClass("w2bFloatSocial"):a.removeClass("w2bFloatSocial");f=b(".post");if(f.length!=0){c=f.outerHeight()+f.offset().top;d>=c?a.stop().animate({top:"-150px"}):a.stop().animate({top:$theOffset+"px"})}else d>=e?a.css("top",$theOffset+"px"):a.css("top","0")})});
/*]]>*/
</script>
<script type="text/javascript" src="https://widcraft.googlecode.com/svn/w2b-blogger-pinit.js"></script>
<script type="text/javascript" src="https://widcraft.googlecode.com/svn/jquery.js"></script>
<script type="text/javascript">
/*<![CDATA[*/
    // Twitter
    (function(a,b,c){var d=a.getElementsByTagName(b)[0];if(!a.getElementById(c)){a=a.createElement(b);a.id=c;a.src="//platform.twitter.com/widgets.js";d.parentNode.insertBefore(a,d)}})(document,"script","twitter-wjs");
    // Google + (plus)
    (function(){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://apis.google.com/js/plusone.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})();
    // Stumbleupon
    (function(){var a=document.createElement("script");a.type="text/javascript";a.async=true;a.src="https://platform.stumbleupon.com/1/widgets.js";var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})();
    // Digg
    (function(){var a=document.createElement("SCRIPT"),b=document.getElementsByTagName("SCRIPT")[0];a.type="text/javascript";a.async=true;a.src="http://widgets.digg.com/buttons.js";b.parentNode.insertBefore(a,b)})();
/*]]>*/
</script>
</b:if>

• Let’s add the final Social horizontal bar widget code. Add this code before <data:post.body/> tag.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id="w2bSocialFloat" class="w2bSocialFloat">
<table  width="100%" class="w2bSocialFloat">
    <tr>
        <td>
            <a href="https://twitter.com/share" class="twitter-share-button" expr:data-url="data:post.url" expr:data-text="data:post.title">Tweet</a>
        </td>
        <td>
            <iframe expr:src="&quot;//www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;send=false&amp;layout=button_count&amp;width=80&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=21&quot;" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:80px; height:21px;" allowTransparency="true"></iframe>
        </td>
        <td>
            <div expr:id="&quot;w2bPinit-&quot; + data:post.id" style="display: none;visibility: hidden;height: 0;width:0;overflow: hidden;" class="w2bPinitButton">
                <data:post.body/>
                <script type="text/javascript">
                    w2bPinItButton({
                        url:"<data:post.url/>",
                        thumb: "<data:post.thumbnailUrl/>",
                        id: "<data:post.id/>",
                        defaultThumb: "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRFeTajLrpW3Ob3OROSkVTJHcqjYWgEQYiB7xij6-xhs-MlLu4luvA8RGzk2ZUHD_jhY0AaCJ5oPUTCHy4fj7rUwE2Y3yIyczyOFnNJwfdOEDTloXopSafrvBATwoIgLl6cLhTOi0iMN8/s1600/bigthumbnail.png",
                        pincount: "horizontal"
                    });
                </script>
            </div>
        </td>
        <td>
            <div class="g-plusone" data-size="medium" expr:data-href="data:post.url"></div>
        </td>
        <td>
            <su:badge layout="1" expr:location="data:post.url"></su:badge>
        </td>
        <td>
            <a class="DiggThisButton DiggCompact"></a>
        </td>
    </tr>
</table>
</div>
</b:if>

Save Template....That's It....

If you found the <data:post.body/> three times, then search for two lines below:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>

Place the Widget code in between the two tags.

Adding Disqus Popular Threads Widget To Blogger

Previously i shared two Disqus widgets. Now it's time to share third widget, which is a way to show some recent popular posts/threads of your blog. I don't have much to say about it right now so let's just get started.You can also use below code on your html document or wordpress.

• Go To Blogger > Layout > Add A Gadget > HTML/JavaScript > Paste below code:

<div id="popularthreads" class="dsq-widget"><h2 class="dsq-widget-title">Popular Threads</h2><script type="text/javascript" src="http://wwefansnation.disqus.com/popular_threads_widget.js?num_items=5"></script></div>

• Replace wwefansnation.disqus.com with your site's Disqus ID.
• Replace 5 with the number of threads your want to display.

Now save and you're done.!!!

Disqus Popular Threads Widget For WordPress:

You can download add Disqus Popular Threads Widget to WordPress with this plugin.

Optimizing Your Blog's Load Time

Your site's loading time is a vital factor in its ability to engage its readers. Our users don't like a site, which takes way to much time to load. Even we like Google Search because it takes very little time to load. Optimizing your blog/site's loading time is a must, and today we'll learn about it. Here comes the Service called PageSpeed Insights.

What is PageSpeed Insights?

PageSpeed Insights analyzes the content of a web page, then generates suggestions to make that page faster. Reducing page load times can reduce bounce rates and increase conversion rates.

Test Your Blog's Score

Go to PageSpeed Insights and Enter the URL and Press Analyze.After a bit of loading you will get a detailed deport discussing your site's loading time. You'll get a lot of reports on where your site's loading time is good or bad. You'll get your report in five parts:

• High priority. These suggestions represent the largest potential performance wins for the least development effort.

• Medium priority. These suggestions may represent smaller wins or much more work to implement.

• Low priority. These suggestions represent the smallest wins. You should only be concerned with these items after you've handled the higher-priority ones.

• Experimental rules. These suggestions are experimental, but do not affect the overall PageSpeed score.

• Already done!. There are no suggestions for these rules, since this page already follows these best practices. Good job!

Now some very important things to consider while optimizing your Score

• Combine images into CSS sprites: This becomes very important if you're using lots of icons on your site.

• Optimize images: Properly formatting and compressing images can save many bytes of data.

• Minify JavaScript: Compacting JavaScript code can save many bytes of data and speed up downloading, parsing, and execution time.

• Place CSS in Head: Any external CSS file should be placed in the <head> tag as it helps in fast rendering of the Page

• Specify image dimensions: Specifying a width and height for all images allows for faster rendering by eliminating the need for unnecessary reflows and repaints.

• Remove Unused CSS and JavaScript: If you're not using a css or javascript then don't forget to remove it.

Here are several reasons of your blog's low speed

• Leverage browser caching: Blogger doesn't give you access to the .htaccess file where you have to set the expiry date for your resources, making them cacheable.

• Default CSS File: Blogger loads a CSS file namely bundle.css ,over which you have no control. This file contains default styling of Blogger widgets.

• Slow Widgets: Remove Gadgets like Facebook Like Box and Followers Gadget, as the images of members that are loaded ,very badly effect Load Times and Page Size.

Every blog has their own different problems and some of them are their publisher networks like Clicksor. Don't forget to leave a comment with your score...!!!

Adding Threaded Commenting System To Blogger

Most bloggers are already using this system on their blog, but i never used it because i'am using Disqus commenting system, which is better than Blogger commenting system. My brother created a blog call My Droid Arena, and he is using this threaded system in his blog.

After using this trick your Blogger comments will have a reply option. Now let's get started:

• Go To Blogger > Template > Edit HTML > Proceed.

• Select (Tick) the "Expand the Widget" Box.

• Search for the following code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <b:include data='post' name='comments'/>
</b:if> 

• Once you find the above code, replace it with the following.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
         <b:if cond='data:post.showThreadedComments'>
           <b:include data='post' name='threaded_comments'/>
         <b:else/>
           <b:include data='post' name='comments'/>
         </b:if>
       </b:if>
       <b:if cond='data:blog.pageType == &quot;item&quot;'>
         <b:if cond='data:post.showThreadedComments'>
           <b:include data='post' name='threaded_comments'/>
         <b:else/>
           <b:include data='post' name='comments'/>
         </b:if>
       </b:if>

Now go ahead and save the template. That's it for this time. You can also customize this system with some css.

Adding Disqus Top Commenters Widget To Blogger

Previously i shared Disqus Recent Comments Widget, which was an awesome way to show some recent comments and this time i'am going to share Top Commenters widget with you guys. It's a great way to show your site's most active commenters. You can also use below code on your html document or wordpress.

• Go To Blogger > Layout > Add A Gadget > HTML/JavaScript > Paste below code:

<div id="topcommenters" class="dsq-widget"><h2 class="dsq-widget-title">Top Commenters</h2><script type="text/javascript" src="http://wwefansnation.disqus.com/top_commenters_widget.js?num_items=5&hide_mods=0&hide_avatars=0&avatar_size=32"></script></div>

• Replace wwefansnation.disqus.com with your site's Disqus ID.
• Replace 5 with the number of commenters your want to display.
• Replace hide_mods=0 with hide_mods=1 if you want to hide moderator's name from this widget.

Now save and you're done.!!!

Disqus Top Commenters Widget For WordPress:

You can download add Disqus Top Commenters Widget to WordPress with this plugin.

GoDaddy Promo Codes : .COM Domain For 0.99$ (Rs. 54)

GoDaddy is back with a superb discount on .COM domains. Get a .COM for just $0.99 (Rs 54). So don't waste your time and score a .COM. You can get a .COM For Rs 54 by clicking here. Happy New Year!!!

Why Choose GoDaddy? :

Go Daddy offers everything you need to make a name for yourself on the Web, from domain names and website builders to complete eCommerce solutions. GoDaddy earned their place as the world's #1 ICANN-accredited domain registrar by delivering world-class products at competitive prices and supporting them with industry-best service, delivered 24/7/365. GoDaddy is proud to serve our customers from locations around the world, including Arizona, Iowa, California, Colorado, Washington, D.C., India, Singapore, and The Netherlands.

So go and get a .COM for $0.99 only by clicking here.

Using Google Web Fonts In Blogger

Every blog needs some perfect fonts to match their content. There are lots of websites where you can get some free and paid fonts, but Google Web Fonts are totally free to use and it's hosted in Google's Server. From this tutorial you'll learn how to use these fonts on your blog, website or anywhere.

Here We Go

First go to Google Web Fonts and select your favorite style by clicking 'Quick Use.'

Now scroll down a bit and you will see a link tag code , copy this code and also copy #2 text (Web Font Family Name) as shown in image below:

Now Go To Blogger > Template > Edit HTML and paste Font Style Sheet just below <head>:

Now search and add the CSS to use this font, just before the ]]></b:skin> tag :

h1 {
font-family: WEB-FONT-NAME ;
}

Replace WEB-FONT-NAME with your web font name which we copied earlier. In this font our web font name is 'Freckle Face', cursive. So make this code like:

h1 {
font-family: 'Freckle Face', cursive;
}