Di blog saya sebelumnya (ignalies.com), saya pernah membagikan script URL shortener menggunakan API Bitly. Tapi sayangnya metode pemendek tautan menggunakan API Bitly kurang efektif bagi kamu pengguna akun GRATIS karena terdapat limit yang sangat sedikit untuk memendekkan tautan secara otomatis menggunakan API. Oleh karena itu, di artikel kali ini saya akan membagikan tutorial cara membuat alat short link generator menggunakan API Key Short.io sebagai alternatif yang lebih efektif.
Apa Itu Short.io?
Bagi yang belum tahu apa itu Short.io, Short.io merupakan situs yang menyediakan layanan penyingkat URL menggunakan metode "custom domain" yang memungkinkan kamu dapat memendekkan tautan menggunakan domain kamu sendiri. Karena menggunakan metode "custom domain", berarti kamu harus memiliki domain sendiri yang terhubung ke CNAME Short.io.
Jika kamu tidak memiliki domain sendiri, kamu bisa membeli short domain dari situs Short.io langsung dan nantinya kamu akan mendapatkan sebuah domain untuk dijadikan sebagai layanan short link generator. Untuk harganya mulai dari $3 per bulan.
Kenapa Menggunakan API Key Short.io Lebih Efektif?
Ada beberapa alasan kenapa menggunakan Short.io untuk membuat layanan pemendek tautan sendiri lebih efektif daripada menggunakan Bitly. Ya, karena fitur-fitur yang diberikan di situs Short.io jauh lebih banyak dan mudah dipersonalisasikan sesuai keinginan pengguna. Selain gratis, berikut beberapa fitur unggulan yang ada di situs Short.io:
Limit Untuk Memendekkan Tautan Menggunakan API Lebih Banyak
Di situs Short.io, kamu bisa memendekkan tautan menggunakan layanan API Key Short.io sebanyak 10 hingga 50 tautan per detik dan 1000 tautan dalam satu kali permintaan. Untuk informasi lebih detail mengenai limit API Short.io, kamu bisa baca di halaman berikut:
Bisa Mengatur Jumlah Karakter Pada Slug Tautan
Ini termasuk salah satu fitur unggulan yang ada di Short.io. Kita dapat menentukan berapa jumlah karakter pada slug tautan yang akan dibuat ketika memendekkan tautan. Minimal jumlah karakternya adalah 1 karakter dan maksimalnya adalah 12. Semakin sedikit jumlah karakter slug yang dibuat, tentunya akan semakin mudah diingat. Dan kamu juga bisa menentukan sendiri slug tautan khusus pada setiap tautan yang telah dipendekkan.
cara-membuat-blog
Bisa Menggunakan Hingga 5 Branded Domain di Akun Gratis
Di situs Short.io, kamu bisa menambahkan hingga lima branded domain atau short domain dalam satu akun gratis. Saya kurang tahu berapa jumlah maksimal yang dapat ditambahkan ke akun gratis. Tapi saat ini, saya memiliki hingga empat domain di akun gratis saya. Tentu ini menjadi kelebihan yang sangat berguna jika kamu membutuhkan banyak pilihan short domain untuk layanan URL shortener kamu.
Cara Membuat Alat Shorten URL Menggunakan API Key Short.io
Untuk bisa membuat alat pemendek tautan menggunakan API Key Short.io, tentunya kamu harus sudah memiliki minimal satu short domain di akun Short.io kamu. Untuk cara menambahkan domain baru ke akun, kamu perlu menambahkan CNAME baru pada DNS yang mengarah ke cname.short.io
.
Saya tidak akan bahas detail cara membuat akun serta cara menambahkan domain baru ke akun Short.io, tapi saya hanya akan membahas cara membuat API Key baru saja. Karena jika dibahas semua, artikelnya akan terlalu panjang. Berikut cara membuat API Key Public Short.io untuk membuat alat URL shortener sendiri.
Membuat API Key Short.io Baru
- Pertama, login ke akun Short.io kamu.
- Di halaman dashboard, klik menu navigasi garis tiga di bagian kiri atas.
- Kemudian pilih menu
Integrations & API
. - Setelah itu klik tulisan
Create API Key
untuk membuat API Key baru. - Tentukan deskripsi singkat (opsional) dan pilih domain yang akan digunakan. Dan jangan lupa aktifkan pengaturan
Public Key
agar API Key dapat diintegrasikan dengan JavaScript. Setelah itu klikCreate
untuk membuat API Key Public baru. - Jika API Key sudah muncul, jangan lupa salin terlebih dahulu API Key tersebut karena API Key tersebut tidak dapat dilihat lebih dari satu kali. Jadi simpan API Key dengan baik dan jangan sampai hilang.
Membuat Alat URL Shortener di Blog
Setelah berhasil mendapatkan API Key Short.io, langkah selanjutnya mengintegrasikan API Key tersebut dengan kode JavaScript URL shortener dan membuat halaman statis baru di Blogger. Berikut adalah script short link generator menggunakan API Key Short.io.
Untuk kode CSS, saya hanya sediakan kode CSS dasar saja. Kamu bisa sesuaikan lagi kode CSS yang ada dengan template blog kamu.
- HTML
- CSS
- JS
<div class="shorten">PILIH DOMAIN:</div>
<select class="opsiDomain radius" id="domain-selection">
<option value="one">www example1.com</option>
<option value="two">www example2.com</option>
<option value="three">www example3.com</option>
</select>
<div class="shorten">ORIGINAL URL:</div>
<div class="ignelius-shortlink">
<input class="radius" type="url" id="input-url" placeholder="Gunakan 'http://' atau 'https://'" />
<button class="btn-utama" id="shorten-button">GENERATE URL</button>
</div>
<div class="shorten">HASIL SHORTLINK:</div>
<input class="radius" type="url" id="output-url" readonly="" />
<button id="copy-button">SALIN URL</button>
<button id="open-url">BUKA URL</button>
<button class="outline" id="delete-button">HAPUS</button>
<!--[ Credit Script - Jangan Dihapus ]-->
<div id="igneliuscom"></div>
<style>
/* css shortlink generator with api key short.io by ignelius.com */
:root {
--titleTeks: #2f2f2f; /* warna teks */
--bodyBg: #f2f2f2; /* warna background elemen input dan select */
--fontC: 'Roboto', sans-serif; /* jenis font untuk elemen input dan select */
}
.radius {
border-radius: 7px;
}
.shorten {
font-size: 16px;
font-weight: bold;
color: var(--titleTeks);
}
input#input-url,
input#output-url,
select.opsiDomain {
background-color: var(--bodyBg);
}
input#input-url,
input#output-url,
input[type="url"]#input-url,
input#output-url::placeholder,
select.opsiDomain {
font-family: var(--fontC);
}
input#input-url,
input#output-url,
select.opsiDomain {
padding: 1rem 1.25rem;
margin: 1rem 0;
width: 100%;
height: 50px;
overflow: scroll;
border: none;
}
button.outline:active {
background-color: var(--primary);
color: var(--invertColor);
}
select.opsiDomain {
opacity: .8;
margin-bottom: 1.5rem;
}
.ignelius-shortlink {
display: grid;
grid-template-columns: 1fr auto;
grid-gap: 10px;
align-items: center
}
@media (max-width:600px) {
.ignelius-shortlink {
grid-template-columns: 1fr
}
}
</style>
<script>//<![CDATA[
// SHORT LINK GENERATOR API SHORT.IO V2 BY IGNELIUS.COM (UPDATED : 8 AUG 23)
var igneliusShortURL = {
credit: {
name: 'www.ignelius.com',
visibility: 'visible' // credit script ubah jadi "hidden" untuk menyembunyikan
},
domain: {
one: 'www.example1.com',
two: 'www.example2.com',
three: 'www.example3.com'
},
apikey: {
one: 'pk_S7gxxxxxxxxxxx',
two: 'pk_S6nxxxxxxxxxxx',
three: 'pk_J6gxxxxxxxxxxx'
},
message: {
copied: 'Tautan berhasil disalin!',
invalid: 'Tautan tidak valid!',
kosong: 'Tautan masih kosong!',
unshorten: 'Tautan belum dibuat!'
}
}
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('O k=v,p=v,m=v;!j($,x){g t=v,e=v,n=v,r=$();I(;;)1e{g u=-z(t("2f"))/1+-z(e("2g"))/2*(z(n("2h"))/3)+-z(e("2i"))/4+z(n("2j"))/5+-z(n("2k"))/6*(z(t("2l"))/7)+z(e("2m"))/8*(z(e("2n"))/9)+z(n("2o"))/10;s(1f===u)2p;r.W(r.1g())}1h(i){r.W(r.1g())}}(P,1f);g B={};O E=A.2q("2r-1i"),1j=A[k("J")+"2s"](k("2t")+"2u"),F=A["1k"+k("G")]("2v-1i"),1l=A[k("J")+p("G")](m("2w")+"n"),1m=A[m("J")+m("G")](p("2x")+m("2y")),X=A[m("J")+m("G")](p("2z")+"2A"),1n=A[p("J")+m("G")](p("2B"));Y.1o(k("1p")+m("Z"))&&(B=11.2C(Y.1o(p("1p")+p("Z"))));O 1q=2D()=>{g $=p,x=m,t=m,e={2E:j($,x){h $!==x},1r:$("2F"),2G:j($,x){h $(x)},2H:$("2I"),2J:$("2K"),2L:j($,x){h $===x},2M:"1s",2N:j($,x){h $===x},2O:t("12"),2P:t("1t"),2Q:j($,x,t){h $(x,t)},2R:$("2S")+t("2T")+x("2U")+$("2V"),2W:t("2X"),2Y:"2Z"+$("30"),31:"32"+t("Z")},n=E[$("C")];s(!n){s(e[t("33")](e.1r,e[x("34")])){35.13=36[37][38];h}e[$("1u")](Q,y.1v[t("39")]);h}s(!n.3a(e[x("3b")])&&!n[$("3c")](e[$("3d")])){e[x("1u")](Q,y.1v.3e);h}g r=X[x("C")];s(B[r]&&B[r][n]){F[t("C")]=B[r][n];h}g u,i;e[x("3f")](e[t("3g")],r)?(u=y[t("14")][$("3h")],i=y.1w.1s):e[x("3i")](e[x("3j")],r)?(u=y[t("14")][x("12")],i=y[x("1x")][x("12")]):e[$("3k")]===r&&(u=y[x("14")].3l,i=y.1w[$("1t")]);g f={};f[$("1x")]=i,f[x("3m")+"L"]=n;g o=1y(1y e[t("3n")](3o,e[x("3p")],{3q:e[x("3r")],3s:{"3t-3u":e[x("3v")],3w:u},3x:11.1z(f)}))[x("3y")]();B[r]||(B[r]={}),B[r][n]=o[$("1A")],Y[t("3z")](e[$("3A")],11.1z(B)),F[x("C")]=o[x("1A")]},1B=()=>{g $=m,x=m,t={};t.3B=$("3C");g e=t;F[$("3D")](),A.3E(e[$("3F")]),Q(y[x("K")][$("3G")])},1C=()=>{g $=k;E[$("C")]="",F[$("C")]="",X[$("3H")+"3I"]=0};1j[p("M")+k("15")]("1D",1q),1l[m("M")+m("15")](p("1E"),1B),1m[p("M")+"1F"]("1D",1C),E[k("M")+"1F"](p("3J"),()=>{g $=k,x=p;E.13=E[$("C")][x("3K")+"e"]()});O 1G=()=>{g $=p,x=p,t={3L:$("1H"),1I:j($,x){h $(x)}},e=F[$("C")];e?R.1J(e,t[$("3M")]):t.1I(Q,y[$("K")][x("1K")])};j 1L($,x){g t=k,e=k,n=k,r={3N:j($,x){h $!==x},3O:j($,x){h $(x)},3P:t("1M")+e("3Q")+t("1N")+" )",1O:j($,x){h $!==x},3R:e("3S"),3T:n("3U")+"+$",1P:j($,x){h $===x},3V:"3W",3X:j($,x){h $!==x},3Y:n("1H"),3Z:j($,x){h $(x)},40:n("41"),42:j($,x){h $+x},1Q:n("1R")+n("1S"),43:"44",45:"46",47:t("48"),1T:n("49"),4a:"4b",1U:t("4c"),4d:e("4e"),4f:j($,x,t){h $(x,t)},1V:j($){h $()},1W:j($,x,t){h $(x,t)}},u=j(){g $={4g:j($,x){g t=v;h r[t("4h")]($,x)}},x=!0;h j(t,e){g n=v,r=v;s($[n("4i")]("4j",n("4k"))){g u=x?j(){s(e){g $=e[r("S")](t,H);h e=N,$}}:j(){};h x=!1,u}{g i=4l[r("S")](4m,H);h 4n=N,i}}}(),i=r[e("4o")](u,q,j(){g $=n,x=t;s($("1R"),$("1S"),r[x("4p")],r.1O("4q",r[x("4r")]))h i.17()[$("4s")](r[n("1X")])[x("18")]()[$("1Y")+"r"](i).4t(r[x("1X")]);4u=19.4v(4w,19[$("4x")]+19.4y+");")()});r.1V(i);g f=j(){g $=n,x=n;s(r[$("4z")](x("4A"),"4B")){4C(4D[x("K")][e("4E")]);h}{g t=!0;h j(e,n){g u=x;s(r.1P(r[u("4F")],$("4G"))){g i=t?j(){s(n){g $=n.4H(e,H);h n=N,$}}:j(){};h t=!1,i}{g f=4I?j(){s(4J){g $=4K[u("S")](4L,H);h 4M=N,$}}:j(){};h 4N=!1,f}}}}(),o=r.1W(f,q,j(){g $=e,x=e,n=t,u={1Z:j($,x){g t=v;h r[t("4O")]($,x)},4P:r[$("4Q")],4R:j(x,t){h r[$("4S")](x,t)},4T:r.1Q,4U:j($,x){h $!==x},4V:r[x("4W")]};s(r[$("4X")]!==r[x("4Y")]){g i=j(){g t=x,e=$,n=x,r;1e{t("4Z")!==u[t("50")]?r=51(u[n("52")](u[n("53")]+(e("1M")+\'54("55\')+t("1N")+" )",");"))():(56.57(),58[n("59")+"d"]("5a"),u.1Z(5b,5c[e("K")].5d))}1h(i){s(u[t("5e")](u[e("5f")],e("5g")))r=R;T s(5h){g f=5i[t("S")](5j,H);h 5k=N,f}}h r}(),o=i[x("20")]=i[$("20")]||{},a=[r.1T,r[n("5l")],n("5m"),r.1U,r[n("5n")],n("5o"),x("5p")];I(g l=0;l<a[$("5q")];l++){g d=f[$("1Y")+"r"].U[n("5r")](f),c=a[l],b=o[c]||d;d[$("5s")]=f.21(f),d[n("18")]=b[n("18")].21(b),o[c]=d}}T{g 1a=5t.13;1a?5u.1J(1a,r[$("5v")]):r[n("5w")](5x,5y[n("K")][n("1K")])}});o();V a=A["1k"+n("G")]($);h a||(R[n("22")][n("5z")]=x),a}j P(){g $=["5A","5B","5C","5D","5E","5F","5G","5H","5I","5J","5K","5L","5M","5N","5O","5P","5Q","5R","5S","5T","5U","5V","5W","5X","5Y","5Z","60","61","62","63","65","66","67","68","69","6a","6b","6c","6d","6e","6f","6g","6h","6i","6j","6k","6l","6m","6n","6o","6p","6q","6r","6s","6t","6u","6v","6w","6x","6y","6z","6A","6B","6C","6D","6E","6F","6G","6H","6I","6J","6K","6L","6M","6N","6O","6P","6Q","6R","6S","6T","6U","6V","6W","6X","6Y","6Z","70","71","72","73","74","75","76","77","78","79","7a","7b","7c","7d","7e","7f","7g","7h","7i","7j","7k","7l","7m","7n","7o","7p","7q","7r","7s","7t","7u","7v","7w","7x","7y","7z","7A","7B","7C","7D","7E","7F","7G","7H","7I","7J","7K","7L","7M","7N","7O","7P"];h(P=j(){h $})()}j v($,x){g t=P();h(v=j(x,e){g n=t[x-=7Q];s(7R 0===v.23){V r=j($){g x="",t="",e=x+r;I(g n=0,u,i,f=0;i=$.7S(f++);~i&&(u=n%4?64*u+i:i,n++%4)&&(x+=e.24(f+10)-10!=0?7T.7U(7V&u>>(-2*n&6)):n))i="7W+/=".7X(i);I(g o=0,a=x.1b;o<a;o++)t+="%"+("7Y"+x.24(o).17(16)).7Z(-2);h 80(t)};v.25=r,$=H,v.23=!0}g u=t[0],i=x+u,f=$[i];s(f)n=f;T{g o=j($){q.26=$,q.D=[1,0,0],q.27=j(){h"81"},q.28="\\\\w+ *\\\\(\\\\) *{\\\\w+ *",q.29="[\'|\\"].+[\'|\\"];? *}"};o.U.2a=j(){g $=82(q.28+q.29),x=$.83(q.27.17())?--q.D[1]:--q.D[0];h q.2b(x)},o.U.2b=j($){h 84(~$)?q.2c(q.26):$},o.U.2c=j($){I(g x=0,t=q.D.1b;x<t;x++)q.D.W(2d.85(2d.86())),t=q.D.1b;h $(q.D[0])},87 o(v).2a(),n=v.25(n),$[i]=n}h n})($,x)}s(1n[k("M")+m("15")](k("1E"),1G),y[p("1c")]&&k("88")+"89.8a"===y[k("1c")].8b){V $=A[k("8c")+k("8d")]("a");$.1d=k("8e")+"w.8f"+p("2e"),$.8g=m("8h")+"8i",$[k("8j")].8k=y[k("1c")][k("8l")]||m("8m");V x=1L("8n",$.1d);x[m("8o")][k("8p")+"8q"]($,x)}T R[p("22")].1d="8r://8s"+m("8t")+m("2e");',62,526,'||||||||||||||||let|return||function|_0x540fdd||_0x10b9b7|||_0x1a4628|this||if|||_0xe32a|||igneliusShortURL|parseInt|document|shortenedUrls|0xc4|RhbAQC|inputUrl|outputUrl|0xda|arguments|for|0x8a|0xb6||0xb3|null|const|_0x2ecf|alert|window|0xb0|else|prototype|var|push|domainSelection|localStorage|0x108||JSON|0x103|value|0xbf|0xa6||toString|0x100|qEnxBN|_|length|0xa2|href|try|808886|shift|catch|url|shortenButton|getElement|copyButton|deleteButton|openButton|getItem|0xa5|shortenUrl|idYBZ|one|0xf6|0xc5|message|domain|0xf8|await|stringify|0x94|copyUrl|clearFields|click|0x109|stener|openShortLink|0xfa|ywRoa|open|0x92|igneliusCreditJS|0xbe|0xfd|kLwnM|tpOzA|RmDSl|0x9c|0x9e|LVejd|CkNAq|sUrKJ|UeQCO|0xec|0xc3|hosws|0x9f|bind|0xb2|FzwGrk|charCodeAt|sUJzEq|ixqCMa|JfFpKo|TdCJrI|vIKZSH|phJHjj|aQPqQV|unrXEM|Math|0xbc|0xaf|0xb7|0xf4|0xdd|0xe6|0xfc|0xce|0x105|0x97|0xe4|break|getElementById|input|ById|0xad|tton|output|0xa4|0xff|0xdc|0xb9|ection|0xf7|parse|async|hPIMo|0xe9|sPofK|VGkDB|0xf3|RMVco|0xef|cTDRc|aUhpC|rDdJL|oHmxk|jWrFN|QjFhi|SqyDt|0x88|0xf5|0x96|0x9d|jQPwv|0x89|pleFN|applicatio|0x110|gWtnE|shortenedU|0x93|0x101|_0x31fbe1|_0x26d8e7|_0x5dbf9b|_0x3c2c03|0x10e|includes|0xe1|0xe5|0xa7|invalid|0xc8|0xca|0xaa|0xd0|0xeb|0xed|three|0x9a|0x8e|fetch|0xf0|method|0xb8|headers|Content|Type|0xe3|Authorization|body|0xc7|0xcb|0xd9|npAMI|0x91|0xa1|execCommand|0xd3|0xc2|0x87|dex|0xf9|0x99|ixytp|0x8d|dJxxn|YMbLf|ofRil|0xbb|UkeLp|0x10f|ZJRqN|0xd1|QFFrI|kelPs|ZtZHm|NIgiJ|gGuOR|rbxwO|0xf1|mXiCn|JxEcC|bCqxC|sAYlw|guUNe|cBZwl|0xd8|0xfb|qJqVv|warn|0x8f|aQVUJ|0xc0|wVoqh|AFJeF|0xab|0xe8|jPGvO|0xcc|_0x4660e4|_0x2d5932|_0xf055fa|0x111|0xd6|EDYgC|0xd4|0xac|search|_0x1ba921|HaSMl|_0x3a620c|0xa9|rzFdg|0x8c|0x8b|yOWPR|_0x542f34|_0x4bd008|0xc9|0xa8|0xba|apply|_0x4267fb|_0x354d86|_0x344d7b|_0xd28d48|_0x3f61de|_0x5aa44d|0xb4|qbZds|0xea|RjqEj|0x102|iDMWi|IoJZY|pFJSG|0xc1|0x10d|0xb1|0xcd|0x106|Function|0xdb|0xae|ctor|retu|_0xa3c63f|select|_0x301b35|0xa3|copy|_0x176d3e|_0x1a34eb|copied|0x10b|0xe7|0xdf|_0x1eb2e2|_0x3c2b74|_0x385ae6|_0x15cdcd|0xa0|0xfe|0x90|0x107|0x95|0xbd|0xee|0xe2|_0x55068a|_0x4c7d31|0xd5|0xcf|_0x1e926d|_0x58c260|0xb5|Cezku0C|quzkzuy|BLr0y08|CMj4D08|B0HTEgS|wKPsCu4|ALDYrK4|yMLUza|Ahr0Chm6lY8|u3f5rhq|ywjrBKG|DMLZAwjPBgL0Eq|Ahr0CdOVlW|m2H2y3fkqG|As5ZAg9YDc5JBq|DgHYzwu|B3bLBI11CMW|zg9TywLU|Aw5WDxq|x2jSyw5R|Bg9N|mJGXmti3nNHVzw9tAG|CM4GDgHPCYiPka|Aw5MBW|zgvSzxrLlwj1Da|Dg9tDhjPBMC|AwrzqLO|BvHPq24|DhDV|DMLZAwjSzq||odCYruntD2DO|CwjAzhm|DgfIBgu|CMXZ|y2XPy2S|CgfYzw50tM9Kzq|sw9kwLK|D3D3lMLNBMvSAq|C0fzBhC|A29ZB25N|rwfRvfu|BI9QC29U|D1zVCwG|C2vSzwn0zwrjBG|Ahr0Chm6lY9HCa|ue9tva|z2v0rwXLBwvUDa|Eu9xufi|wNrAsg0|AxH5Dha|uwPgAgK|zxjYB3i|yvfwvuO|y29WEq|Dw5ZAg9YDgvU|Afbjtw8|C2HVCNrvuKW|DhjHy2u|l2XPBMTZl3b1yG|nZyXmJjsBgvwsKu|y3jLyxrLrwXLBq|Dg9mB3DLCKnHCW|B3jPz2LUywXvuG|C3r5Bgu|CMv0DxjUicHMDq|BgLJ|BMn0Aw9UkcKG|y29UC29Szq|CuPXvNy|C2vSzwn0|y3jLzgL0|zxHLy0nVBw1HBG|y29WEs1IDxr0BW|C2HVCNrLBMvKvq|C3rLBMvY|uK1wy28|uuzgCKK|uwDsywu|B25L|zeP4Eg4|C2vHCMnO|C2HVCNrLBI1IDq|Aurnv2K|mZKXmtG1rvrhAgr4|yxbWBhK|y0jAD2W|Bg9JyxrPB24|ywrKrxzLBNrmAq|z0D1t1i|AhjLzG|BwvZC2fNzq|ndu2nJe0s2XLDeTi|ALfqD3y|zg9TywLUlxnLBa|A2vSuhm|y3rVCIGICMv0Dq|lMnVBq|BgvUz3rO|E30Uy29UC3rYDq|yxbPA2v5|zxHJzxb0Aw9U|sNHfy0m|y29WAwvK|y29UC3rYDwn0BW|DMfSDwu|C1bVzKS|DY5Pz25LBgL1CW|ANnVBG|y1reuMm|Aw52ywXPza|yvvOCem|C2v0sxrLBq|sK9TtK4|qunuyvy|n0vJz0H3Bq|wu1Itgy|CKrKsKW|kcGOlISPkYKRkq|AwDUzwXPDxmUyW|BNbbtuK|vwTLtha|tKLNAuO|B2zsAwW|zw50|rgT3rfe|z1D0BKu|qNLjza|uMPXrwO|Dg9U|ndyWndG4oe9SA1bvqW|Ahr0Chm6lY93DW|ALzLq2y|CMvWBgfJzunOAq|vKDRrei|x19WCM90B19F|CgXLrK4|mJaYntq0mdbrA2HMAM4|Aw5JBhvKzxm|ntaZotiWtxjluLjf|135|void|charAt|String|fromCharCode|255|abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789|indexOf|00|slice|decodeURIComponent|newState|RegExp|test|Boolean|round|random|new|0x10c|us|com|name|0x98|0xd7|0xde|ignelius|textContent|0xd2|om|0x9b|visibility|0xf2|0x104|igneliuscom|0x10a|0xe0|ld|https|ww|0xc6'.split('|'),0,{}))
//]]></script>
Perhatikan pada bagian konfigurasi domain
dan apikey
dalam kode JavaScript. Masing-masing nama domain dan apikey
1, 2 dan 3 harus sama dan sesuai dengan yang ada di akun Short.io kamu. Jika nilainya tidak sama, maka script tidak akan berfungsi.
Penutup
Itu dia tutorial cara membuat short link generator di blog menggunakan API Short.io yang bisa saya bagikan di artikel kali ini. Oh ya, pada JavaScript di atas, saya sengaja menambahkan beberapa opsi pilihan domain bagi kamu yang membutuhkan lebih dari satu domain untuk membuat URL shortener di blog. Jika kamu hanya ingin menggunakan satu domain saja, kamu bisa kosongkan domain 2 dan 3 kemudian hapus juga opsi pilihan domain yang ada pada elemen <option>
. Semoga bermanfaat.
Riwayat Pembaruan (Changelog)
Untuk mendapatkan update produk versi terbaru, kamu bisa kunjungi halaman produk.
v2.1 (30-06-2024)
- Perubahan kode JavaScript menggunakan asynchronous dan penambahan lazy load JS.
- Perbaikan bug lainnya.
v2.0 (10-03-2024)
- Perbaikan script dengan menyesuaikan SdK API Short.io terbaru.
- Penambahan fungsi / tombol "OPEN URL" dan "HAPUS".
- Perbaikan bug pada tombol "SALIN" yang sering tidak berfungsi.
v1.0 (29-01-2024)
- Rilis.
3 komentar