Selasa, Juli 26, 2011

Code jQuery untuk Membuka Link Eksternal di Tab Baru secara Otomatis

Penulis Day Milovich | Selasa, Juli 26, 2011 | 19.47.00 |

Apakah link eksternal itu?

Link eksternal adalah link yang mengarah pada alamat di luar domain (blog) Anda.

Contoh domain blog:
http://daymilovich.blogspot.com/

Kalau dalam sebuah artikel saya memasang link http://kompas.com berarti link itu adalah link eksternal.
Asalkan link tersebut tidak memiliki awalan yang sama dengan alamat domain/blog Anda, berarti itu adalah link eksternal.



Metode Konvensional, tidak Disarankan

Agar sebuah link di luar domain itu dibuka di new window adalah dengan menambahkan

target="_blank"

Contoh code link yang jika diklik akan terbuka di window sendiri:

<a href="http://kompas.com">Harian Kompas</a>

Jika ingin dibuka di tab lain, codenya menjadi:

<a href="http://kompas.com" target="_blank">Harian Kompas</a>

Tentu sangat melelahkan jika setiap menuliskan external link harus selalu menambahkan:

target="_blank"

Mengapa perlu mengarahkan link eksternal di tab baru?

+ agar postingan Anda masih terbuka, tidak tertutup karena pengunjung meng-klik link eksternal
+ meningkatkan page view (jumlah halaman yang dibuka pengunjung), dengan "memaksa" pengunjung untuk membuka postingan Anda yang lain.

Code jQuery untuk Membuka Link Eksternal di Tab Baru secara Otomatis

Masalah membuka link eksternal di tab baru secara otomatis, dapat diatasi dengan code jQuery.
1. Masuk ke Blogger dengan username/email dan password > klik tombol Sign in
2. Klik Design pada blog yang akan di-edit
3. Pilih Edit HTML
4. Pilih Download Full Template untuk membuat backup template Anda yang sekarang
5. Aktifkan tanda cek pada Expand Widget Template
6. Cari code ini:

</head>

Letakkan code berikut ini di atas code </head>

<script src='http://code.jquery.com/jquery-latest.js'/>
<script type='text/javascript'>//<![CDATA[
function jqFixLink() {var strLink = $(this).attr("href");if(strLink != undefined) {if(strLink.search(document.domain) == -1 && strLink.indexOf("http:") != -1) {$(this).attr("target", "_blank");}}}
function jqFixExtLinks() {$("#Blog1 a").each(jqFixLink);}$("#Blog1").ready(jqFixExtLinks);
//]]></script>

7. Setelah selesai,, klik tombol Save Template
---

Catatan:

Jika Anda sudah menempatkan baris code ini sebelum </head>

<script src='http://code.jquery.com/jquery-latest.js'/>

Anda bisa melewatinya, dan hanya perlu meng-copy-paste code setelahnya.
---
Sekarang, jika Anda klik external link dalam postingan Anda, akan terbuka secara otomatis di tab baru. Tanpa perlu code-ulang semua link yang sudah Anda posting. Mudah sekali, bukan?
Enjoy!
---

Tidak ada komentar:

Posting Komentar

Anda bisa berkomentar tanpa perlu login.

 
Day Milovich (c) 2013. Diberdayakan oleh Blogger.