Cara Memasang Favicon Blogger Support Dial Browser

Kebingungan logo favicon tidak muncul pada dial browser? Simak artikel berikut ini untuk mengetahui cara mengatasinya.

Fernn.id - Hai sob, kali ini saya ingin berbagi lagi seputar blogging tetapi yang ringan-ringan dulu ya? yaitu Cara Memasang Favicon Blogger supaya Support Dial semua Browser dan beserta sedikit penjelasan tentang manfaatnya.

Pada umumnya sebuah situs, entah itu situs besar ataupun kecil pastilah mempunyai yang namanya logo. Nah, logo inilah yang berperan penting bagi sebuah situs yaitu sebagai identitas atau ciri khas dari situs yang kita kelola.

Letak yang strategis tepatnya berada disamping kiri judul situs pada tab browser membuat favicon ini dapat mudah dilihat oleh si pengunjung. Pada beberapa kasus seringkali admin temukan situs ataupun blog yang tidak dapat menampilkan logo atau favicon ini di mesin pencarian.

Padahal jika dibuka halaman blog tersebut, dapat kita lihat jelas logo yang sudah terpampang tepat berada ditab browser. Nah, dipemasalahan inilah yang akan saya bahas cara untuk mengatasinya.

Cara Memasang Favicon Blogger Support Dial Browser

Mungkin sobat masih bingung dengan apa yang saya maksud support dial browser. Jika memang begitu, sobat bisa lihat gambar simulasi berikut ini agar paham.

Pernahkah sobat bertanya-tanya mengenai cara mengatasi permasalahan ini? Jika iya berarti anda sudah benar membaca artikel ini. Karena hampir dikebanyakan blog tutorial masih sedikit yang membahas mengatasi permasalahan ini.

Ok, daripada berlama-lama yang akhirnya hanya dibaca pada intinya. Mari langsung kita menuju ke tutorialnya.

  1. Pastikan sobat sudah backup terlebih dahulu template yang sedang digunakan.
  2. Silahkan login ke akun blog sobat yang terdaftar di Blogger.com
  3. Pada dashboard blogger, pilih menu Tema > lalu pilih lagi Edit HTML
  4. Kemudian cari kode <head> yang ada di template sobat masing-masing.
  5. Selanjutnya salin kode berikut ini, dan letakkan tepat dibawah kode yang sudah sobat cari tadi.
    <!-- Meta Icon -->
      <link expr:href='data:blog.homepageUrl + &quot;/favicon.ico&quot;' rel='icon' type='image/x-icon'/>
      <link href='URL_Favicon' rel='apple-touch-icon'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='57x57'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='72x72'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='76x76'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='114x114'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='120x120'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='144x144'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='152x152'/>
      <link href='URL_Favicon' rel='apple-touch-icon' sizes='180x180'/>
      <link href='URL_Favicon' rel='icon' sizes='192x192' type='image/png'/>
      <link href='URL_Favicon' rel='icon' sizes='96x96' type='image/png'/>
      <link href='URL_Favicon' rel='icon' sizes='32x32' type='image/png'/>
      <link href='URL_Favicon' rel='msapplication-TitleImage'/>

    Keterangan:
    Ubah URL_Favicon dengan url favicon sobat masing-masing.

  6. Lalu klik pada tombol Simpan Tema untuk menerapkan semua perubahan tadi.

Masih bingung bagaimana cara mendapatkan url favicon yang benar dan juga sesuai ukuran yang dimaksud? Mudah kok sob, silahkan kunjungi situs Favicon Generator untuk mengconvert logo yang sudah anda buat.

Situs tersebut memudahkan anda untuk merubah ukuran, resolusi, dan ekstensi logo. Jadi, anda tak perlu lagi bingung mengconvert manual.

Mungkin sekian dulu artikel dari Cara Memasang Favicon Blogger Support Dial Browser, apabila ada pertanyaan, sobat bisa langsung berkomentar agar sama-sama di diskusikan. Semoga berkah dan selalu bermanfaat
Terimakasih.