-->

How to integrate Google URL shortener API with Blogger blogs

URL Shortener has integrated with Google private browsing way, it shows neat stats and it automatically generates QR codes, it’s fast, it hardly goes down But, Goo.gl did not provide an official API for blogger and plenty of applications did not support it. Twitter clients automatically shorten links after posting on it like t.co/xxxx, and many of browser extensions create short links, while CMS plugins convert the links so that people can share them.
Google URL shortener API with Blogger
Now alternative applications will use Goo.gl because there is an official API that is quite simple to use and contains substantial limit more than 1,000,000 requests per day. You will use the Google URL Shortener API to programmatically move with this service and to develop applications that use straightforward protocol strategies to store, share, and manage Goo.gl short URLs. The API helps you to produce short links, rewrite Goo.gl links, and browse stats and appearance up a user's history.

integrate Google URL shortener API with Blogger:
If you want to short all of your blog posts at same page then follow below steps one by one.
  1. Go to your Blogger blog.
  2. Now Navigate to Pages >> New Page >>Blank Page.
  3. Switch it to HTML mode.
  4. Paste below code in the post body.
<style>
#btn {
    background: none repeat scroll 0% 0% #0F83A0;
    color: #FFF;
}
#content-wraapper {
    width: 95%;
    margin: 0px auto;
    padding: 5px;
    text-align: left;
    background: none repeat scroll 0% 0% #8AB7E9;
    border: 5px solid #000016;
    border-radius: 20px;
}
</style>
<script src="https://apis.google.com/js/client.js" type="text/javascript"> </script>
<script type="text/javascript">
function makeRequest() {
var Url = document.getElementById("longurl").value;
var request = gapi.client.urlshortener.url.insert({
'resource': {
'longUrl': Url
}
});
request.execute(function(response) {
if (response.id != null) {
str = "<b>Long URL:</b>" + Url + "<br>";
str += "<b>Test Short URL:</b> <a href='" + response.id + "'>" + response.id + "</a><br>";
document.getElementById("result").innerHTML = str;
}
else {
alert("Error: creating short url \n" + response.error);
}
});
}
function load() {
gapi.client.setApiKey('AIzaSyCDZAgEd-MvhrrlkyiytMlCosNvRph921o');
gapi.client.load('urlshortener', 'v1', function() { document.getElementById("result").innerHTML = ""; });
}
window.onload = load;
</script>
<br />
<div id="content-wraapper">
<center>
<h2>
 URL Shortener using Google API. http://goo.gl </h2>
<table>
<tbody>
<tr>
<td>Enter URL:</td>
<td><input id="longurl" name="url" size="30" type="text" value="http://www.LabLance.com" />
</td>
</tr>
<tr>
<td></td>
<td><input id="btn" onclick="makeRequest();" type="button" value="Get Short URL" /></td>
</tr>
<tr>
<td colspan="2"><div id="result" style="background: #ffffff; border-width: .1em .1em .1em .8em; border: solid gray; overflow: auto; padding: .2em .6em; width: auto;">
</div>
</td>
</tr>
</tbody></table>
</center>
</div>
Save the changes >> Done.


DEMO Page

No comments