Recent posts widget για blogger με thumbnails



Αυτό το συγκεκριμένο widget είναι βασισμένο στο Mlxperience's -- "Recent Posts Widget" .
Στο οποίο όμως έχουν προστεθεί μερικά χαρακτηριστικά , όπως το  Read More ,Comment Bubble και  Ημερομηνία ανάρτησης .


Παρακάτω είναι ο πλήρες κώδικας.

Μπορείτε να το δείτε σε λειτουργία εδώ : 

Για να το βάλετε στο blog σας :

Πηγαίνετε  Στοιχεία Σελίδας –> Προσθήκη Gadget –> HTML/JavaScript και απλά αντιγράψτε και επικολλήστε αυτόν τον κώδικα στο περιεχόμενο widget , σε όποιο σημείο  εσείς θέλετε να εμφανιστεί .


<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://4.bp.blogspot.com/_L116RpGjEMY/S-3gwCzotYI/AAAAAAAABvc/FtxiJvmYDmw/s1600/no-image.jpg";
imgr[1] = "http://4.bp.blogspot.com/_L116RpGjEMY/S-3gwCzotYI/AAAAAAAABvc/FtxiJvmYDmw/s1600/no-image.jpg";
imgr[2] = "http://4.bp.blogspot.com/_L116RpGjEMY/S-3gwCzotYI/AAAAAAAABvc/FtxiJvmYDmw/s1600/no-image.jpg";
imgr[3] = "http://4.bp.blogspot.com/_L116RpGjEMY/S-3gwCzotYI/AAAAAAAABvc/FtxiJvmYDmw/s1600/no-image.jpg";
imgr[4] = "http://4.bp.blogspot.com/_L116RpGjEMY/S-3gwCzotYI/AAAAAAAABvc/FtxiJvmYDmw/s1600/no-image.jpg";
showRandomImg = true;
tablewidth = 300; cellspacing = 5; borderColor = "#f3f3f3";
bgTD = "#f3f3f3";
imgwidth = 40;
imgheight = 40;
fntsize = 12;
acolor = "#073763";
aBold = true;
icon = " ";
text = "";
fsize= "11";
showPostDate = true;
summaryPost = 60;
summaryFontsize = 11;
summaryColor = "#0b3e61";
icon2 = " ";
numposts = 5;
home_page =
"http://yourblog.blogspot.com/";
</script>
<script type="text/javascript" src="http://sites.google.com/site/mybloggerscripts/js/recentposts.js"></script>
<span style="font-size:10px;float:right;"> <a href="http://foulscode.blogspot.gr/2012/12/recent-posts-widget-blogger-thumbnails.html" target="_blank">Take This widget</a></span>

Πριν αποθηκεύσετε το widget σας ίσως θέλετε να το επεξεργαστείτε :
  • Για να προσαρμόσετε το πλάτος (width) του widget  ανάλογα με το πλάτος (width) του sidebar  σας .
tablewidth = 300; 
  • Για να προσαρμόσετε το χρώμα του πλαισίου ( border ) και το χρώμα υπόβαθρου ( background ) του widget .
borderColor = "#f3f3f3"; 
bgTD = "#f3f3f3"; 
  • Για να προσαρμόσετε το width και το height από το thumbnail image .
imgwidth = 40; 
imgheight = 40; 
  • Για να προσαρμόσετε το χρώμα και το μέγεθος γραμματοσειράς Τίτλου .
fntsize = 12; 
acolor = "#073763"; 
  • Για να προσαρμόσετε το χρώμα και το μέγεθος γραμματοσειράς Σχολίων και Ημερομηνίας
fsize= "11"; 
  • Για να προσαρμόσετε το χρώμα και το μέγεθος γραμματοσειράς  Κειμένου .
summaryFontsize = 11; 
summaryColor = "#0b3e61"; 
  • Για να προσαρμόσετε το νούμερο των αναρτήσεων που θα εμφανίζονται
 numposts = 5; 
  • Και το πιο σημαντικό :  Μην ξεχάσετε να αλλάξετε τοhttp://yourblog.blogspot.com/  με το url του blog σας .
 Καλή επιτυχία σε όλους :)  


Σχόλια