TipRicks network enlarged, follow us on Youtube for regular updates!Subscribe Now ×

How to Make Your Own URL Shortener with JavaScript in Blogger

Are you looking to create your own custom domain branded URL Shortener? learn how to make your own URL shortener with JavaScript in Blogger.


Tipricks, How to Make Your Own URL Shortener with JavaScript in Blogger - As you know there are a lot of URL shorteners that are used you shorten URLs. But they don't allow you to shorten your URL with your branded custom domain. We have found a javascript code to make your own short URL with your custom domain to redirect to different external pages as per your need. Today in this article you will see How to Make Your Own URL Shortener with JavaScript in Blogger?.

How does URL Shortener work?

We use a javascript code to create your own shortened URLs. It can also be termed as simple redirect settings. Like in WordPress you redirect your link to an external domain or page. But blogger custom redirects does not allow you to redirect your link to external link. It only allows you to redirect internally.


Check the above links to see how this script work.If you go to the shortened URL it will take you to our Facebook page.

Limitations:

There is no limitation of this javascript code you can redirect unlimited URLs to any external page or domain with you own branded custom domain.

Benefits:

If you have not set the username for your social accounts than it is very difficult to remember it. For example, you can see our YouTube channel URL.
[https://www.youtube.com/channel/UCjybl3vsBMHJrebHA9ZQG8A]
I can not write it anywhere so I create a short URL for my youtube channel that looks like this:
[http://tipricks.blogspot.com/go/youtube]
Share your Shorted URL everywhere, So that later if you change the URL of your youtube channel you just need to change the URL at one place and everyone starts redirecting to the new URL. Instead, you change the default URL everywhere you have to paste it before.

How to Make Your Own URL Shortener with JavaScript?

To install this script in you blogger blog properly, follow the below steps correctly.
  1. First, go to Blogger >>Template >> Edit HTML.
  2. Now in the template code, search for the <head> tag and paste the below code just below it.
[<script language='javascript'>
//Tipricks URL Shorener
//<![CDATA[
var key = window.location.href.split("go/")[1].replace("/","")
var urls={
    'facebook':'https://www.facebook.com/TipRicks.Official/',
    'gplus':"https://plus.google.com/+Tipricks",
    'twitter':"https://twitter.com/MrTahirHabib",
    'youtube':"https://www.youtube.com/channel/UCjybl3vsBMHJrebHA9ZQG8A",
}
if(key){
    if(urls[key]){
        window.location.href=urls[key]
    }else{
        document.write("'"+key+"' not found :(");
    }
}
//]]>
</script>]

  • [message]
    • ##warning##  Alert
      • To prevent an error. Please paste the above Javascript code below <head> tag, Instead of pasting it above </head> tag. You can read the reason at the last of this post. Thanks!

Customization:

Simply change the links with your links and you are done. You can replace go/ with your any other word and Facebook with fb or the word you want. For example, as in the above code, you can make changes like this.
['facebook':'https://www.facebook.com/TipRicks.Official/']
You can change Facebook with fb to make it shorter. And change the URL with your Facebook page URL. The above code means like this:
[http://tipricks.blogspot.com/go/facebook]
You can add more URLs in the code for example if you want to create the short URL for the Pinterest profile. Your code will look like this.
 [<script language='javascript'>
//Tipricks URL Shorener
//<![CDATA[
var key = window.location.href.split("go/")[1].replace("/","")
var urls={
    'facebook':'https://www.facebook.com/TipRicks.Official/',
    'gplus':"https://plus.google.com/+Tipricks",
    'twitter':"https://twitter.com/MrTahirHabib",
    'youtube':"https://www.youtube.com/channel/UCjybl3vsBMHJrebHA9ZQG8A",
    'pinterest':"https://www.pinterest.com/tipricks",
}
if(key){
    if(urls[key]){
        window.location.href=urls[key]
    }else{
        document.write("'"+key+"' not found :(");
    }
}
//]]>
</script>]
And your short code for Pinterest profile become this:
[http://tipricks.blogspot.com/go/pinterest]
3. After customizing the code Click the Save template\button at the top.

Hope you like the tutorial. Please give us feedback below in comments.If you find any error or mistake please let me know below in comments.


Was this article helpful?

Thanks! Your feedback helps us to improve TipRicks LLC

COMMENTS

BLOGGER: 9
Loading...
You May Like to Read:

Need help? Contact with our support team at +92 30 tip ricks
Name

Agriculture PPT Templates,2,AskTahir,6,Blogger,30,Blogger-SEO,5,Blogger-Templates,1,Blogger-Tutorials,23,Blogger-Widgets,8,Blogging-Tips,2,Computer PPT Templates,1,Creative-PowerPoint-Templates,2,Facebook,4,Free-Mobile-Data,1,Freenom,1,Google-Adsense,3,Google-Analytics,1,How-to-Tutorials,2,Interviews,1,Islamic PPT Templates,1,Medical PPT Templates,1,Mobile-Marketing,1,Motivation,1,MS Word,1,News,4,Oppo-Mobile-Features,1,PDF,1,PowerPoint-Templates,7,SEO,5,Social-Media,6,TrueCaller,1,Twitter,1,Videos,18,Whatsapp,1,Youtube,4,
ltr
item
TipRicks: How to Make Your Own URL Shortener with JavaScript in Blogger
How to Make Your Own URL Shortener with JavaScript in Blogger
Are you looking to create your own custom domain branded URL Shortener? learn how to make your own URL shortener with JavaScript in Blogger.
https://3.bp.blogspot.com/-cUnRJXzGSEw/Wc8o8vos1GI/AAAAAAAAFSs/Pop0xtkm9fk3hcuK8AWx-l3CBtd0B-XdQCLcBGAs/s320/How-to-Make-Your-Own-URL-Shortener-with-JavaScript-in-Blogger.png
https://3.bp.blogspot.com/-cUnRJXzGSEw/Wc8o8vos1GI/AAAAAAAAFSs/Pop0xtkm9fk3hcuK8AWx-l3CBtd0B-XdQCLcBGAs/s72-c/How-to-Make-Your-Own-URL-Shortener-with-JavaScript-in-Blogger.png
TipRicks
https://tipricks.blogspot.com/2016/08/how-to-make-your-own-url-shortener-with-javascript-in-blogger.html
https://tipricks.blogspot.com/
https://tipricks.blogspot.com/
https://tipricks.blogspot.com/2016/08/how-to-make-your-own-url-shortener-with-javascript-in-blogger.html
true
7070217950916442682
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy

Hello, how may we help you? Just send us a message now to get assistance.