Membuat Amp Pada Blogger Hanya Di Url Mobile M=1
Dengan menciptakan AMP pada Blogger dengan hanya menampilkan AMP hanya pada URL mobile m=1 ini maka ikon AMP validator di ekstensi browser pada tampilan desktop dan tablet akan berwarna biru dengan ikon link ibarat pada blog-blog Wordpress yang memakai plugin AMP.Ikon AMP validator di ekstensi browser pada tampilan desktop dan tablet yang berwarna biru dengan ikon link ini menandakan halaman yang sedang dilihat bukan halaman AMP namun halamannya menandakan bahwa halaman AMP untuk halaman tersebut tersedia. Dengan mengklik ikon biru tersebut maka pengunjung akan dialihkan ke halaman AMP.
Maka kalau pada Blogger kita menciptakan halaman AMP hanya pada URL mobile
m=1 maka saat pengunjung mengklik ikon biru ekstensi AMP validator pada tampilan desktop, maka pengunjung akan dialihkan ke URL m=1 sebagai halaman AMP.Untuk menciptakan halaman AMP pada Blogger hanya pada URL mobile
m=1 ini, yang kita perlukan yaitu blog yang tentunya sudah valid AMP. Kemudian kita akan melaksanakan beberapa perubahan kecil untuk menciptakan AMP hanya pada URL mobile m=1.1. Langkah Pertama
Silahkan cari arahan berikut ini atau arahan yang ibarat mirip berikut ini <HTML amp='amp' expr:dir='data:blog.languageDirection' lang='id'>
Kemudian silahkan ganti dengan arahan di bawah ini
<HTML expr:dir='data:blog.languageDirection' lang='id'>
<b:attr cond='data:blog.isMobileRequest == "true"' name='amp' value='amp'/>
2. Langkah Kedua
Silahkan cari arahan berikut ini atau arahan yang ibarat mirip berikut ini <link expr:href='data:blog.url' rel='canonical'/> Kemudian silahkan ganti dengan arahan di bawah ini
<b:if cond='data:blog.isMobileRequest == "false"'>
<link expr:href='data:blog.url' rel='canonical'/>
<link expr:href='data:blog.url + "?m=1"' rel='amphtml'/>
</b:if>
<b:if cond='data:blog.isMobileRequest == "true"'>
<link expr:href='data:blog.url' rel='canonical'/>
</b:if> Setelah ini silahkan simpan perubahan pada templatenya. Dengan 2 langkah tadi kita sudah menciptakan halaman AMP hanya tampil pada URL mobile
m=1 saja. Di sini kita tidak perlu melaksanakan perubahan pada layout yang sebelumnya pada template blog alasannya element-element AMP tetap akan bekerja pada tampilan desktop meskipun sekarang sudah bukan menjadi halaman AMP.
Dan untuk persoalan postingan, meskipun kita sudah melaksanakan perubahan tadi tetapi kita tetap menciptakan postingan dengan format AMP ibarat sebelumnya.
Yang lalu perlu kita lakukan ialah mengoptimalkan iklan Adsense. Kita akan menciptakan iklan Adsense terpisah menjadi iklan tampilan desktop dan iklan tampilan AMP/mobile.
Untuk iklan tampilan desktop maka yang dipakai ialah arahan iklan Adsense biasa dan untuk iklan tampilan AMP memakai
amp-ad. Yang pertama dilakukan ialah memisahkan js ad, silahkan cari arahan js berikut.
<script async='async' custom-element='amp-ad' src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'/> Silahkan hapus arahan tersebut lalu silahkan simpan arahan berikut di atas arahan
</head> atau </head><!--<head/>--> <b:if cond='data:blog.pageType not in {"static_page","error_page"} and data:blog.isMobileRequest == "true" and not data:blog.searchQuery'>
<script async='async' custom-element='amp-ad' src='https://cdn.ampproject.org/v0/amp-ad-0.1.js'/>
</b:if>
<b:if cond='data:blog.pageType not in {"static_page","error_page"} and data:blog.isMobileRequest == "false" and not data:blog.searchQuery'>
<script async='async' src='//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'/>
<script>
//<![CDATA[
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1234567890",
enable_page_level_ads: true
});
//]]>
</script>
</b:if> Silahkan sesuaikan arahan
google_ad_client sesuai akun Anda. Kemudian silahkan rubah semua slot iklan menjadi ibarat berikut.
<b:if cond='data:blog.isMobileRequest == "false" and not data:blog.searchQuery'>
<!-- Ini iklan untuk tampilan desktop -->
<ins class='adsbygoogle' data-ad-client='ca-pub-1234567890' data-ad-format='rectangle' data-ad-slot='1234567890' style='display:block'/>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</b:if>
<b:if cond='data:blog.isMobileRequest == "true" and not data:blog.searchQuery'>
<!-- Ini iklan untuk tampilan AMP/mobile -->
<amp-ad data-ad-client='ca-pub-1234567890' data-ad-slot='1234567890' data-auto-format='rspv' data-full-width='' height='320' media='(max-width: 736px)' type='adsense' width='100vw'>
<div overflow=''/>
</amp-ad>
</b:if> Silahkan sesuaikan arahan
data-ad-client dan data-ad-slot nya sesuai dengan arahan iklan Anda. Dan pastikan
robots.txt blog Anda tidak memblok URL m=1. Selesai... selamat mencoba.
0 Response to "Membuat Amp Pada Blogger Hanya Di Url Mobile M=1"
Posting Komentar