Wednesday, October 21, 2015

Cara Membuat Semua Eksternal Link di Blog Terbuka pada New Tab Window

Cara Membuat Semua Eksternal Link di Blog Terbuka pada New Tab Window
Ada sebuah pertanyaan menarik terkait link pada blog. Dapatkah membuat link yang secara otomatis terbuka pada tab baru (new tab) tanpa harus disetting secara manual?


Pada dasarnya pada default blogger telah disediakan mengenai link ini. Bisa diatur agar terbuka pada window yang sama, atau bisa pula disetting agar terbuka pada tab baru saat link tersebut diklik. Selengkapnya sahabat bisa menuju ke artikel Cara Membuat Link di Blog untuk Mengaitkan Antar Halaman dan Postingan.

Manfaat eksternal  link terbuka pada new tab

Biasanya klik open in new tab digunakan untuk eksternal link, sedangkan untuk internal link memakai settingan terbuka pada window yang sama. Salah satu tujuan penggunaan internal link yang terbuka pada window yang sama adalah menjaga reader untuk tetap menjelajah blog tanpa harus menutup window. Sehingga bounce rate blog akan terjaga dengan baik. Selain itu juga, overall pageviews juga akan naik.

Cara agar eksternal link terbuka pada new tab

Tutorial blogging kali ini adalah bagaimana cara membuat SEMUA eksternal link yang terdapat dalam blog secara otomatis terbuka pada tab window baru. Cara ini tidak berefek pada internal link blog, akan tetapi hanya fokus pada eksternal link dan juga external hostnames saja. Berikut caranya.

1. Masuk ke akun blogger, menuju ke Template. Sebelum menuju ke mode HTML saya sarankan untuk backup template terlebih dahulu untuk berjaga-jaga. Lalu klik Edit HTML.
2. Letakkan kode script di bawah ini tepat di atas </head>.

script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() { 
  $("a[href^='http://']").each( 
    function(){ 
     if(this.href.indexOf(location.hostname) == -1) { 
        $(this).attr('target', '_blank'); 
      } 
    } 
  );
$("a[href^='https://']").each( 
function(){ 
if(this.href.indexOf(location.hostname) == -1) { 
$(this).attr('target', '_blank'); 


);
  
});

</script>

Catatan: jika template telah terinstall kode JQuerry, maka jangan mengikutsertakan kode warna merah, atau dihapus saja.

Akhiri dengan Save template.

Silakan lihat hasilnya pada blog milik sahabat. Apakah setiap link eksternal telah benar-benar terbuka pada new tab baru saat diklik.

Perlu diketahui, bahwa cara ini sangat responsive dan kompatibel dengan semua browser.

Demikian cara membuat semua eksternal link terbuka pada new tab window. Semoga bermanfaat dan selamat mencoba.

4 comments:

  1. Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
    Jika ya, silahkan kunjungi website ini www.kumpulbagi.com untuk info selengkapnya.

    Di sana anda bisa dengan bebas share dan mendowload foto-foto keluarga dan trip, music, video, filem dll dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)

    ReplyDelete
  2. Cara mengetahui ada atau tidaknya jquery gimana gan ?

    ReplyDelete
  3. di blog saya ada 48 external link, dan itu katanya tidak baik bagi kesehatan blog. apakah dengan cara ini bisa meminimalisir bahaya yang ditimbulkan, seperti penalty dari google misalnya? atas perhatiannya saya ucapkan terima kasih.

    ReplyDelete

Setiap komentar yang masuk akan dimoderasi. So, waspadalah.