.....

17 Add Automatic ShortURL Widget For Every Blogger Post

This tutorial will explain how to automatically generate short urls (using the bit.lyAPI) for every Blogger post, and display this URL in a box at the bottom of each post .

Now, using bit.ly’s API, Twitter’s default service, we can create and publish short URL’s for every entry on Blogger.




Tutorial Step by Step



1.Login to your Blogger dashboard > Layout > Edit HTML and check the "Expand Widget Templates" box.
As I always say before attempting any tutorial or hack its wise to make a backup of your blogger template. So please download your blogger template.
Now find (CTRL+F) this code in the template:
</head>
And immediately before it, paste this code:

<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&amp;login=YOURUSERNAME&amp;apiKey=YOURAPIKEY"></script>

<script type="text/javascript" charset="utf-8">

BitlyClient.addPageLoadEvent(function(){

BitlyCB.myShortenCallback = function(data) {

// this is how to get a result of shortening a single url

var result;

for (var r in data.results) {

result = data.results[r];

result['longUrl'] = r;

break;

}

document.getElementById("shorturl").innerHTML = "Share this link: &lt;input type='text' value='" + result['shortUrl'] + "' name='bitlyurl'/&gt;";

}

BitlyClient.shorten(document.location, 'BitlyCB.myShortenCallback');

});

</script>



Note: Remember to Replace YOURUSERNAME with your Bit.ly Username and YOURAPIKEY with your bit.ly Api key before you save the code.You will get this both things while you signup to bit.ly.


2. This is an optional step: you can also style this shorturl box. For this, in your template, search for ]]></b:skin> and paste this code right above it:


form#shorturl { color:#666; font-size:11px }#shorturl input { color:#999; border:1px inset #CDCDCD; padding:1px 5px; }



3. Now in third step you need to choose the place for displaying the shorted links.For this Search for the following line in your Blogger Template.but remember to Expand the Template before you proceed.
<div class='post-footer-line post-footer-line-3'>

</div>

Now Paste the following line of code between the above code in your Template.
<b:if cond='data:blog.pageType == "item"'><form id='shorturl'/></b:if>

Now click Save Template




As a result, with the given style sample, in every individual page it looks like this:

bitlybloggershorturl Show Posts short URL in blogger with bit.ly API key





Note: If you want to trakc how many people click on this link then I will tell you how you can do that. You need to be a bit.ly user. Then go to your account and find out your bit.ly login and your own API code. And replace it here ..
login=bitlymmmmm&apiKey=R_2c11203612a1769b97204826413d57f1

Replace bitlymmmmm by your bi.ly login. and R_2c11203612a1769b97204826413d57f1 by your API code provided for your account. This will enable you to track your clicks on this shortened URL.


Free Backlinks for Blog and Website

Do you want to know Where to get free backlinks? This is a free, fast, and simple immediate automatic backlinks for optimizing your blog or web page on search engines result.Everyone knows how important backlinks are to getting a good rank.Here, we offer a backlink for free and very fast for your sites. Copy the html code first (no change needed), and then paste to your website or blog.To view your backlink you can click the image link from your website or blog. And well... your website url done and will be displaying in first references.If any visitors click this banner from your website or blog, your url backlink will be creating automatically in this website.You can build backlink as many as you want, no limitation and restriction, but no spam ! Wish your website's ranking quickly on Top Google, Yahoo and Alexa!

Free Automatic Backlink for Blog and Website

If our Tutorials have helped you a little, then kindly spread our voice using the badge below:- Copy this html code to your website >>
Free Backlinks blogger widgets



Optionally use this Widget installer to add this link to your blogger blog.

* Please note:- After you paste the code into the website, please click on the button to create backlinks to your website. - If you remove the code from your website where your backlink will be deleted automatically. - if you know any free backlink info, please submit here, Let's share the free backlink list to everyone.
submit here

17 Responses So Far:

Fishers Of Men said...

Bdlab ơi ! sao thủ thuật này mình ko áp dụng được cho blog mình vậy Bdlab ... làm thử nhiều lần nhưng vẫn ko được .. nó ko hiện ra như chỉ dẫn ! có thể phản hồi cho mình tại http://fishers-men.blogspot.com nhe! thanks Bdlab

Fishers Of Men said...

Mình làm ko duoc ban tham khao dùm mình nhá ! http://fishers-men.blogspot.com

admin said...

Replace YOURUSERNAME with your Bit.ly Username and YOURAPIKEY with your bit.ly Api key before you save the code.You will get this both things while you signup to bit.ly.


................................


http://bit.ly/pro/products singup now bit.ly Pro

Prabha said...

Free one way backlinks

Check this site for one way backlinks and let your friends know..

Prabhavathi

sopian.sc said...

pagi pagi cari artikel bagus....... trims ya.....sob saya coba ni info nya.....

Precious said...

@sopian.sc

I love your blog lots of useful information. I've added it to my favorite bookmarks and subscribed in a reader.

All these issues are important, and that's why I just started blogging a while ago and it feels great.

Kind Regards
Evelina


stop smoking
quit smoking

Unknown said...

Dear please tell me

How to add related post facility to blogger website?

for this I will be obliged.

Thanks

Arif
-help@arifspj.co.cc

Brenda said...

I like all you posts, they are all very informative and useful. This one is not the exception! Thank you very much for you work and keep up!

alrick said...

i like this, thanks for sharing
http://www.drupalnetworks.com/

a said...

Website about all Sarkari and Government Jobs in Central/State Government, Universities, Public Sector Companies and Banks, jobs, vacancy, opportunity, Government, Government of India, Recruitment, State Government, Central Government, India http://www.sarkari-career.com/

Prediksi Bola said...

Alhamdulillah. . . sudah bisa buatnya . . .

liat aja di Prediksi Bola
http://forecastball.blogspot.com/

Unknown said...

Good . i added it in my blog and your backlink code also :D
http://cyberb0y.blogspot.com | Dark Tech Zone

Anonymous said...

Thanks Man

Taimoor said...

Very nice service at all. I really like Bit.ly because of their stats and simple interface.
Thank you too for writing about it! :)

Anonymous said...

i like this, thanks for sharing
sexyshowgirl0.blogspot.hk/

atif said...

nice

Jelbee said...

working great! :) thanks

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Powered by Blogger