Cara Membuat Responsive Widget Recent Post Tanpa Gambar Di Blog

Oleh Unknown

Share this on :

Tweet

Cara Membuat Responsive Widget Recent Post Tanpa Gambar Di Blog - Hai sobat blogger ketemu lagi dengan saya admin blog Seoscore yang kali ini akan membagikan sebuah widget recent post lagi untuk kalian semua.Sebelumnya saya sudah sempat membahas tentang cara membuat recent post dengan gambar di blog.

Tapi untuk kali ini saya membagikan tutorial membuat widget recent post tanpa menggunakan gambar di blog.Jadi bedanya yang satu dengan gambar (thumbnail) dan yang satu lagi tanpa gambar tapi pada halnya fungsi recent post widget itu tetap sama yaitu untuk mempermudah pengunjung blog dalam menavigasi artikel dalam blog kita.

Widget Recent post ini cukup responsive dan pastinya tidak berpengaruh sama sekali dengan kecepatan blog sobat.Jadi kecepatan blog soba tidak akan terganggu bila memasang widget ini di blog sobat.Baiklah langsung saja pada tutorialnya.

Cara Membuat Recent Post Tanpa Gambar Di Blog

1. Masuk ke akun blogger
2. Masuk ke menu Tata letak > Tambah widget > HTML/Javascript
3. Copy kode dibawah ini dan pastekan di kotak HTML widget yang disediakan.

<div id="titleonly">
<script style="text/javascript" src="https://aakyos.googlecode.com/svn/Recen-Post-Icon.js"></script>
<script style="text/javascript">var 
numposts = 5;var showpostdate = false;var showpostsummary = false;var 
numchars = 100;var standardstyling = true;</script>
<script src="http://seo-score.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div style="font-family: arial, 
sans-serif; font-size: 9px;" id="rectitle"><a 
href="http://aak-share.blogspot.com/2014/08/2-cara-membuat-recent-post-simpel-dan.html"
 title="Grab this Widget" target="_blank">Recent Posts 
Widget</a> by <a href="http://aak-share.blogspot.com/" 
title="Widget Recent 
Posts">Aak</a></div><noscript>Maaf! Pastikan bahwa 
JavaScript terpasang di browser anda.</noscript>
<style type=text/css>
#titleonly a {background: 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCl3CmPl06HZom3YmUWtb8_V50X_8k5Wkzrk_hpZtuVrdlFw5GcXisUCQRw0rcTjwKf53ZTBIwBSUFz7w2tLibMGaUkUvHIUSZTEcuw6_zOUBUuDsmji1dSQA1_f45jrG47D-R3-rvyRo/s16/1362763742_arrow_right.gif)
 0px 0px no-repeat; color: #0303FF ; font-size: 13px; padding: 1px 0px 
0px 19px; margin: 5px 0px 0px 0px;line-height:25px;} #rectitle 
{background: 
url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCwfPVvM1X9bHURol4WOOeKBud2RKLt4Egu_TJi8losJzq80QHWqv9MFXIctqKvJCgZppf44IhadafhX5s6aOaAZxaHkTeJkWbgQlUN3ZdH2Tw2EMtbzjvPQLU5xf7kcTPuSXqO30SyrM/s1600/icon1.png)
 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 
0px 0px 0px;line-height:14px;}
#rectitle, #rectitle a {color:#808080;}
.titlepost {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

Note : ganti tulisan yang berwarna biru dengan url Blog sobat masing-masing dan silahkan save widget tersebut.

Sekarang widget recent post sudah berhasil sobat pasang di blog sobat.Nah mungkin hanya ini yang dapat saya berikan dalam tutorial cara membuat / memasang recent post tanpa gambar di blog kali ini semoga bermanfaat untuk sobat semua.

Tag : Tutorial Blog, Widget