Top 4 Random Posts Blogger Widgets with Thumbnails | Hacking Dream

June 21, 2017
Here are the top 4 Random Post Blogger Widgets with thumbnails with different designs, so, this article contains 4 most widely used random posts widget codes and the explanation of random posts widgets and their uses. 



What is a Random Post Widget?

A random post widget is a code of random posts that you posted on your blog, it may be blogger or WordPress or anything other, random post widget stays the same, code may differ. Here I present you with blogger random post widget


Uses of Random Post Widget

Random post widget can be used as a widget to display random content on the panel or container. This might be helpful when you want your content to change whenever you refresh the page, this might help you build up internal links as well as all your posts get advertised at some point of time.



How to Add a Random Post Widget to Blogger

1)   Login to your blogger account and select your blog
2)   Go to layout
3)   Select “Add a Gadget”
4)   Select “HTML/JavaScript” and add the below code in it.

5)   Click On “Save”

Here all you need to do is select your desired random post blogger template and paste it in “HTML/JavaScript” Gadget.

1)Random Post Widget for Blogger with Thumbnails 1


 <style>  
 #random-posts img {  
   border-radius: 10px;  
   float: left;  
   margin-right: 5px;  
   width: 75px;  
   height: 75px;  
   background-color: #F5F5F5;  
   padding: 3px;  
   transition: all 0.2s linear 0s;  
 }  
 #random-posts img:hover {  
   opacity: 0.6;  
 }  
 ul#random-posts {  
   list-style-type: none;  
   padding: 0px;  
 }  
 #random-posts a {  
   font-size: 12px;  
   text-transform: uppercase;  
   padding: 0px auto 5px;  
 }  
 #random-posts a:hover {  
   text-decoration: none;  
 }  
 .random-summary {  
   font-size: 11px;  
   background: none;  
   padding: 5px;  
   margin-right: 8px;  
 }  
 #random-posts li {  
   margin-bottom: 10px;  
   border-bottom: 1px solid #EEEEEE;  
   padding: 4px;  
 }  
 </style>  
 <ul id='random-posts'>  
 <script type='text/javaScript'>  
 var randomposts_number = 5;  
 var randomposts_chars = 110;  
 var randomposts_details = 'yes';  
 var randomposts_comments = 'Comments';  
 var randomposts_commentsd = 'Comments Disabled';  
 var randomposts_current = [];  
 var total_randomposts = 0;  
 var randomposts_current = new Array(randomposts_number);  
 function randomposts(json) {  
   total_randomposts = json.feed.openSearch$totalResults.$t  
 }  
 document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>');  
 function getvalue() {  
   for (var i = 0; i < randomposts_number; i++) {  
     var found = false;  
     var rndValue = get_random();  
     for (var j = 0; j < randomposts_current.length; j++) {  
       if (randomposts_current[j] == rndValue) {  
         found = true;  
         break  
       }  
     };  
     if (found) {  
       i--  
     } else {  
       randomposts_current[i] = rndValue  
     }  
   }  
 };  
 function get_random() {  
   var ranNum = 1 + Math.round(Math.random() * (total_randomposts - 1));  
   return ranNum  
 };  
 </script>  
 <script type='text/javaScript'>   
 function random_posts(json) {  
   for (var i = 0; i < randomposts_number; i++) {  
     var entry = json.feed.entry[i];  
     var randompoststitle = entry.title.$t;  
     if ('content' in entry) {  
       var randompostsnippet = entry.content.$t  
     } else {  
       if ('summary' in entry) {  
         var randompostsnippet = entry.summary.$t  
       } else {  
         var randompostsnippet = "";  
       }  
     };  
     randompostsnippet = randompostsnippet.replace(/<[^>]*>/g, "");  
     if (randompostsnippet.length < randomposts_chars) {  
       var randomposts_snippet = randompostsnippet  
     } else {  
       randompostsnippet = randompostsnippet.substring(0, randomposts_chars);  
       var whitespace = randompostsnippet.lastIndexOf(" ");  
       randomposts_snippet = randompostsnippet.substring(0, whitespace) + "&#133;";  
     };  
     for (var j = 0; j < entry.link.length; j++) {  
       if ('thr$total' in entry) {  
         var randomposts_commentsnum = entry.thr$total.$t + ' ' + randomposts_comments  
       } else {  
         randomposts_commentsnum = randomposts_commentsd  
       }; if (entry.link[j].rel == 'alternate') {  
         var randompostsurl = entry.link[j].href;  
         var randomposts_date = entry.published.$t;  
         if ('media$thumbnail' in entry) {  
           var randompoststhumb = entry.media$thumbnail.url  
         } else {  
           randompoststhumb = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihYUviOUl5VEmxevZvUII0ewm6GKTRV1s4CQM3NyBk4XBw_rbsUZhVpRyqFoVTmNhnMzTM1qCaauV9ZfpA-M_jhQRHL0S3qwH8HLeqWIrMILmHotF2VG9NXMu4vvVCwoQDFXLCGfGFe38/s1600/no_thumb.png"  
         }  
       }  
     };  
     document.write('<li>');  
     document.write('<a href="' + randompostsurl + '" rel="nofollow"><img alt="' + randompoststitle + '" src="' + randompoststhumb + '"/></a>');  
     document.write('<div><a href="' + randompostsurl + '" rel="nofollow">' + randompoststitle + '</a></div>');  
     if (randomposts_details == 'yes') {  
       document.write('<span><div class="random-info">' + randomposts_date.substring(8, 10) + '.' + randomposts_date.substring(5, 7) + '.' + randomposts_date.substring(0, 4) + ' - ' + randomposts_commentsnum) + '</div></span>'  
     };  
     document.write('<br/><div class="random-summary">' + randomposts_snippet + '</div><div style="clear:both"></div></li>')  
   }  
 };  
 getvalue();  
 for (var i = 0; i < randomposts_number; i++) {  
   document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index=' + randomposts_current[i] + '&max-results=1&callback=random_posts\"><\/script>')  
 };  
 </script>  
 </ul>  
  </script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.hackingdream.net/2017/06/random-posts-blogger-widget-with-thumbnails-top.html">Random Posts Widget</a>



