Cara Membuat SafeLink Di Blog Utama Dengan Mudah

Google Image: Safelink Converter
Halo sahabat blogger yang setia di blogfile9.com, dihari ini sesuai dengan tema kita akan bahas tentang "Cara Membuat Safe Link Di Blog Utama Dengan Mudah". Diantara kalian dan sebagian para pembaca pasti sudah tau apa itu Safelink? tapi kita akan bahas lagi disini ya.

Nah Safelink merupakan sebuah halaman pada website atau blog yang difungsikan untuk mendeteksi apakah url/link yang dituju aman atau tidak dari virus dan malware, singkatnya safelink adalah halaman peralihan sebelum pengguna pergi kehalaman yang dituju.

Safelink itu sendiri biasanya kita bisa temukan di blog atau website yang berbasis download, tetapi kebanyakan dari safelink yang digunakan tidak berada pada satu blog atau website, melainkan kebanyakan dari mereka mengguna blog atau website lain yang mereka punya sebagai tempat safelink. Apa ada pengaruhnya? Pastinya ada contohnya adalah pendaftaran Google Adsense lagi yang rumit yang dimana harus menggunakan domain berbayar. Jadi kali ini sesuai dengan judul, Safelink akan kita taruh di blog utama saja.

Skenario dan Manfaat Safelink

Cara kerjanya hampir sama dengan safelink lain hanya saja laman safelinknya tetap berada pada domain utama. Skenarionya ketika pengunjung ingin mendownload file tertentu dalam blog, mereka akan diarahkan ke laman tertentu dari blog tersebut sebelum akhirnya menuju ke laman download file tersebut.
Sumber: www.jagodesain.com
Ada banyak manfaat yang bisa didapat dari safelink versi ini beberapa diantaranya adalah :

  • Tidak perlu membuat blog baru dan membeli domain baru
  • Lebih mudah untuk di kostumisasi
  • Tetap dalam blog Utama, artinya otomatis menambah angka visitor di blog utama
  • Meningkatkan pagerank blog karena visitor meningkat
  • Mengurangi bounce rate dari blog utama
  • Sarana penempatan adsense untuk menambah penghasilan blog.
  • 100% Aman karena masih dalam satu domain dengan blog utama

Tutorial Safelink Di Blog Utama

Tutorial ini akan dibagi menjadi dua bagian, bagian pertama membuat page/laman safelinknya dan bagian kedua edit source atau kode blog nya. Disini kita menggunakan blogger karena itu tutorial ini juga lebih diutamakan untuk pengguna blogger, untuk pengguna layanan lain bisa menyesuaikan dengan tutorial ini.

Step 1 - Membuat Laman Safelink
  1. Pertama-tama buatlah sebuah laman blogger tidak harus halaman static, laman posting pun bisa digunakan untuk safelink ini. Kemudian simpan laman tersebut lalu edit kembali 'dalam mode html'
  2. Dibawah sudah disiapkan template yang bisa Anda gunakan untuk layout laman safelink nya jadi hanya perlu copy paste kode script dibawah ini pada laman safelink yang sudah Anda buat.

<div class='separator-text' style='text-align:center'>
<div class='ads-top'>
<!-- Isi Kode Adsense Anda --></div>
<a class='button1' href='#golink'>Klik 2x untuk menuju link</a></div>
<div class='separator-text'>
<!-- Tulis Konten Artikel Anda Disini --></div>
<div id='golink' class='separator' style='text-align:center'>
<div id='ads-left' class='ads-left'>
<!-- Isi Kode Adsense Anda --></div>
<div class='safelink' dir='ltr' trbidi='on'>
<div>
<span id='daplong' class='button1'>Please Wait...</span></div>
<script>var currentURL=location.href; var str = currentURL; var res = str.replace("https://www.alamatblog.com/p/safelink.html?url=", ""); document.write('<button id="download" class="visit-link button1" onclick="changeLink();" style="display:none;">Menuju Link</button>')</script></div>
<div id='ads-right' class='ads-right'>
<!-- Isi Kode Adsense Anda --></div>
</div>
<div class='clear'>
</div>
  • Letakkan artikel dan kode Adsense Anda pada bagian yang sudah di tandai. Rekomendasi ukuran adsense yang sesuai adalah responsive untuk bagian atas dan 336x280 pada bagian kiri dan kanan safelink.
  • Jangan lupa untuk menyalin url/link laman yang sudah Anda buat diawal tadi dan ganti url pada kode diatas dengan url laman safelink Anda.
  • Anda juga bisa mengubah kalimat pada tombol link sesuai keinginan Anda dengan cara mengubah kalimat 'Menuju Link' yang sudah kami tandai.
  • Direkomendasikan blog Anda support 'https' karena hal ini akan berpengaruh dengan eksperience dari pengunjung.
