Membuat Semua Link Eksternal Terbuka Di Window Gres Otomatis (Jquery) - Pendidikan Blog

Kita sering menggunakan fitur membuka link di window gres pada interface link Blogger di saat menghasilkan post, atau menambahkan atribut link (hyperlink) target="_blank". Untuk beberapa langkah manual, pasti ini bukan masalah. Tapi bila anda sudah memiliki banyak link eksternal, baik di bab post maupun bab lain, misalnya widget, footer, dll, pasti pekerjaan edit menjadi hal yang menyantap waktu lama. Selain itu, link eksternal yang terbuka di window sama akan memajukan bounce rate, sehingga dapat meminimalisir banyak penilaian, utamanya ranking alexa.

Script ini cukup sederhana, berupa jquery, yang difungsikan untuk menjalankan cek link eksternal di dalam suatu halaman situs web lalu menginjeksikan target="_blank" pada setiap link eksternal yang didapatkan pada halaman tersebut. Kaprikornus sebenarnya script ini tidak hanya melakukan pekerjaan di Blogger, tetapi dapat di banyak sekali platform website/blog, misalnya WordPress (meski anda akan menemui plugin sejenis dengan mudah).

Cara Menambahkan Script Pembuka Link Eksternal Otomatis

Cukup ikuti beberapa langkah sederhana ini:

1. Seperti biasanya, bila anda sudah memiliki jquery source code, abaikan script pada bab pertama dan pribadi copy script yang kedua. Jika belum, copy keduanya dan letakkan secara berurutan. Jika tidak percaya apakah anda sudah memiliki jquery source code, cari di dalam template dengan keyword jquery dan lihat apakah sudah memiliki source code sejenis.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>

 (abaikan script di atas bila sudah punya yang sejenis)

<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>

 2. Buka dashboard Blogger > Template > Edit HTML

3. Cari </head> (cara mencari kode di template editor Blogger)

4. Letakkan script yang sudah dicopy tepat di atas </head>.

5. Save template and done!

Anda dapat cek link eksternal pada blog yang belum memiliki atribut target="_blank", atau coba buat link eksternal gres tanpa atribut target. Cek apakah script bekerja.

Catatan Singkat: Bagaimana Script Bekerja & Info Tambahan

Jika anda memperhatikan script, disitu ada perintah cek dua kali, yakni pada link berawalan http:// dan https:// (secure connection protocol), artinya script juga melakukan pekerjaan pada host dan link esternal sejenis yang menggunakan secured connection protocol, misalnya WordPress dan banyak sekali platform situs web yang dihosting sendiri.

Conditional tag (if) digunakan untuk mengajukan persyaratan/cek kedua protocol tersebut, dan bila nilainya sama dengan -1, maka link yang mesti dicari (disyaratkan) merupakan link yang tidak berada di dalam host yang serupa (bukan link yg menuju website/blog anda), alias bersifat eksternal (External Links).

Setelah link-link sesuai standar ditemukan, maka disisipkan / diinjeksikan atribut target="_blank" [{$(this).attr("target","_blank")}].

Logikanya, alasannya value -1 memiliki arti merupakan link yang tidak berada di host yang serupa (link yang tidak menuju website/blog anda), maka value 1 memiliki arti sebaliknya (nilai positif), yakni bila diubah dari -1 ke 1, maka semua link internal anda akan terbuka di window baru.

Jika anda mengharapkan semua link, baik internal maupun eksternal terbuka di window gres (meski aku tidak menyarankan), tidak perlu menggunakan script demikian, cukup gunakan tag base targettting berikut dan letakkan di dalam tag head (sebelum </head>):

<base target="_blank"/>

Simak selengkapnya dalam cara menghasilkan link terbuka di window/tab baru.

That's it, and have a nice blogging, fellow brothers and sisters ;)

© copyright Ahmad Khoirul Azmi, published only for buka-rahasia.blogspot.com.