Cara Membuat Safelink di Blog Utama dengan Mudah

Arsipbiru.com - Pada kesempatan kali ini, saya akan membagikan tutorial bagaimana cara membuat safelink di blog utama dengan mudah. Sebelum itu, mungkin sebagian dari kalian pernah mendengar istilah safelink. Safelink biasa dijumpai pada website dengan tema unduhan (download), baik aplikasi hingga anime. Safelink merujuk pada sebuah halaman yang terdapat pada suatu website atau blog yang difungsikan untuk mendeteksi apakah link yang dituju aman dan terhindar dari adanya virus maupun malware. Dengan kata lain, safelink adalah halaman pengalihan sebelum user pergi ke halaman yang dituju.

Sayangnya, safelink yang sering dijumpai adalah safelink dengan domain yang berbeda. Tidak berada di halaman blog utama. Sehingga hal ini menjadi salah satu kekurangan safelink jenis ini. Beda halnya dengan safelink yang berada di blog utama. Banyak manfaat yang didapatkan apabila safelink ini berada di blog utama antara lain tidak perlu membuat blog baru atau membeli domain baru, lebih mudah dikustomisasi, menambah angka visitor di blog utama, meningkatkan pagerank blog utama, mengurangi bounce rate, menambah penghasilan blog, dan keamanan terjamin karena berada satu domain dengan blog utama.

Meskipun banyak manfaat yang didapat, safelink jenis ini juga tidak luput dari kekurangan. Kekurangan safelink jenis ini adalah mengubah semua link eksternal menjadi encode dan diarahkan ke laman safelink, termasuk link sosial media, link blog utama, bahkan link blog lain (bukan situs download).

Salah satu cara untuk menutupi kekurangan safelink tersebut adalah dengan menambahkan setiap situs yang tidak ingin diarahkan ke safelink di dalam daftar situs pengecualian (protect link from encode). Situs yang sudah berada di dalam daftar situs pengecualian tidak akan diarahkan ke safelink, sehingga tetap menunjukkan link awal dan bukan hasil encode.

Cara Membuat Safelink di Blog Utama dengan Mudah

Untuk membuat safelink jenis ini akan dibagi menjadi dua tahap. Tahap pertama adalah membuat halaman safelink dan tahap kedua adalah menambahkan script safelink dan mempercantik tampilan safelink.

Tahap Pertama Membuat Safelink di Blog Utama

1. Pertama, masuk ke akun Blogger masing-masing.

2. Lalu, pilih tab menu Halaman > tambahkan Halaman Baru.

3. Selanjutnya, beri nama halaman baru tersebut. Misal, Safelink atau semacamnya.

4. Kemudian, pilih mode HTML, bukan mode Compose.

5. Masukkan kode berikut ini ke dalam kotak yang tersedia dan publikasikan.

<div class='ad-placement'>

  <!--[ Your_ad_code_here ]-->

</div>

