How to add the Tweet Box on a Blogger Blog? I had a question from Blyke yesterday, asking “how did you get that tweet box under bookmark widget after each post?”
Nice Question,Twitter box can serve to promote our article on Twitter. You can see the example on the bottom of this posting page, you can simply press the Tweet button, or just fill it with your own words. Remember, this is an optional widget and I wouldn't recommend to install it because the script can increases the loading-time. Therefore I'm doing trial for the next few days.
How to add the Tweet Box on a Blogger Blog
1. Go to the @AnyWhere Developers Page and create an Application there with your blog details.
Make Sure that you have checked the Read&Write Option when you Register your Application.
2. When you complete the signup process, you will get some JavaScript codes, with a unique API Key
Copy out the JavaScript from there(the code in the red box) as shown in this Screenshot.
3. Now Login to your Blogger Dashboard ,navigate to the Edit HTML Tab under Design and “Expand your Widget Templates”
4. Find This Code:
</head>
And paste the copied Twitter JavaScript just above that line and save the template.5. Then Find this code:
<data:post.body/>
And immediately below <data:post.body/> code, paste the following JavaScript Code and save your template. (Editable parts are shown in red) <b:if cond='data:blog.pageType == "item"'>
<div id='bp_tweetBox'/>
<script type='text/javascript'>
bp_tweet_link="<data:post.url/>";
twttr.anywhere(function (T) {
T("#bp_tweetBox").tweetBox({
width: 560,
label: "How was your day? Tell me something about your day.",
defaultContent: "RT @jayceocorner <data:post.title/>"+" "+bp_tweet_link
});
});
</script>
</b:if>
<div id='bp_tweetBox'/>
<script type='text/javascript'>
bp_tweet_link="<data:post.url/>";
twttr.anywhere(function (T) {
T("#bp_tweetBox").tweetBox({
width: 560,
label: "How was your day? Tell me something about your day.",
defaultContent: "RT @jayceocorner <data:post.title/>"+" "+bp_tweet_link
});
});
</script>
</b:if>
6. Done, and now you should see the Tweet Box on all of your post pages
Goodluck
