![]() |
Cara Terbaik Membuat Template Blogger Amp |
Seiring berkembangnya teknologi saat ini, terutama di bidang telekomunikasi maka mau tidak mau kita harus ikut terbawa oleh arus perkembangan tersebut, salah satu contoh yang dapat kita lihat saat ini adalah semakin banyaknya orang yang menggunakan smartphone untuk melakukan aktivitas mereka dalam kesehariannya, termasuk didalamnya adalah melakukan browsing di internet.
Dengan melihat fenomena dan perkembangan teknologi diatas, sudah seharusnya kita juga sebagai blogger atau web developer memperhitikan hal tersebut, dengan membangun sebuah web atau blog yang sudah dilengkapi dengan produk AMP (accelerated Mobile Pages) dari Google.
Masuk Ke Template Dan Edit HTML
1. Cari Dan Ganti tag <html> dengan tag <html amp='amp' lang='en'>
Baca Juga
- Cara Mudah memasang Kode Iklan Pada Blog Template AMP
- Cara Ampuh Mengatasi Semua Error Structured Data: Image, Author, Updated, Publisher
- Cara Membuat / mengganti Tombol Next Page dan Older Post dengan Angka keren di Blog
- Kelebihan dan Kekurangan Blog Menggunakan Template AMP
- Cara Membuat Postingan Gambar Atau Thumbnail valid AMP HTML
2. Kemudian Tambahkan kode tag berikut
<meta charset="utf-8"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">setelah kode diatas.
3. Ganti tag </head> dengan kode berikut :
<style amp-boilerplate='amp-boilerplate'> body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript> <style amp-boilerplate='amp-boilerplate'> body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none} </style></noscript> <script async='async' src='https://cdn.ampproject.org/v0.js'></script> </head>
4. Gantilah semua tag img menjadi amp-img sebagai contoh lihat kode dibawah ini:
<amp-img src="gambar-photo.jpg" alt="amp-img" height="400" width="600"></amp-img>
5. Simpan template anda dan Selesai lalu lihat hasilnya, bagaimana mudah bukan.
Demikian Sedikit Cara Terbaik Membuat Template Blogger Amp , Semoga Bermanfaat.
Tidak ada komentar:
Posting Komentar