Membuat Related Post Untuk Blog Valid AMP HTML

Membuat Related Post Untuk Blog Valid AMP HTML - Pada waktu yang lalu Saya sudah posting Membuat Sitemap Untuk Blog AMP HTML. Dan pada kesempatan kali ini Saya akan coba membagikan artikel cara Membuat Related Post Untuk Blog Valid AMP HTML.

Sebenarnya sudah banyak yang share cara ini, Namun tidak ada salahnya jika saya share ulang di blog WARIM.ID. Untuk related post ini sudah Valid AMP HTML, jadi aman untuk penguna Template Blogger yang sudah valid AMP.

Untuk cara pemasangan related post ini juga cukup mudah, jika Anda ingin memasang related post di blog AMP Anda, mari ikuti langkah langkahnya dibawah ini.

1. Silahkan simpan CSS di bawah ini di style amp-custom untuk halaman postingan blog Anda.

#related-posts {background:#fff;font-size:16px;margin:0;padding:20px;}
#related-posts h3 {text-align:left;font-size:140%;color:#666;margin:0;padding:0}

2. Silahkan simpan kode berikut, di bagian bawah area postingan di dalam edit HTML blog anda

<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond="data:post.labels"> 
<b:loop index="x" values="data:post.labels" var="label"> <b:if cond="data:x==0"> 
<div id="related-posts">
<h3>
Artikel Terkait</h3>
<amp-iframe expr:src="&quot;https://cdn.rawgit.com/WebsiteMini/html/39110edf/relatedpostamp.html?url=https://websitesmini.blogspot.com&amp;colortitle=000000&amp;colordesc=000000&amp;back=ffffff&amp;item=both&amp;style=thumbnail&amp;label=&quot; + data:label.name" frameborder="0" height="420" layout="fixed-height" sandbox="allow-scripts allow-same-origin allow-modals allow-popups"> </amp-iframe> </div>
</b:if></b:loop>
<div class="clear">
</div>
</b:if></b:if>

3. Ganti kode https://websitesmini.blogspot.com dengan alamat url blog Anda. Kemudian klik Simpan. Demikian artikel tentang Membuat Related Post Untuk Blog Valid AMP HTML. Semoga bermanfaat.

Baca Juga — Membuat Related Post Versi Grid Untuk Blog AMP HTML.