2)Random Post Widget for Blogger with Thumbnails 2

 <style>  
 #random-posts img {  
   float: left;  
   margin-right: 10px;  
   width: 65px;  
   height: 65px;  
   background-color: #F5F5F5;  
   padding: 3px;  
 }  
 ul#random-posts {  list-style-type: none;}  
 #random-posts li {  
   margin-bottom: 10px;  
 }  
 .random-summary {  
   display: block;  
 }  
 </style>  
 <ul id='random-posts'>  
 <script type='text/javaScript'>  
 var randomposts_number = 5;  
 var randomposts_chars = 60;  
 var randomposts_details = 'yes';  
 randomposts_details2 = 'no';  
 var randomposts_comments = 'Comments';  
 var randomposts_commentsd = 'Comments Disabled';  
 var randomposts_current = [];  
 var total_randomposts = 0;  
 var randomposts_current = new Array(randomposts_number);  
 function randomposts(json) {  total_randomposts = json.feed.openSearch$totalResults.$t  
 }  
 document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>');  
 function getvalue() {  
   for (var i = 0; i < randomposts_number; i++) {  
     var found = false;  
     var rndValue = get_random();  
     for (var j = 0; j < randomposts_current.length; j++) {  
       if (randomposts_current[j] == rndValue) {  
         found = true;  
         break  
       }  
     };  
     if (found) {  
       i--  
     } else {  
       randomposts_current[i] = rndValue  
     }  
   }  
 };  
 function get_random() {  
   var ranNum = 1 + Math.round(Math.random() * (total_randomposts - 1));  
   return ranNum  
 };  
 </script>  
 <script type='text/javaScript'>  
 function random_posts(json) {  
   for (var i = 0; i < randomposts_number; i++) {  
     var entry = json.feed.entry[i];  
     var randompoststitle = entry.title.$t;  
     if ('content' in entry) {  
       var randompostsnippet = entry.content.$t  
     } else {  
       if ('summary' in entry) {  
         var randompostsnippet = entry.summary.$t  
       } else {  
         var randompostsnippet = "";  
       }  
     };  
     randompostsnippet = randompostsnippet.replace(/<[^>]*>/g, "");  
     if (randompostsnippet.length < randomposts_chars) {  
       var randomposts_snippet = randompostsnippet  
     } else {  
       randompostsnippet = randompostsnippet.substring(0, randomposts_chars);  
       var whitespace = randompostsnippet.lastIndexOf(" ");  
       randomposts_snippet = randompostsnippet.substring(0, whitespace) + "&#133;";  
     };  
     for (var j = 0; j < entry.link.length; j++) {  
       if ('thr$total' in entry) {  
         var randomposts_commentsnum = entry.thr$total.$t + ' ' + randomposts_comments  
       } else {  
         randomposts_commentsnum = randomposts_commentsd  
       }; if (entry.link[j].rel == 'alternate') {  
         var randompostsurl = entry.link[j].href;  
         var randomposts_date = entry.published.$t;  
         if ('media$thumbnail' in entry) {  
           var randompoststhumb = entry.media$thumbnail.url  
         } else {  
           randompoststhumb = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihYUviOUl5VEmxevZvUII0ewm6GKTRV1s4CQM3NyBk4XBw_rbsUZhVpRyqFoVTmNhnMzTM1qCaauV9ZfpA-M_jhQRHL0S3qwH8HLeqWIrMILmHotF2VG9NXMu4vvVCwoQDFXLCGfGFe38/s1600/no_thumb.png"  
         }  
       }  
     };  
     document.write('<li>');  
     document.write('<img alt="' + randompoststitle + '" src="' + randompoststhumb + '"/>');  
     document.write('<div><a href="' + randompostsurl + '" rel="nofollow">' + randompoststitle + '</a></div>');  
     if (randomposts_details == 'yes') {      document.write('<span>' + randomposts_date.substring(8, 10) + '.' + randomposts_date.substring(5, 7) + '.' + randomposts_date.substring(0, 4) + ' - ' + randomposts_commentsnum) + '</span>'  
     }  
     if (randomposts_details2 == 'yes') {      document.write('<span class="random-summary">' + randomposts_snippet) + '</span>'  
     }  
     document.write('<div style="clear:both"></div></li>')  
   }  
 };getvalue();  
 for (var i = 0; i < randomposts_number; i++) {  document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index=' + randomposts_current[i] + '&max-results=1&callback=random_posts\"><\/script>')  
 };  
 </script>  
 </ul>  
  </script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.hackingdream.net/2017/06/random-posts-blogger-widget-with-thumbnails-top.html">Random Posts Widget</a>




