Cara membuat widget artikel terbaru kerren di blogger loading cepat
Saya awalnya kebingungan ketika templete blog saya diupdate, ternyata ada penambahan widget terbaru. Dan ternyata di blognya mas Sugeng belum ada yang membahas maslah ini. Ada satu artikel di sana yang membahas artikel terbaru ini, tetapi saya coba tidak work.
Akhirnya saya pun mengotak-atik sendiri mencoba membuat widget yang sama persis. Akhirnya ditemukanlah solusinya. Caranya cukup mudah. Kamu masuk pada Layout kemudian pilih tambahkan widget, pilih html lalu pastekan kode dibawah ini.
<div class='widget-content'>
<div class='artikel-terbaru'>
<script>
function artikelterbaru(e){document.write("<ul>");for(var t=0;t<e.feed.entry.length;t++){for(var r=0;r<e.feed.entry[t].link.length&&"alternate"!=e.feed.entry[t].link[r].rel;r++);var n="<li><a href="+("'"+e.feed.entry[t].link[r].href+"'")+'">'+e.feed.entry[t].title.$t+"</a> </li>";document.write(n)}document.write("</ul>")}
</script>
<script src="/feeds/posts/summary/?max-results=5&alt=json-in-script&callback=artikelterbaru"></script>
</div>
</div>
Apabila tampilannya tidak sama atau berantakan, maka kamu perlu menambah file css berikut ini. Copy kode di bawah ini dan pastekan pada bagian css templete blog kamu.
/* Artikel Terbaru */ .artikel-terbaru ul li { | |
border-bottom: 2px dotted #efefef; | |
padding-bottom: 8px; | |
margin-bottom: 8px; | |
font-weight: 500; | |
} | |
.list-label-widget-content ul li, .LinkList ul li, .PageList ul li { | |
border-bottom: 2px dotted #efefef; | |
padding-bottom: 5px; | |
} | |
.artikel-terbaru ul li:before, .list-label-widget-content ul li:before, .LinkList ul li:before, .PageList ul li:before { | |
content: "\f14b"; | |
font-family: FontAwesome; | |
font-style: normal; | |
font-weight: normal; | |
text-decoration: inherit; | |
margin-right: 6px; | |
} | |
.artikel-terbaru ul li:before { | |
content: "\f14b"; | |
} | |
.list-label-widget-content ul li:before { | |
content: "\f07b"; | |
} | |
.LinkList ul li:before { | |
content: "\f14c"; | |
} | |
.PageList ul li:before { | |
content: "\f249"; | |
} |
Bagaimana? apakah sudah berhasil?
Posting Komentar untuk "Cara membuat widget artikel terbaru kerren di blogger loading cepat"
Apabila ada kendala, silakan tinggalkan komentar!