Simpan kembali laman Anda abaikan jika seandainya ada pesan eror 'HTML Anda tidak bisa diterima: Tag putus: BUTTON' atau sebagainya dengan cara klik tutup pada notifikasi, sampai disini tahap pertama sudah selesai dan silahkan lanjut ketahap kedua. Perlu diperhatikan bagian kedua ini akan sedikit rumit jadi perhatikan dengan teliti karena jika sedikit saja ada kesalahan maka safelinknya tidak akan berfungsi.


Step 2 - Final

Silahkan edit template anda dalam mode 'edit HTML' penjelasan singkatnya silahkan klik tema dan klik edit html seperti pada gambar dibawah ini; Jika perlu backup terlebih dahulu template Anda untuk menghindari kesalahan pengeditan.

Sumber: www.jagodesain.com
1. CSS

Kode CSS ini berfungsi untuk menampilkan layout pada laman safelink dan untuk menyembunyikan widget safelink agar tidak tampil pada blog.
/* Safelink */
.button1{display: inline-block;padding: 6px 20px;margin: 15px 0 10px 0;border: 1px solid #ddd;font-size: 13px;color: #414141;border-radius: 30px;cursor: pointer;transition:  all 0.3s ease}
.button1:hover{background-color: #EA6D23;border-color: #EA6D23;color: #fff}
.ads-top{padding: 5px 0 15px 0;text-align: center}
.ads-left,.ads-right{display: inline-block;float: left;margin: 5px 15px 0 0}
.ads-right{float: right;margin: 5px 0 0 15px}
.visit-link,#daplong{margin-right: 0;padding: 7px 30px;line-height: 25px;font-family: Lato, sans-serif;transition: all 0.3s ease-in-out}
.visit-link{padding: 7px 50px}
#HTML99,#HTML99 .widget-content{border: 0!important;margin: 0!important;padding: 0!important}
/* Responsive */
@media screen and (max-width: 768px){.ads-left,.ads-right{display: block;float: none;margin: 5px 0 0;text-align: center}}
2. Javascript

Cari kode </head> pada blog Anda dan letakkan kode dibawah ini tepat diatas kode </head>:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<script>/*<![CDATA[*/ var currentURL=location.href; var str = currentURL; var res = str.replace("//www.alamatblog.com/p/safelink.html?url=", ""); $(".visit-link").hide(); function changeLink(){var decodedString = Base64.decode(res); window.open(decodedString,'_blank')} function generate() {var linkDL = document.getElementById("download"), btn = document.getElementById("btn"), notif = document.getElementById("daplong"), direklink = document.getElementById("download").href, waktu = 5; var teks_waktu = document.createElement("span"); linkDL.parentNode.replaceChild(teks_waktu, linkDL); var id; id = setInterval(function () { waktu--; if (waktu < 0) { teks_waktu.parentNode.replaceChild(linkDL, teks_waktu); clearInterval(id); notif.style.display = "none"; linkDL.style.display = "inline-block"; } else { teks_waktu.innerHTML = "Link akan tampil dalam" + waktu.toString() + " Detik"; btn.style.display = "none";}}, 1000);} /*]]>*/</script>
<script>/*<![CDATA[*/ var uri = window.location.toString(); if (uri.indexOf("%3D","%3D") > 0) { var clean_uri = uri.substring(0, uri.indexOf("%3D")); window.history.replaceState({}, document.title, clean_uri);} var uri = window.location.toString(); if (uri.indexOf("%3D%3D","%3D%3D") > 0) { var clean_uri = uri.substring(0, uri.indexOf("%3D%3D")); window.history.replaceState({}, document.title, clean_uri);} 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 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>
  • Ubah url pada kode diatas dengan url laman safelink Anda serta hapus 'https:' pada url safelink Anda sebagaimana kode diatas, tujuannya Adalah agar pengunjung 'non-https' tetap bisa mengakses laman safelink Anda dengan otomatis redirect ke mode 'https'.
  • Angka 5 pada kode diatas adalah parameter waktu (detik) ditampilkannya link tujuan, Anda bisa mengubahnya menjadi lebih cepat atau lambat. Anda juga bisa mengkostumisasi teks waktu yang tampil dengan mengubah bagian 'Link akan tampil dalam '.
  • Baris kedua dari kode diatas berfungsi untuk menghapus kode '&m=1' yang biasanya muncul ketika laman diakses melalui mobile, jika kode '&m=1' tidak dihapus maka safelink tidak akan berfungsi ketika ketika pengunjung mengaksesnya memalui platform mobile. Kode ini juga berfungsi untuk mengalihkan pengunjung melalui 'http' ke 'https'. Jika blog Anda belum disetting support 'https' maka Anda bisa menghapus bagian;
3. Buat Widget Baru

Carilah bagian widget sidebar dari template Anda yang biasa ditandai dengan kode <b:section> atau <b:widget silahkan cari pada template Anda kode seperti ini. Tambahkan widget baru dengan cara copy paste code dibawah.

Jika Anda kesulitan silahkan cari kode </b:widget></b:section> pada template Anda dan tempatkan kode dibawah ini tepat di tengah kode tersebut menjadi </b:widget>isi kode dibawah</b:section>

<b:widget cond='data:view.isSingleItem' id='HTML99' locked='false' title='Safelink' type='HTML' version='1'>
  <b:widget-settings>
    <b:widget-setting name='content'/>
  </b:widget-settings>
  <b:includable id='main'>
    <div class='widget-content'>
      <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(/rn/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 encode=document.getElementById('encode'),decode=document.getElementById('decode'),output=document.getElementById('output'),input=document.getElementById('input');var User_ID="";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 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("http")) {a_to_vh=true;} j++;} if(a_to_vh==false) {var encryptedUrl=Base64.encode(a_to_vi);a_to_ve[i].href="https://www.alamatblog.com/p/safelink.html?url="+ encryptedUrl;a_to_ve[i].rel="nofollow";a_to_vb++;a_to_vc+=i+":::"+ a_to_ve[i].href+"n";}} var a_to_vj=document.getElementById("anonyminized");var a_to_vk=document.getElementById("found_links");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>
      <script>/*<![CDATA[*/ protected_links = "facebook.com,fb.me,instagram.com,plus.google.com,twitter.com";auto_safelink(); /*]]>*/</script>
    </div>
  </b:includable>
</b:widget>
  • Letakkan kembali url laman safelink Anda pada bagian yang sudah ditandai.
  • Secara default semua link eksternal akan diarahkan ke laman safelink, tambahkan beberapa situs pengecualian seperti laman facebook blog Anda dan sebagainya pada bagian 'protected_links', pisahkan dengan koma (,) jika ingin menambahkan beberapa situs pengecualian.
  • cond='data:view.isSingleItem' membuat widget hanya tampil pada halaman posting dam statis, tidak akan tampil pada halaman lain.
4. HTML

Untuk menjalankan script ini ketika blog di load, Cari Kode <body pada template Anda lalu tambahkan kode dibawah ini kedalam tag <body tersebut:

//Sebelum

<body>
//tambahkan onload='generate()' <body onload='generate()'>

5. Klik dan Simpan Template Anda

0 Response to "Cara Membuat SafeLink Di Blog Utama Dengan Mudah"

Post a Comment

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

close