Cara Pasang Related Post Untuk Blog Valid Amp

Bila Related Post untuk blog Non AMP mungkin sudah biasa jadi kali ini yang akan membahas wacana bagaimana cara memasang Related Post atau Artikel Terkait dibawah postingan untuk blog Valid AMP.

Related Post untuk blog AMP ini memakai sedikit CSS jadi tidak akan menciptakan loading blog menjadi berkurang apalagi inikan untuk blog AMP jadi walaupun speed agak berkurang namun akan dipercepat oleh Google alasannya blog Valid AMP mempunyai keistimewaan.

Jika teman ingin lihat demo atau pratinjaunya teman dapat lihat related post yang ada dibawah postingan,

Tertarik untuk memasangnya ? Silahkan simpan CSS dibawah ini didalam tag style amp-custom untuk postingan Desktop dan juga Mobile, semoga Related post juga tampil dikomputer ataupun smartphone dengan bagus

/* Artikel Terkait */ 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}

Lalu tambahkan arahan dibawah ini sempurna dibawah postingan atau cari arahan <data:post.body> dan simpan dibawahnya, atau teman dapat tempatkan dimana teman ingin menyimpannya

<b:if cond='data:blog.pageType == "item"'>  <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"> <h4>Artikel Terkait</h4> <amp-iframe expr:src=""https://cdn.rawgit.com/MuhAkram/Blog/master/related-post.html?url=www.&colortitle=000000&colordesc=000000&back=ffffff&item=both&style=thumbnail&label=" + 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>

Ganti www. dengan alamat blog teman

Semoga bermanfaat !

Referensi : kuncidunia