Recent Post Label Style Disc

Recent Post Label Style Disc - Halo semua, setalah beberapa minggu admin libur kali ini sudah mulai aktif lagi. Post kali ini saya buat karena request dari salah satu visitor blog ini yang sudah lama belum diselesaikan, maka dari itu dengan adanya postingan ini sudah bisa mengurangi request visitor.
Ok, postingan yang saya bagikan ini yaitu membuat Widget Recent Post Label Style Disc, widget ini mungkin akan bermanfaat buat kalian yang mempunyai blog dengan niche Lagu/Ost.
Sebelum kita mulai silahkan cek dulu javascript seperti dibawah ini di template kalian yang letaknya ada di atas </head>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' type='text/javascript'/>

Recent Post Label Style Disc

1. Buka Blogger > Tema > Edit HTML, lalu tambahkan css berikut ini & letakkan dibawah <style>
2. Jika sudah Save Tema.
/* CSS Recent Post Ost - Arleth98
   ======================================= */
ul.bungkusin-ostnya{list-style:none;margin:0;line-height:normal}
li.post-ostnya{position:relative;float:left;width:115px;text-align:center;font-size:10px;margin:5px 4px}
img.postingan-ost{padding:0;background:#000;margin:2px auto;border-radius:50%;border:1px solid #333}
.showpost_rilis{font-size:10px;float:left}
.recent-details a{float:right;font-size:10px}
.title-ost{border-bottom:0;font-weight:bold;font-family:sans-serif;text-transform:none;line-height:normal;font-size:11px;overflow:hidden;text-align:center;width:100%;height:26px;margin:0;padding:0}
.title-ost a{float:none!important;text-align:center}
li.post-ostnya a{position:relative;float:right}
.da{padding:8px;width:0;border-radius:50%;position:absolute;text-align:center;top:35%;z-index:999999;right:40%;border:2px solid #C7C7C7;background:#222}

3. Buka Tata Letak > Add Widget > HTML/Javascript, & simpan javascript dibawah ini
<script type="text/javascript" src='https://cdn.rawgit.com/Arleth98/Js/8cb66fe6/Recent-post-ost.js'></script>
<script type="text/javascript">
var posts_no = 5;
var showcommentpostnya = false;var showrelease_ostnya = false;var showimage_ostnya = true;
document.write('<script src=\"\/feeds\/posts\/default\/-\/Ost?orderby=published&alt=json-in-script&callback=showpost_ost\"><\/script>');
</script>
<noscript>Your browser does not support JavaScript!</noscript>
TagKeterangan
posts_no = 5; Silahkan Ganti No 5 untuk menampilkan Jumlah postnya
Ost Ganti Dengan Label Post
Demo Bisa kalian lihat di bawah ini
DEMO

Bila lebar dan tinggi tidak sesuai dengan blog kalian,
Silahkan Atur langsung dibagian CSS nya yang sudah saya Markup.
Sekian tutorial kali ini semoga bermanfaat & sampai jumpa di tutorial berikutnya.
Related Posts
Disqus Comments