Cara Mudah Setting AMP di Blogger

Disetiap waktu pengguna Android semakin meningkat, banyak yang menggunakan Android untuk mempermudah aktifitas sehari-harinya. Bahkan untuk ngebrowsing selalu mengandalkan Android, dan bisa dipastikan traffic blog anda banyak menggunakan sistem operasi Android.


Solusi telah ditemukan, sejak tahun 2006 Google telah membuat proyek amp. Apa itu Amp? Amp kepanjangan dari "accelerated mobile pages" yang artinya pengoptimalan halaman seluler, Menjadi langkah dari optimasi seo on page (bagian utama seo)

Kelebihan Dan Manfaat  Menggunakan Amp

  1. Mempermudah halaman situs web atau blog anda untuk dibuka menggunakan Android dengan mempercepat loadingnya menjadi 2 Kali lipat lebih kencang dari sebelumnya, Sehingga seo blog menjadi lebih baik.
  2. Meningkatkan traffic dan pageview blog.
  3. Meningkatkan peringkat artikel blog di google.
  4. Mengoptimalkan skor bounce rate atau rasio pentalan.
  5. Memberikan pengalaman dan kepuasan pengguna yang lebih baik.

Beberapa Kekurangan AMP

  1. Terbatasnya pemasangan Iklan Dan penggunaan widget. 
  2. Tidak boleh sembarangan memasang javascript. 
  3. Sangat rumit untuk menyettingnya. 

Kumpulan Template Amp Blogger Gratis Dan Terbaik

Setiap Template amp blogger yang gratis secara default itu banyak yang belum valid amp, berbeda dengan yang premium. Mari download dan pasang dulu template amp nya di blog anda.


1. Viomagz Amp


2. Vletters Amp


3. infinite JLB Amp


4. Sahabat Amp



Lalu Lakukan pengecekan amp. Bisa dipastikan banyak kesalahan yang ditemukan. Agar blog anda valid amp, maka perbaiki semua kesalahan amp. Berikut tipsnya.


1. Ubah tag img menjadi amp-img.

Hingga sekarang ini blog anda sudah memiliki banyak artikel? agar memenuhi persyaratan amp mau gak mau harus mengedit seluruh artikel blognya. Ubah tag img pada semua gambar artikelnya menjadi versi amp (melalui html), Lakukan dengan benar. Berikut contohnya.

Thumbnail Amp:
<noscript><img src=".jpg" width="0" height="0" alt="" title="" /></noscript>

 

Img:

<a href=".jpg" style=""><img alt="" border="0" data-original-height="0" data-original-width="0" height="0" src=".jpg" title="" width="0" /></a>

 

 Amp-img:

<amp-img src=".jpg" width="" height="" alt="" title=""></amp-img>

 

 2. Ubah script iklan adsense menjadi amp.

<amp-ad width="100vw" height="320" type="adsense" data-ad-client="" data-ad-slot="" data-auto-format="rspv" data-full-width=""><div overflow=""></div></amp-ad>

 

3. Pasang script custom amp-ad.

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

Tempelkan kode script nya tepat diatas "</head>". 


4. Ubah script Google Analytics menjadi Amp.

<amp-analytics type='googleanalytics'>
<script type='application/json'>
{
&quot;vars&quot;: {
&quot;account&quot;: &quot;UA-xxxxx-x&quot;
},
&quot;triggers&quot;: {
&quot;trackPageview&quot;: {
&quot;on&quot;: &quot;visible&quot;,
&quot;request&quot;: &quot;pageview&quot;
  }
 }
}
</script>
</amp-analytics>

Tempelkan kodenya tepat Diatas kode </body>. Juga pastikan script custom amp-analytics sudah terpasang ditemplate blog. 
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

5. Cari dan hapus kode script berikut ini.
<b:include data='blog' name='google-analytics'/>


6. Ubah kode <head> Dan </head> menjadi seperti berikut ini.

&lt;head&gt;

&lt;/head&gt;&lt;!--<head/>

 

 7. Hapus kode berikut pada widget yang dipasang di blog. 

<b:include name='quickedit'/>



Blog sudah valid amp? tapi masih heran kenapa icon petirnya belum muncul di pencarian google? Tunggu hingga beberapa waktu sampai search console google selesai memvalidasikan amp pada blogger anda.