Membuat Icon External Link Dengan jQuery

Berikut Cara Membuat Icon Link External

1. Login ke akun Blogger anda

2. Pilih Layout > Edit HTML

3. Cari kode </head>, lalu paste kode berikut di atasnya:

<!-- EXTERNAL LINKS ICON -->
<style>
.exlicon img {
border:0;
padding:0;
margin:0
} /* kode ini bisa anda pindahkan tepat di atas kode ]]></b:skin> */
</style>

<SCRIPT src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/> <!-- jika di template anda sudah terdapat script jQuery 1.3.2, maka anda tidak perlu lagi menambahkan kode ini -->

<script type='text/javascript'>
$(document).ready(function() {
$('.exlicon a').filter(function() {
return this.hostname && this.hostname !== location.hostname;
}).after(' <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVErVK35fO4M02nBHbGNjiRMcy9B41cnZ_MXA_DIgTjrZRJGzTs6llNGYdAX52cURHPEe2B-YDBO498b2eVzGQmrXL_T2NCaCoPaDxxAqc65GvLYfjCvySrVZ1wGD1lusRau6mA4acZeo/s400/icon.gif" alt="external link" />');
});
</script>
<!-- EXTERNAL LINKS ICON -->

Keterangan:
- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVErVK35fO4M02nBHbGNjiRMcy9B41cnZ_MXA_DIgTjrZRJGzTs6llNGYdAX52cURHPEe2B-YDBO498b2eVzGQmrXL_T2NCaCoPaDxxAqc65GvLYfjCvySrVZ1wGD1lusRau6mA4acZeo/s400/icon.gif adalah url icon.

4. Cari kode <data:post.body/>, ganti kode tersebut dengan:

<div class='exlicon'><data:post.body/></div>

5. Terakhir, klik Save Template.

Untuk demonya bisa anda lihat disini.

Selamat mencoba...