Bagaimana Cara Buat Widget Recent Post Untuk Blog AMP ?

Admin
Admin
Agustus 14, 2022
Candil Kuya - Bagaiman Cara Buat Widget Recent Post Untuk Blog AMP ?Sebenarnya widget recent post adalah salah satu widget yang tidak wajib ada di blog. Karena untuk melihat postingan terbaru, pengunjung bisa pergi ke homepage.

Namun beberapa blogger tetap memasang widget recent post dengan tujuan untuk memberikan kemudahan kepada pengunjung untuk mengetahui postingan terbaru di blog tersebut.

Bagaimana Cara Buat Widget Recent Post Untuk Blog AMP ?


Karena homepage menampilkan postingan terbaru, maka widget recent post seperti ini sebaiknya tidak ditampilkan di homepage, tetapi hanya ditampilkan di halaman postingan saja.  Sengaja Saya Bikin Artikel Ini Karena Saya Tertarik Melihat Sebuah Widget Blogger Yang Dibagikan Oleh Mas Adhy Suryadi Pemilik Blog Kompiajaib.com Dan Sayapun Mencoba Memasang Widget Tersebut Di Blog ini, Dan Ternyata Hasilnya Cukup Memuaskan.

Baca Juga : AMP Breaking News Responsive - Free Download

Cara Buat Widget Recent Post Untuk Blog AMP

Jika Anda Ingin menyimpan widget recent post ini di sidebar blog AMP, silahkan copy kode berikut ini dan simpan di antara widget di sidebar melalui EDIT HTML.


<b:widget id='HTML97' locked='false' title='' type='HTML' version='1'>
            <b:widget-settings>
              <b:widget-setting name='content'><![CDATA[<!--recentpost-->]]></b:widget-setting>
            </b:widget-settings>
            <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<amp-iframe expr:src='&quot;https://cdn.staticaly.com/gh/KompiAjaib/kompi-html/master/recentpost-amp.html?fontSize=16px&amp;color=333&amp;url=&quot; + data:blog.homepageUrl' frameborder='0' height='488' layout='fixed-height' noloading='' sandbox='allow-forms allow-scripts allow-same-origin allow-modals allow-popups' title='Recent Posts'>
    <amp-img height='488' layout='fixed-height' noloading='' placeholder='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXo9uOMhs6BlVk9OdUeDCiNdOyRguU_GsJiwUfcjgho_9Bz8duM5UticpN_V5GKqTEpTJSyjWfurl_Zyg1V9I1TB6s3iwOvnLp-2eNIOlqS6AyRIzUVQGlVvzjWjVSgBdXR7vJVLdYx4g/s1600/back-iframe.png' width='auto'>
    </amp-img>
  </amp-iframe>
  </b:if>
  </div>
</b:includable>
          </b:widget>
Kode 16px yang saya tandai untuk mengatur ukuran font title post, kode 333 yang ditandai itu untuk mengatur warna title post (kode hex warna tanpa #).

Mungkin Cukup Sekian Candilkuya.com Berbagi Tutorial Blogger Tentang Cara Membuat Widget Recen Post Untuk Blog AMP.

Semoga bermanfaat.

Credit : https://www.kompiajaib.com/2018/12/widget-recent-post-untuk-amp-dengan.html
×

Bagaimana Cara Buat Widget Recent Post Untuk Blog AMP ? 5 out of 5
Admin