Optimalkan Blog Anda! Cara Menambahkan Icon SVG pada Eksternal Link

Meningkatkan tampilan blog adalah langkah penting untuk meningkatkan pengalaman pengguna. Salah satu cara yang efektif adalah dengan menambahkan ikon SVG pada tautan eksternal. Dalam panduan ini, saya akan menjelaskan langkah-langkah untuk menampilkan ikon SVG di bagian akhir link pada postingan blog agar pembaca dapat langsung mengenali bahwa teks tersebut merupakan tautan eksternal.
Mengapa Menggunakan Icon SVG?
SVG (Scalable Vector Graphics) adalah format gambar berbasis vektor yang ringan dan tidak kehilangan kualitas saat diperbesar. Menggunakan icon SVG pada external link memiliki beberapa keuntungan:
- Meningkatkan pengalaman pengguna dengan menandai tautan eksternal.
- Mempercantik tampilan blog dengan ikon yang responsif.
- SEO-friendly, karena ikon tidak memperlambat loading halaman.
2. Ubah Warna Icon SVG
Jika ingin mengubah warna ikon, edit kode warna 989b9f di dalam kode SVG dengan warna yang diinginkan, misalnya 00BFFF untuk warna Biru.
3. Tambahkan Kode HTML ke Postingan
Setelah menambahkan CSS, Anda bisa menggunakan class `extLink` untuk menampilkan ikon di link eksternal. Tambahkan kode berikut di dalam postingan:
<a class="extLink" href="https://www.contohwebsite.com" target="_blank">Kunjungi Situs</a>
Kesimpulan
Dengan mengikuti langkah-langkah di atas, Anda telah berhasil menambahkan icon SVG pada external link di postingan blog. Teknik ini tidak hanya meningkatkan tampilan blog tetapi juga memberikan pengalaman pengguna yang lebih baik.
Jika ada pertanyaan atau kendala, jangan ragu untuk bertanya di kolom komentar. Jangan lupa juga untuk membaca artikel lainnya seputar tips dan trik blogging!
Post a Comment