Merubah Parameter AMP Blogger dari m=1 Menjadi amp=1

Merubah Paramater AMP Blogger dari m=1 Menjadi amp=1

Template yang saya pada blog ini saya namain dengan Alinux AMP di mana ada beberapa pengunjung yang "sadar" bahwa URL untuk halaman valid AMP saya menggunakan parameter ?amp=1, bukan ?m=1 .

Lalu ada beberapa teman blogger yang mengirimkan pesan via Facebook, yang menanyakan bagaimana cara merubah parameter untuk halaman AMP Blogger menjadi ?amp=1. Oke, dari pada saya harus menjawab satu persatu, saya coba jelaskan sedikit saja di artikel ini.

Saya sebenarnya pernah mengakali dengan menggunakan data conditional seperti 'data:blog.url + "?amp=1&quot', namun nampaknya tidak efektif dan menemui beberapa error. Sampai akhirnya saya mengetahui cara yang lebih efektif. Cara ini saya dapatkan dari salah seorang blogger kenalan saya.

Manfaat AMP Khusus di parameter amp=1

Sebelum saya jelaskan, akan saya sebutkan beberapa kelebihan yang akan didapatkan apabila menerapkan AMP HTML di parameter Blogger amp=1

Bisa menerapkan anchor ad AdSense di tampilan mobile blog dengan menggunakan Auto Ads AdSense.
Bisa memasukan JavaScript di tampilan mobile.
Halaman khusus AMP (amp=1) hanya akan diakses apabila pengunjung datang dari AMP viewer seperti Google atau Twitter.

Langsung saja, berikut langkah merubah Parameter khusus halaman AMP Blogspot, dari m=1 menjadi amp=1

Merubah halaman khusus AMP m=1 menjadi amp=1

Cara ini bisa dilakukan dengan memanfaatkan tag data Blogger Operator URL dengan syntax params.

Masuk ke menu Edit HTML di Themes. Kemudian ikuti langkah di bawah ini

Selanjutnya, cari kode:


<HTML expr:dir='data:blog.languageDirection' lang='id'>

<b:attr cond='data:blog.isMobileRequest == &quot;true&quot;' name='amp' value='amp'/>

atau kode di bawah ini bagi anda yang belum mengubahnya parameter khusus amp di m=1


<HTML amp='amp' expr:dir='data:blog.languageDirection' lang='id'>

Lalu ubah kode tersebut menjadi :


<HTML expr:dir='data:blog.languageDirection' lang='id'>

<b:attr cond='data:view.url == data:view.url params { amp: &quot;1&quot; }' name='amp' value='amp'/>

Perhatikan kode berwarna kuning, itu merupakan pemanfaatan Blogger Operator URL untuk membuat parameter baru menjadi amp=1 . Lihat penjelasan dan penerapan lebih lanjut di blog trik sonic.

Selanjutnya, kita akan mengatur canonical untuk halaman utama dan halaman khusus AMP HTML.

Cari kode seperti di bawah ini


<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.url + &quot;?m=1&quot;' rel='amphtml'/>
</b:if>

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<link expr:href='data:blog.url' rel='canonical'/>
</b:if>

Atau jika tidak ditemukan, cari saja bagian canonical seperti:


<link expr:href='data:blog.url' rel='canonical'/>

Hapus kode tersebut, dan ganti dengan yang sudah saya buatkan di bawah ini:

<b:if cond='data:view.url != data:view.url params { amp: &quot;1&quot; }'>
<link expr:href='data:blog.canonicalUrl' rel='canonical'/>
<link expr:href='data:blog.canonicalUrl + &quot;?amp=1&quot;' rel='amphtml'/>
  </b:if>
<b:if cond='data:view.url == data:view.url params { amp: &quot;1&quot; }'>
<link expr:href='data:blog.canonicalUrl' rel='canonical'/>
  </b:if>

Sampai disini, proses sebenarnya sudah selesai. Tap jika sebelumnya anda menggunakan parameter m=1 untuk halaman khusus AMP HTML, maka anda harus mengikuti langkah berikut ini karena biasanya akan terjadi sedikit error.

Merubah m=1 menjadi amp=1

Cari semua kode tag blogger untuk mobile m=1 seperti di bawah ini:


<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>

Kemudian ganti dengan:


<b:if cond='data:view.url == data:view.url params { amp: &quot;1&quot; }'>

Selanjutnya, cari kode:


<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>

dan ubah menjadi


<b:if cond='data:view.url != data:view.url params { amp: &quot;1&quot; }'>

Menampilkan Element di Halaman AMP saja

Untuk menampilkan semua elemen ataupun widget hanya di halaman AMP HTML saja, maka anda hanya perlu membungkusnya dengan tag conditioal amp tersebut. Contoh:


<b:if cond='data:view.url == data:view.url params { amp: &quot;1&quot; }'>

   <!-- Contents -->

</b:if>

Jika ingin menampilkan element di selain halaman AMP, gunakan tag conditional ini:


<b:if cond='data:view.url != data:view.url params { amp: &quot;1&quot; }'>

   <!-- Contents -->

</b:if>

Itulah artikel lengkap trik untuk Merubah Parameter AMP Blogger dari m=1 Menjadi amp=1. Anda tetap harus menganasila kinerja halaman khusus AMP anda di Search Console.

Semoga bermanfaat :)