3)Random Post Widget for Blogger with Thumbnails 3


 <ul id='random-posts'>  
 <script type='text/javaScript'>  
 var tow_numposts=5;  
 var tow_snippet_length=150;  
 var tow_info='yes';  
 var tow_comment='Comments';  
 var tow_disable='Comments Disabled';  
 var tow_current=[];var tow_total_posts=0;var tow_current=new Array(tow_numposts);function totalposts(json){tow_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<tow_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<tow_current.length;j++){if(tow_current[j]==rndValue){found=true;break}};if(found){i--}else{tow_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(tow_total_posts-1));return ranNum};  
 </script>  
 <script type='text/javaScript'>  
 function random_posts(json){for(var i=0;i<tow_numposts;i++){var entry=json.feed.entry[i];var tow_posttitle=entry.title.$t;if('content'in entry){var tow_get_snippet=entry.content.$t}else{if('summary'in entry){var tow_get_snippet=entry.summary.$t}else{var tow_get_snippet="";}};tow_get_snippet=tow_get_snippet.replace(/<[^>]*>/g,"");if(tow_get_snippet.length<tow_snippet_length){var tow_snippet=tow_get_snippet}else{tow_get_snippet=tow_get_snippet.substring(0,tow_snippet_length);var space=tow_get_snippet.lastIndexOf(" ");tow_snippet=tow_get_snippet.substring(0,space)+"…";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var tow_commentsNum=entry.thr$total.$t+' '+tow_comment}else{tow_commentsNum=tow_disable};if(entry.link[j].rel=='alternate'){var tow_posturl=entry.link[j].href;var tow_postdate=entry.published.$t;if('media$thumbnail'in entry){var tow_thumb=entry.media$thumbnail.url}else{tow_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkUyK1ur1uM1BguazzdHnBu-XuwxQFG3y1EJB5hViEa1qI2vUYRLtJ_l5cAoS9Br_4PGnLr2bltlp4cvBQYvCPAHVPRWCazrOqsrFs5mZ2nPz5dPxcCuczy0es_wFCU93rVlff9YmdzyI/s1600/default.jpg"}}};document.write('<li>');document.write('<img alt="'+tow_posttitle+'" src="'+tow_thumb+'"/>');document.write('<div><a href="'+tow_posturl+'" rel="nofollow" title="'+tow_snippet+'">'+tow_posttitle+'</a></div>');if(tow_info=='yes'){document.write('<span>'+tow_postdate.substring(8,10)+'/'+tow_postdate.substring(5,7)+'/'+tow_postdate.substring(0,4)+' - '+tow_commentsNum)+'</span>'}document.write('<div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<tow_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+tow_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};  
 </script>  
 </ul>  
 <style type='text/css'>  
 #random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:100px;height:100px;padding:3px}  
 #random-posts li{margin: 0px 0px 10px 0px;}  
 </style>  
  </script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.hackingdream.net/2017/06/random-posts-blogger-widget-with-thumbnails-top.html">Random Posts Widget</a>


4)Random Post Widget for Blogger with Thumbnails 4 with CSS Image Effect





     <style>  
 #random-posts img{border-radius: 50px;float:left;margin-right:5px;  
 width:75px;height:75px;background-color: #FFFFF;padding: 3px;transition: all 0.2s linear 0s;}  
 #random-posts img:hover{opacity: 0.6;}  
 ul#random-posts {list-style-type: none;padding: 0px;}  
 #random-posts a {font-size: 12px;text-transform:uppercase; padding: 0px auto 5px;}  
 #random-posts a:hover {text-decoration: none;}  
 .rp-snippet {font-size: 11px;background: none; padding: 5px; margin-right: 8px;}  
 #random-posts span {}  
 #random-posts li {margin-bottom: 10px;border-bottom: 1px solid #EEEEEE; padding: 4px;}  
 </style>  
 <ul id='random-posts'>  
 <script type='text/javaScript'>  
 var rdp_numposts=5;  
 var rdp_snippet_length=120;  
 var rdp_info='no';  
 var rdp_comment='comment';  
 var rdp_disable='Comments Disabled';  
 var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};  
 </script>  
 <script type='text/javaScript'>   
 function random_posts(json){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0F235lxJ5sNItlRkmEFJP7eNCIzKC-HoCdyx3ftt26ej060QqHVr8pVytfvYVZy1iAhovsK26hval4Sf39mSIz5C3YLkXI4Zuw5lSvJGgDObaNu3OvSMDqFaLiHphaBvwcyn-gQ4E-1Y/s1600/no-image-available.jpg"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</div></span>'};document.write('<div class="rp-snippet">'+rdp_snippet+'</div><div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};  
 </script>  
 </ul>  
  </script><a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.hackingdream.net/2017/06/random-posts-blogger-widget-with-thumbnails-top.html">Random Posts Widget</a>




That's it, these are the four most widely used random post blogger widgets with thumbnails. if you edit the number of posts, comments, images, and everything 
To change No of posts to appear on widget("1-10"better)
To change the appearance of Thumbnails(true or false)
To change the appearance of Readmorelink(true or false)
To change the appearance of  CommentsLink(true or false)
To change the appearance of Date(true or false)



===============     Hacking Don't Need Agreements     ===============
Just Remember One Thing You Don't Need To Seek Anyone's Permission To Hack Anything Or Anyone As Long As It Is Ethical, This Is The Main Principle Of Hacking Dream
            Thank You for Reading My Post, I Hope It Will Be Useful For You

I Will Be Very Happy To Help You So For Queries or Any Problem Comment Below or You Can Send me a Mail at Bhanu@hackingdream.net


,
By:
Bhanu Namikaze

Bhanu Namikaze is an Ethical Hacker, Security Analyst, Blogger, Web Developer and a Mechanical Engineer. He Enjoys writing articles, Blogging, Debugging Errors and Capture the Flags. Enjoy Learning; There is Nothing Like Absolute Defeat - Try and try until you Succeed.

No comments:

Post a Comment