DUNIA BLOG | ANDROID | INFORMASI | BLOG PERSONAL | TUTORIAL | TERBARU

Oktober 27, 2017

Cara Terbaik Membuat Template Blogger Amp

Baca Juga

AMP adalah sebuah produk dari google yang dibuat dengan tujuan mempermudah konsumen dalam mengakses sebuah blog atau situs ketika menggunakan browser dari HP atau smartphone, jika sebuah situs sudah menggunakan template atau theme AMP maka blog tersebut dapat diakses dengan mudah dan sangat cepat jika menggunakan HP atau samartphone dengan kecepatan lebih dari 4 kali dari kecepatan template biasa yang belum menggunakan amp, dan bukan itu saja bahwa amp juga dapat menghemat penggunaan data dalam kita menjelajahi sebuah situs lebih dari 10 kali jika dibandingkan jika kita browsing di sebuah situs yang belum menggunakan amp.

Cara Terbaik Membuat Template Blogger Amp
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.


Pada Kesempatan Kali Ini,Ini Rifany Akan Sedikit Membagikan Cara Membuat Template Blogger (Blogspot) Menjadi AMP.

Masuk Ke Template Dan Edit HTML

1. Cari Dan Ganti tag <html> dengan tag <html amp='amp' lang='en'>

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.
logoblog

Ditulis Oleh : Arif Rifany ~ Admin Blog

Arif Rifany Anda sedang membaca artikel berjudul Cara Terbaik Membuat Template Blogger Amp dengan url https://inirifany.blogspot.com/2017/10/cara-terbaik-membuat-template-AMP-blogger.html yang ditulis oleh INI RIFANY yang berisi tentang :Cara Membuat Template Blogger (Blogspot) Menjadi AMP., Supaya Blog Loading Cepat Dan Maaf, Anda tidak diperbolehkan mengcopy paste artikel ini.Silahkan Dibagikan Jika Sekiranya Bermanfaat...

Tidak ada komentar:

Posting Komentar