Setting Viewport Meta Tag di Blogger

Untuk membuat template blogger yang mobile-friendly kita bisa menggunakan meta tag viewport. Berikut settingnya.

1. Buka Blogger Dashboad > Select Template > Edit HTML
2. Copy dan pastekan kode berikut di bawah tag <head> atau sebelum </head>

<meta name=’viewport’ content=’width=device-width, initial-scale=1.0, maximum-scale=10.0, user-scalable=yes’/>

3. Klik tombol Save Template.

Keterangan:

  • width : Lebar virtual viewport device. Masukkan nilai (asumsi pixels) atau gunakan keyword “device-width” untuk menyetting viewport ke lebar fisik layar handset.
  • height : Tinggi virtual viewport. Masukkan nilai (asumsikan sebagai pixels), atau dengan kata kunci “device-height” untuk menge-set viewport ke tinggi layar handset.
  • initial-scale : Nilai awal zoom halaman website. Nilai 1.0 berarti no zoom.
  • minimum-scale:  Level minimum user bisa zoom-out halaman web. Nilai 1.0 berarti user tidak bsa melakukannya.
  • maximum-scale : Level max user bisa zoom-in halaman web. Nilai 1.0 berarti user tidak bisa zoom.
  • user-scalable : set dengan yes atau no.  Kalau yes berarti mobile user bisa zoom halaman webpage.
Advertisements

Tinggalkan Komentar

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s