Home
TUTORIAL BLOGGER

Cara Merubah Icon Pada Template "Median UI"

Comment
www.sayaingat.com

Assalamualaikum warahmatullahi wabarakatuh

Selamat pagi semoga sehat semua, alhamdulilah saya bisa posting lagi pada kesempatan kali ini saya akan sedikit berbagi cara merubah Icon yang ada pada template Median UI. untuk template ini saya dapat dari Jago Design - Median UI  Template premium ini sangat cocok banget untuk website, nanti saya akan review tentang template ini. pada dasarnya template ini sudah bagus banget , bahkan untuk socre pada Speed Test Page diatas 90 sehingga template ini sangat ringan dan elegan ( menurut saya ).

Sebelumnya pada Doc Median UI sudah ada tentang kumpulan Icon SVG.
  1. Login Ke Blog
  2. Masuk Menu Tema
  3. Kemudian masuk ke Edit HTML
  4. Kemudian Siapkan Icon yang disediakan oleh Median UI Disini cari Rainbow Icon Pack ( Bulk )
  5. Silahkan Cari kode berikut :

    <!-- <svg class='line' viewBox='0 0 24 24'><g transform='translate(2.400000, 2.000000)'><line x1='6.6787' x2='12.4937' y1='14.1354' y2='14.1354'/><path class='fill' d='M1.24344979e-14,11.713 C1.24344979e-14,6.082 0.614,6.475 3.919,3.41 C5.365,2.246 7.615,0 9.558,0 C11.5,0 13.795,2.235 15.254,3.41 C18.559,6.475 19.172,6.082 19.172,11.713 C19.172,20 17.213,20 9.586,20 C1.959,20 1.24344979e-14,20 1.24344979e-14,11.713 Z'/></g></svg>--></b:includable>

  6. Kemudian ganti dengan kode svg yang sudah kita tentukan sebelumnya. silahkan ganti dengan kode dibawah ini untuk home / beranda

    7. <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path class='c-2' d='M105.29532,264.80613v5.01a5.00181,5.00181,0,0,1-5,5h-10a5.00181,5.00181,0,0,1-5-5v-5.01a5.01833,5.01833,0,0,1,1.6-3.67005l5.68006-5.26a3.98533,3.98533,0,0,1,5.43994,0l5.68005,5.26A5.01834,5.01834,0,0,1,105.29532,264.80613Z' opacity='0.4' transform='translate(-83.29532 -252.80983)'></path><path class='c-1' d='M98.76611,267.81637a.75541.75541,0,0,1-.75.75H92.57617a.75.75,0,1,1,0-1.5h5.43994A.749.749,0,0,1,98.76611,267.81637Z' transform='translate(-83.29532 -252.80983)'></path></svg>

  7. Kemudian klik Save dan liat hasilnya.
Terima kasih semoga bermanfaat, apabila ada yang ingin ditanyakan silahkan kita dikusi di kolom komentar. 



2 comments

  1. mas itu cara ngerubah jadi warna gimana, ko saya ngga jalan ya
  2. kalo ganti logo sv disamping logo header gimana bang. terima kasih