BREAKING NEWS

10/recent/ticker-posts

Header Ads Widget

Responsive Advertisement

cara menampilkan postingan terbaru di blog


Ada kalanya text ingin ditampilkan lebih menarik dengan cara menampilkan postingan terbaru di blog

Sehingga pembaca informasi kamu lebih memahami dan bisa menggunakan informasi dengan simple

Kamu bisa gunakan dengan memasangnya di blog dan mempermudah bisa mengikuti tutorial berikut ini.
recent post


Cara Membuat Recent Post  Dengan Thumbnail Gambar



IKuti yang simple tersedia dalam blogspot yakni ;

1. Login ke akun blogger kamu

2. Buka Dashboard kemudian pilih Layout (Tata Letak) dan klik Add  Gadget (tambahkan Gadget)

3. Selanjutnya pilih HTML/JavaScript

4. Setelah kotak html terbuka, masukkan kode dibawah ini ke dalamnya dan beri judul Recent Post, Artikel Terbaru atau yang semacamnya.

Ini cara dari blogger Arlina

<div class='widget-ctent'>
<style scoped='' type='text/css'>
ul.recent_posts_arlina li{display:inline-block;border:0;margin:5px 0;padding:5px 0;position:relative;width:100%}
.recent_posts_arlina .wrapinfo{display:inline-block;margin:0 10px 0 0;overflow:hidden;z-index:2;position:relative;width:60px;height:60px;float:left}
ul.recent_posts_arlina li img.recent_thumb{width:100%;height:auto}
.recent_posts_arlina {float:left;width:100%;margin:10px 10px 5px 0px;padding:0;font-size:13px;}
.recent_posts_arlina strong {font-size:13px;}
ul.recent_posts_arlina li a{font-weight:700;line-height:normal}
ul.recent_posts_arlina li a:hover{text-decoration:underline}
</style>
<script style='text/javascript' src='https://cdn.rawgit.com/Arlina-Design/FlamingTree/master/recentpostarlina.js'></script>
<script style='text/javascript'>
var numposts=10,showpostthumbnails=!0,displaymore=!1,displayseparator=!1,showcommentnum=!1,showpostdate=!1,showpostsummary=!1,numchars=0;
</script>
<script src='/feeds/posts/default?orderby=published&alt=json-in-script&callback=recentpostinfoarlina'></script>
</div>


Mau tahu cara lain Umumnya di lakukan juga oleh para blogger
Pilih salah satu yang sesuai dengan keiinginan kamu dan

Perhatikan pula jumlah tampilan ingin berapa postingan yang
dicontohkan berjumlah 10 postingan




Berikut kodenya:
<style> img.recent_thumb {padding-right:10px;padding-left:padding-bottom:0px;0px;width:55px;height:55px;border:0;float:left;margin:0 0 5px 0px;} .recent_posts_with_thumbs {float: left;width: 100%;min-height: 55px;margin: 0px 0px 5px 0px;padding: 0;font-size:12px;font-color:black;} ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:0px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;} .recent_posts_with_thumbs a {text-decoration:none;} .recent_posts_with_thumbs normal {font-size:13px;} </style> <script type="text/javascript" src="http://yourjavascript.com/11132354122/tholeb-recent.js"></script> <script type="text/javascript"> var numposts = 10; var showpostthumbnails = true; var displaymore = false; var displayseparator = false; var showcommentnum = false; var showpostdate = false; var showpostsummary = false; var numchars = 75; </script> <script src="https://www.bacalah.biz/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs" type="text/javascript"></script>



Silahkan dicoba, semoga bermamfaat dengan cara menampilkan postingan terbaru di blog kamu jadi menarik dan mudah membacanya .





Bacalah Juga

Post a Comment

0 Comments