Ikon SVG Dipasang Pada Blogger Begini Caranya !

Scalable Vector Graphics( SVG) merupakan format foto yang memakai XML bagaikan dasar buat membentuk foto vektor 2 ukuran. SVG merupakan format foto yang dibesarkan oleh World Wide Website Consortium semenjak tahun 1999.

Kelebihan memakai ikon SVG 

Ikon Responsif

Sempat memandang kala kita mengganti dimensi browser serta elemen dalam web yang lagi kita buka pula turut berganti dimensi serta susunannya? ini dicoba biar wisatawan senantiasa mempunyai visibilitas konten yang baik, istilahnya merupakan elemen website responsif.

Secara universal, elemen website responsif dicapai dengan mempersiapkan sebagian foto di server dalam dimensi yang berbeda. Ataupun metode lain merupakan dengan memakai font yang memanglah isinya simbol, misalnya fontAwesome. Tetapi semacam yang telah kita bahas pada paragraf diatas, memakai ikon dalam format SVG bisa secara otomatis membiasakan diri supaya cocok dengan dimensi jendela browser Kamu. Dengan format SVG, ikon pada web senantiasa nampak tajam serta lebih hemat tempat pada server.

Kekurangan memakai ikon SVG

Terdapat kelebihan, tentu terdapat kekurangan. Format file SVG bisa jadi tidak bisa ditampilkan pada browser minoritas. Umumnya buat menjauhi ruang kosong sebab permasalahan ini, kita butuh mempersiapkan file bonus dalam wujud JPEG ataupun PNG bagaikan penggantinya. 

Cara Memasang Ikon SVG Di Blog

1. Awal kunjungi web Material Design Icons. 

2. Pilih salah satu, lalu klik icon </>, pilih "View SVG". Kemudian kode untuk menampilkan iconnya muncul.

3. Setelah kodenya didapatkan pasang kode HTML seperti contoh ini.

<svg style="width:24px;height:24px" viewBox="0 0 24 24"> <path fill="#000000" d="M12,4A4,4 0 0,1 16,8A4,4 0 0,1 12,12A4,4 0 0,1 8,8A4,4 0 0,1 12,4M12,14C16.42,14 20,15.79 20,18V20H4V18C4,15.79 7.58,14 12,14Z" /> </svg>

- width:24px;height:24px; Lebar dan Tinggi icon. 

- #000000 Warna icon.

4. Penempatan icon SVG

Penempatan icon SVG ini harus benar-benar menempatkannya contoh ingin menempatkan icon SVG di dekat teks profil <div id="profil"><svg ...><path .../></svg></div>.

Untuk menyesuaikan ikon nya tinggal atur saja Lebar dan Tinggi nya.

Penutup

Itulah cara termudah untuk memasang ikon atau icon svg pada blogger kalian.Jika ada pertanyaan jangan sungkan untuk di tanyakan pada kolom komentar.

Bagikan Artikel ini

Subscribe Our Newsletter