Well this is a Three Tabbed Comment Form Which Allows the Users to Comment Via Facebook,Twitter and the Default Way i.e Blogger.Well this is an Awesome Widget.So Add this Widget to Your blog.Follow the Below Steps:.
The Things You Need to Do this Task:.
Facebook APP ID
Twitter Consumer Key
Blogger ID
Bit.ly Key (Optional)
How to Get Facebook APP Id :.
Just Create a New Application on Facebook By Going to Facebook Developers And Find Out the Key. Click Here to Go
To get Twitter Consumer Key, make application on Twitter. CLICK HERE.
Note That the access level must be "Read and write".
You Can Find Blogger Id From Dashboard From the Address Bar For Instance
http://www.blogger.com/post-create.g?blogID=549465149461619441616.
Optional : function bit.ly to shorten URL page, bit.ly will be complete twitter comment box in order to fill 140 character. for more detail click here .
Now Adding the Widget to Blogger :.
Go to Blogger < Design < Edit Html .
Now Check Expand Widget Templates.
Now Paste the Below Code After <head> Tag.
Now find code <div class='comments'
Enter the following code after <div class='comments'
Note:
have a Look at the Below Code :.
<div data-bitly-key='BITLY_KEY' data-bitly-login='saikiransama' data-publisher='saikiransama' id='js-tweet-box'/>
You can change this line with <div id='js-tweet-box'></div> if you don't have bitly account.
if you have bit.ly account change my username and BITLY_KEY with your username and key
Save your Template and You're Done. That's it.
Via-Bloggerbelog
The Things You Need to Do this Task:.
Facebook APP ID
Twitter Consumer Key
Blogger ID
Bit.ly Key (Optional)
How to Get Facebook APP Id :.
Just Create a New Application on Facebook By Going to Facebook Developers And Find Out the Key. Click Here to Go
To get Twitter Consumer Key, make application on Twitter. CLICK HERE.
Note That the access level must be "Read and write".
You Can Find Blogger Id From Dashboard From the Address Bar For Instance
http://www.blogger.com/post-create.g?blogID=549465149461619441616.
Optional : function bit.ly to shorten URL page, bit.ly will be complete twitter comment box in order to fill 140 character. for more detail click here .
Now Adding the Widget to Blogger :.
Go to Blogger < Design < Edit Html .
Now Check Expand Widget Templates.
Now Paste the Below Code After <head> Tag.
Now Replace the Red Colored Text With Your Credentials.Replace Profile Id With Your Facebook Profile Id,App id With Your Facebook Application Id That You've Grabbed While Creating the Application on Developers Page,consumer Key Change CONSUMER_KEY with your twitter apps CONSUMER_KEY that created earlier.<meta content='PROFILE_ID' property='fb:admins'/>
<meta content='APP_ID' property='fb:app_id'/>
<script src='http://code.jquery.com/jquery-latest.pack.js'/>
<script src='http://jsblogstop.googlecode.com/svn/commentpages/jsCommentPages.js'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://jsblogstop.googlecode.com/svn/jstweetbox/v1/jsTweetBox.js'/>
<script src='http://platform.twitter.com/anywhere.js?id=CONSUMER_KEY&v=1'/>
Now find code <div class='comments'
Enter the following code after <div class='comments'
<b:if cond='data:blog.pageType != "static_page"'>
<div class='js-default-tab comments-tab' id='blogger-comments' title='Comments from Blogger'>
<data:post.numComments/> Comments
</div>
<div class='comments-tab' id='twitter-comments' title='Comments with Twitter'>
<span class='js-page-tweet-count' expr:href='data:post.url'/> Tweets
</div>
<div class='comments-tab' id='fb-comments' title='Comments made on Facebook'>
<fb:comments-count expr:href='data:post.url'/> Fb Comments
</div>
</b:if>
<div class='clear'/>
</div>
<div class='comments-page' id='twitter-comments-page'>
<div data-bitly-key='BITLY_KEY' data-bitly-login='saikiransama' data-publisher='saikiransama' id='js-tweet-box'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='10' width='500'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
Note:
have a Look at the Below Code :.
<div data-bitly-key='BITLY_KEY' data-bitly-login='saikiransama' data-publisher='saikiransama' id='js-tweet-box'/>
You can change this line with <div id='js-tweet-box'></div> if you don't have bitly account.
if you have bit.ly account change my username and BITLY_KEY with your username and key
Save your Template and You're Done. That's it.
Via-Bloggerbelog
0 comments:
Post a Comment