Popular Post Valid AMP

Cara Membuat Popular Post Valid AMP Blogger, Popular Post Valid AMP, Popular Post Valid AMP Responsive - Sudah tak asing lagi dengan salah satu widget popular post satu ini dikalangan kita yang dimana terutama user website atau blog biasa nya sudah menerapkan salah satu widget popular post satu ini baik itu popular post tampilan biasa dan popular post valid AMP.

Dengan adanya tampilan popular post merupakan widget mempercantik tampilan juga tentu nya yang dimana membuat para pengunjung akan lebih antusias dengan adanya penambahan widget tersebut terutama widget popular post ini.

Widget popular post pada umumnya biasa kita temukan pada website website Atau blogger tertentu saja biasa nya widget ini paling sering diterapkan pada bagian sidebar (samping) tampilan sebuah website atau blog tersebut.

Widget popular post pun yakni widget yang dimana akan menyatakan sekumpulan posting/artikel popular pada suatu website yang dimana akan memberikan agar para pengunjung agar lebih antusias mengetahui posting pilihan apa saja yang tercantum pada website tersebut.

Popular Post terbagi menjadi dua bagian salah satu nya popular post yang valid akan fitur Non AMP dan Valid akan fitur AMP.

Salah satu nya AA Sciences akan membagikan yakni widget popular post dalam fitur struktur yang support akan valid nya AMP.

Langsung saja simak pembuatan widget popular post valid AMP nya di bawah ini, berikut tutorial nya :

Cara Membuat Popular Post Valid AMP di Blogger

Pembuatan CSS nya terlebih dahulu :

Pastikan kalian sudahlah Login terlebih dahulu pada akun Blogger kalian.

Template - > Edit HTML - > CTRL+F (untuk memudahkan pencarian) lalu cari kode ]]></b:skin> atau dapat juga kode </style> atau tag tertentu yang ingin kalian terapkan.

Jika sudah ditemukan kode ]]></b:skin> atau </style> nya tadi, langsung saja kalian Salin kan Script CSS/Widget Popular Post Valid AMP nya di bawah ini tepat sebelum tag ]]></b:skin> atau </style> atau tag AMP tertentu seperti halaman yang diinginkan, berikut CSS nya :

/* CSS Popular Post */

.PopularPosts .item-snippet{display:none}

.PopularPosts .widget-content ul{width:100%;padding:0;list-style:none}

.PopularPosts .widget-content ul li{margin:0 0 15px;padding:0;height:100px;overflow:hidden;position:relative}

.PopularPosts .widget-content ul li:last-child{margin:0 0 5px;}

.PopularPosts .widget-content ul li a{color:#fff;text-decoration:none;font-size:13px;font-weight:bold}

.PopularPosts img{width:100%;height:100px;padding-right:0}

.PopularPosts .item-thumbnail{float:none;margin:0}

.PopularPosts .item-title{padding:8px;position:absolute;bottom:0;line-height:1.1em ;left:0;right:0;text-align:center;background:hsla(200, 18%, 26%, 0.55);transition:all .3s ease-in-out}

.PopularPosts .item-title:hover{background:rgba(59,125,193,.3)}

Kalian dapat mengubah warna nya, dengan kode warna HTML tertentu.

Selanjutnya, penerapan agar widget popular post valid AMP nya muncul pada halaman website tertentu kalian.

Cara nya mudah, yakni :

Login - > Tata Letak - > Tambah Gadget (Pilih widget yang diinginkan) - > Entri Populer (Popular Post) -> Kalian dapat mengubah jenis dari popular post tersebut dari judul, jumlah, dan Thumbnail or Thumbnail - > Terakhir, langsung saja Pilih Simpan dan lihat hasil nya.

Share this post