<div class='safelink-button' id='safelink'>

  <div style='text-align: center'>

    <div class='button outline' id='safelink-wait'>Please wait...</div>

    <script>/*<![CDATA[*/ var currentURL = location.href; var str = currentURL; var res = str.replace('https://your_blog_address.com/p/safelink.html' + '?url=', " "); function changeLink(){ var decodedString = Base64.decode(res); window.open(decodedString, '_blank')}; document.write('<a href="#getLink" id="safelink-download" class="button">Create link</a>'); var linkDL = document.getElementById("safelink-download"); var notif = document.getElementById("safelink-wait"); var time = 5; var textTime = document.createElement("span"); linkDL.parentNode.replaceChild(textTime, linkDL); var id; id = setInterval(function () { time--; if (time < 0) { textTime.parentNode.replaceChild(linkDL, textTime); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { textTime.innerHTML = "Link will appear in " + time.toString() + " second"; }}, 1000); /*]]>*/</script>

  </div>

</div>

<div class='safelink-content'>

  <!--[ Write_your_content_here ]-->

</div>

<div class='safelink-create' style='text-align:center'>

  <div class='ad-placement'>

    <!--[ Your_ad_code_here ]-->

  </div>

  <div id='getLink'>

    <a class='button' href='javascript:;' onclick='changeLink();' rel='noreferrer noopener' target='_blank'>Get link</a>

  </div>

  <div class='ad-placement'>

    <!--[ Your_ad_code_here ]-->

  </div>

</div>

Keterangan:

Tahap Kedua Membuat Safelink di Blog Utama

/* Safelink */

:root {

--link-outline-color: #48525c ;

--link-bg-color: #204ecf ; // Warna background tombol link

}

.button{display: inline-flex;align-items: center;margin: 15px 15px;padding: 10px 20px;outline: 0;border: 0;border-radius: 2px;color: #fefefe;background-color: var(--link-bg-color);font-size: 14px;white-space: nowrap;overflow: hidden;max-width: 100%;line-height: 2em}

.button.outline{color: var(--link-outline-color);background-color: transparent;border: 1px solid #ebeced}

.button.outline:hover{border-color: var(--link-bg-color)}

.safelink-button, .safelink-create > *{margin: 1.8em 0}

.safelink-button span{display: block;font-size: 12px}

#getLink{margin: 5px 0}

#getLink .button{display: none}

#getLink:target .button{display: inline-flex}

3. Selanjutnya, tambahkan kode JavaScript berikut ini di atas kode </head>. Kode berikut ini berfungsi untuk menghapus kode '?m=1' yang biasanya muncul ketika laman diakses melalui perangkat mobile. Jika kode tersebut tidak dihapus maka safelink tidak akan berfungsi ketika pengunjung mengaksesnya melalui perangkat mobile. Kode ini juga mengalihkan pengunjung melalui 'http' ke 'https'.

<b:if cond='data:view.isPage'>

  <script>/*<![CDATA[*/ var uri = window.location.toString(); if (uri.indexOf("?m=1","?m=1") > 0) {var clean_uri = uri.substring(0, uri.indexOf("?m=1"));window.history.replaceState({}, document.title, clean_uri); }; var protocol = window.location.protocol.replace(/\:/g,''); if(protocol == 'http'){ var url = window.location.href.replace('http','https'); window.location.replace(url);} /*]]>*/</script>

</b:if>

4. Tahap selanjutnya adalah menambahkan script untuk encode link di atas atau sebelum kode </body>. Script ini berfungsi mengubah semua link eksternal pada blog menjadi Base64.

<b:if cond='data:view.isSingleItem'>

  <script>/*<![CDATA[*/ var Base64 = {_keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789", encode: function (input) {var output = ""; var chr1, chr2, chr3, enc1, enc2, enc3, enc4; var i = 0; input = Base64._utf8_encode(input); while (i < input.length) {chr1 = input.charCodeAt(i++); chr2 = input.charCodeAt(i++); chr3 = input.charCodeAt(i++); enc1 = chr1 >> 2; enc2 = ((chr1 & 3) << 4) | (chr2 >> 4); enc3 = ((chr2 & 15) << 2) | (chr3 >> 6); enc4 = chr3 & 63; if (isNaN(chr2)) {enc3 = enc4 = 64;} else if (isNaN(chr3)) {enc4 = 64;} output = output + this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);} return output; }, decode: function (input) {var output = ""; var chr1, chr2, chr3; var enc1, enc2, enc3, enc4; var i = 0; input = input.replace(/[^A-Za-z0-9\+\/\=]/g, ""); while (i < input.length) {enc1 = this._keyStr.indexOf(input.charAt(i++)); enc2 = this._keyStr.indexOf(input.charAt(i++)); enc3 = this._keyStr.indexOf(input.charAt(i++)); enc4 = this._keyStr.indexOf(input.charAt(i++)); chr1 = (enc1 << 2) | (enc2 >> 4); chr2 = ((enc2 & 15) << 4) | (enc3 >> 2); chr3 = ((enc3 & 3) << 6) | enc4; output = output + String.fromCharCode(chr1); if (enc3 != 64) {output = output + String.fromCharCode(chr2);} if (enc4 != 64) {output = output + String.fromCharCode(chr3);} } output = Base64._utf8_decode(output); return output;}, _utf8_encode: function (string) {string = string.replace(/\r\n/g, "\n"); var utftext = ""; for (var n = 0; n < string.length; n++) {var c = string.charCodeAt(n); if (c < 128) {utftext += String.fromCharCode(c);} else if ((c > 127) && (c < 2048)) {utftext += String.fromCharCode((c >> 6) | 192); utftext += String.fromCharCode((c & 63) | 128);} else {utftext += String.fromCharCode((c >> 12) | 224); utftext += String.fromCharCode(((c >> 6) & 63) | 128); utftext += String.fromCharCode((c & 63) | 128); }} return utftext;}, _utf8_decode: function (utftext) {var string = ""; var i = 0; var c = c1 = c2 = 0; while (i < utftext.length) {c = utftext.charCodeAt(i); if (c < 128) {string += String.fromCharCode(c); i++;} else if ((c > 191) && (c < 224)) {c2 = utftext.charCodeAt(i + 1); string += String.fromCharCode(((c & 31) << 6) | (c2 & 63)); i += 2;} else {c2 = utftext.charCodeAt(i + 1); c3 = utftext.charCodeAt(i + 2); string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63)); i += 3;}} return string; }}; var protected_links = ""; var a_to_va = 0; var a_to_vb = 0; var a_to_vc = ""; function auto_safelink() {auto_safeconvert();}; function auto_safeconvert() {var a_to_vd = window.location.hostname; if (protected_links != "" && !protected_links.match(a_to_vd)) {protected_links += ", " + a_to_vd;} else if (protected_links == "") {protected_links = a_to_vd;} var a_to_ve = ""; var a_to_vf = new Array(); var a_to_vg = 0; a_to_ve = document.getElementsByTagName("a"); a_to_va = a_to_ve.length; a_to_vf = a_to_fa(); a_to_vg = a_to_vf.length; var a_to_vh = false; var j = 0; var daftarPostingan = [ "https://your_blog_address.com/p/safelink.html" ]; var randomPostingan = daftarPostingan[Math.floor(Math.random()*daftarPostingan.length)]; var a_to_vi = ""; for (var i = 0; i < a_to_va; i++) {a_to_vh = false; j = 0; while (a_to_vh == false && j < a_to_vg) {a_to_vi = a_to_ve[i].href; if (a_to_vi.match(a_to_vf[j]) || !a_to_vi || !a_to_vi.match("https")) {a_to_vh = true;} j++; } if (a_to_vh == false) {var encryptedUrl = Base64.encode(a_to_vi); a_to_ve[i].href = randomPostingan + "?url=" + encryptedUrl; a_to_ve[i].rel = "noopener noreferrer"; a_to_vb++; a_to_vc += i + ":::" + a_to_ve[i].href + "\n";} } var a_to_vj = ""; var a_to_vk = ""; if (a_to_vj) {a_to_vj.innerHTML += a_to_vb;} if (a_to_vk) {a_to_vk.innerHTML += a_to_va;} }; function a_to_fa() {var a_to_vf = new Array(); protected_links = protected_links.replace(" ", ""); a_to_vf = protected_links.split(","); return a_to_vf;}; /*]]>*/</script>
    <!--[ Protect link from encode ]-->

  <script>protected_links = "facebook.com, instagram.com, twitter.com"; auto_safelink(); </script>

</b:if>

Keterangan: