Cara Membuat Icon Eksternal Link dengan Font Awesome

Selamat datang kembali di Demo IdBoegis, Blog yang membahas seputar Tips Adsense, Tips Komputer, Tutorial Blog, SSH Gratis, Tips Youtube, Tips Smartphone dan informasi internet lainnya.

Pada Artikel kali ini kita akan membahas Cara Membuat Icon Eksternal Link dengan Font Awesome, Postingan ini masih berhubungan dengan Artikel Tutorial Blog. Artikel Widget.

Baca juga:

Cara Membuat Icon Eksternal Link dengan Font Awesome

Advertisement

Cara membuat icon font awesome pada semua link keluar secara otomatis - Kali ini blog siabdi akan membagikan cara untuk memasang icon font awesome pada semua link keluar secara otomatis. jadi ketika anda sudah mengikuti langkah-langkah yang akan saya berikan di bawah, anda tidak perlu lagi repot-repot memasang / membuat icon font awesome satu per-satu pada setiap link keluar, karena pada dasarnya cara yang akan saya berikan ini akan bekerja secara otomatis.

Sebelumnya saya sudah membagikan cara mengenai cara mencegah semua internal link terbuka di tab baru secara otomatis, bagi anda yang ingin membaca artikelnya silahkan anda baca artikel saya sebelumnya. Langsung saja, di bawah ini saya akan memberikan cara membuat icon font awesome pada semua link keluar secara otomatis, bagi anda yang tertarik untuk memasangnya di blog silahkan ikuti langkah-langkah di bawah ini.

Cara Membuat Icon Eksternal Link dengan Font Awesome

1. Pertama silahkan sobat login terlebih dahulu ke halaman dashboar blog sobat.
2. Silahkan masuk ke halaman Template -->> Edit template
3. Selanjutnya silahkan cari kode </head> gunakan kombinasi CTRL+F untuk memudahkan pencarian.
4. Setelah kode di atas anda temukan, kemudian silahkan letakkan kode di bawah ini tepat di atas kode </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/*<![CDATA[*/
.post-body a[href^="http://"],.post-body a[href^="https://"]{padding-right:25px;display:inline-block;color:#e8554e}
.post-body a[href^="http://"]:before,.post-body a[href^="https://"]:before{content:'\f08e';font-family:FontAwesome;color:#e8554e;position:absolute;bottom:0;right:0;}
.post-body a[href^="http://siabdi.blogspot.co.id"]:before,.post-body .separator a:before{content:'';}
.post-body a[href^="http://siabdi.blogspot.co.id/"],.post-body .separator a{padding-right:0!important}
.post-body a{position:relative;font-weight:bold;color:#e8554e}
.post-body .separator a{margin:0!important}
/*]]>*/
</style>
</b:if>

Keterangan : Silahkan ganti http://siabdi.blogspot.co.id dengan url blog anda.

5. Silahkan simapan template dan lihat hasilnya.

Demikian artikel kali ini mengenai cara membuat icon eksternal link dengan font awesome. Semoga artikel yang sederhana di atas bermanfaat, selamat mencoba :)