MELVIN DEV DEVELOPING MY OWN LIFE.



Redirecting short link using JavaScript code

When you have added your domain name to the app you are able to create short link based on the Domain Name you added. We are going to create a real example that will redirect our short link to a long link using the JavaScript code the app provide.

On this Tutorial:

  1. Adding Domain Names information
  2. Creating short link and custom link
  3. Using the Redirection JavaScript code on web site
  4. View Domain names and short links created

When we finish this tutorial you will able to use the app and code without problems.


Open Short Link Creator App
On the Start page On the first Tab Add New Domain Name Tap Add New button.

image

It will open the new page Add New Domain Name.
I'm going to use my own domain names that are already active on the internet.
NOTE: YOU NEED TO USE YOUR OWN DOMAIN NAMES IN ORDER TO USE THIS APP, BECAUSE YOU WILL NEED TO PASTE THE CODE ON YOUR WEBSITE.

Adding Domain Names Information

  • On the Domain Name write your domain Name that reference your curren domain name for your website
  • On the Domain For Short Link write the domain name you will use or you are using for short links.
  • When you finish to add your Domain names tap Save button to save the Domain Names.
  • Tap Cancel button to go back to Start Page.

The following image shows the domain information entered. these domain names are owned by Melvin Dev.

image

Creating Short Link

On the Start page On the second Tab Create Short Link Tap Add New button.
It will open the new page Create Short Link.

  • From the Dropdown list select the domain name you added before, Once you select the domain name it will shows the short domain name you use for the domain selected.
  • On the Original Link write or paste the long link you want to create a short link.
  • On the Description write a description about the link, this description will help you to know what the link is about. between others.
  • Tap Create buton to create the short link
    Note: this is a unique short link created and you can see all short link created in the View Domain Names and Short Links from the start page.

The following image shows the information added.

image

Creating Custom Short Link

If you need to create a custom short link check the box Custom Link and the editable Text box will appear next to Short Domain Text box

image

TIP: You can create unlimited short links.

Now we have created our short links, we need to get the developer code and add it to our web site.

Getting The Developer Code and adding it to our web site.

To get the Developer Code you will need to have selected a domain name as you did when you created the short link.

  • On The Create Short Link Page Scroll down to Get Developer Code tab.
  • Tap Get Code button. it will show a menu, on the menu tap JavaScript. to get the JavaScript Code
  • Copy the code
  • Go to your web site and Create a ShortLinkCreator.js JavaScript File
  • Paste the code You Copied in to the ShortLinkCreator.js file and it's all ready. You can now give a short link or share the short link to any social media, when the short link is matched it will be redirected to the long link (Original link).

The following image shows this process

image

image

Copy the code then paste the code on your web site as is suggested by short Link Creator.
NOTE: Each time you create a short link you will need to paste the code on your web site replacing the previous code you have with the new code generated by Short Link Creator app.

View Domain Names and Short Links

When you have added short links to the app as we did in the previous section, all those short link are located in this page. Here you will find The Short link, the Oginal link where the short link is redirected, the description link, the date the link was created, you can share the short link to any social media by tapping the Share button, if you want to share the description link just check the Description check box. to do this, On the Start page On the third Tab Wiew Domain Names and Short Links Tap View button.
It will open the new page Wiew Domain Names and Short Links

  • From the first dropdown list select a Domain Name
  • From the second dropdown list select a date it will match and load all short links created on that date.

The following image shows the short link I created in the first section in this tutorial, the first short link is automatic created by the app. The second short link is the custom short link I created with my own name.

image

NOTE: Before you share the short link you have to make sure you have copied and pasted the Developer Code on your website.

We have finished the tutorial and now you have the knowledge how to use Short Link Creator.





MSDN Github Twitter Facebook Linkedin

© 2018 Melvin Dev