Cara Membuat Widget Artikel Terbaru Bergambar di Blogspot 2019

Langkah-Langkah Membuatnya:

1. Pertama teman-teman login ke blog teman-teman

2. Selanjutnya Pilih " Tata Letak" kemudian pilih "HTML/Java Script"

3. Untuk Judul silakan isi dengan "Artikel Terbaru"

4 Dan untuk konten silakan copy kode script yang telah saya sediakan dibawah ini

5. Lalu simpan, dan terakhir silakan lihat blog milik sobat

Kode Script Artikel Terbaru Bergambar Juli 2019
<script style="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/recentpost-seocips-3.js"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = false;
var posts_date = true;
var post_summary = false;
var summary_chars = 70;</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
<style type="text/css">
img.recent-post-thumb {padding:2px;width:65px;height:65px;float:left;margin: 0px 10px 10px; background: #fff; border: 1px solid #69B7E2;}
.recent-posts-container {font-family: 'Oswald', sans-serif;  float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container li {position:relative;padding:5px 0px;min-height:65px; list-style-type: none; margin-bottom: 1px;}
ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}
.recent-posts-container a { text-decoration:none; }
.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #2aace3;}
.recent-posts-details {margin: 5px 0px 0px 15px; }
.recent-posts-details a{ color: #777;}
</style>

Share this post