-->

CARA SETTING AMP DI BLOGSPOT



Accelerated Mobile Pages atau yg disingkat AMP merupakan rencana baru Google yang sanggup mempercepat loading satu buah halaman web di mobile atau telpon pintar.Kebanyakan loading sebuah website amat lambat bila diakses menggunakan mobile atau handphone sehingga visitor malas untuk mengunjungi situs. maka dari itu Google menciptakan AMP yg bertujuan memangkas elemen dan kode yang tak diperlukan, sehingga halaman akan cepat termuat.
Berikut saya akan membagikan Tutor Lengkap dengan bantuan dari blognya bang Adhy di http://www.kompiajaib.com/ .




Cara pasang Google AMP di Blogspot


Untuk amp blogger template Pertama-tama pastikan mencocokkan kode template Sobat Retas seperti di bawah ini, menjadi , merubah menjadi dan lain-lain. Markup dasar AMP HTML bisa dilihat dibawah ini dan wajib merubah/ menambahkan kode css, javascript, gambar dan lain lain



KODE

<!doctype html>
<html amp lang="en">
<head>
<meta charset="utf-8">
<title>Hello, AMPs</title>
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1,user-scalable=no,minimal-ui">
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "NewsArticle",
"headline": "Open-source framework for publishing content everywhere",
"datePublished": "2015-10-07T12:02:41Z",
"image": [
"logo.jpg"
]
}
</script>
<style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
<style amp-custom>
/* custom CSS disini; tapi ingat, body margin tidak bisa diubah */
body {
background-color: white;
}
amp-img {
background-color: gray;
}
</style>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>
<h1>Welcome to the mobile web</h1>
<amp-img src="welcome.jpg" alt="Welcome" height="2000" width="800"></amp-img>
</body>
</html>



Jika sudah diubah sesuai dengan contoh diatas, silahkan lakukan pengecekan valid tidaknya halaman AMP anda dengan cara membuka salah satu artikel kemudian klik kanan –> pilih Inspect Element ,kemudian Console. Valid tidaknya pekerjaan yang anda lakukan ditandai munculnya tulisan seperti gambar berikut

Disqus Comments