Widget degli Articoli Casuali con miniature per Blogger.

Come installare il widget dei Post Casuali per Blogger con Miniature completamente personalizzabile.

Fino a qualche mese fa era perfettamente funzionante il gadget dei Post Casuali che mostrava ai lettori degli articoli scelti a caso tra quelli pubblicati. Da quando Blogger ha modificato la procedura per widget esterni questo come altri gadget ha smesso di funzionare. Ho pensato quindi di riproporre una versione funzionante che si installa mediante codice senza bisogno di accedere alle API di Blogger.

Si tratta di un widget personalizzabile nel numero degli elementi e in altri parametri che credo incontrerà il favore di molti lettori. Non ci soni difficoltà di installazione visto che non è neppure necessario modificare il modello ma solo usare un Elemento pagina.

Si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla questo codice

<style>
#post-casuali img{border-radius: 10px;float:left;margin-right:5px;
width:75px;height:75px;background-color: #F7F7F7;padding: 3px;transition: all 0.3s linear 0s;}
#post-casuali img:hover{opacity: 0.6;}
ul#post-casuali {list-style-type: none;padding: 0px;}
#post-casuali a {font-size: 16px; padding: 0px auto 5px;}
#post-casuali a:hover {text-decoration: none;}
.rp-snippet {font-size: 12px; text-align:justify; background: none; padding: 4px; margin-right: 6px;}
#post-casuali span {}
#post-casuali li {margin-bottom: 10px;border-bottom: 1px solid #ddd; padding: 4px;}
</style>
<ul id='post-casuali'>
<script type='text/javaScript'>
var rdp_numposts=6;
var rdp_snippet_length=100;
var rdp_info='yes';
var rdp_comment='Commenti';
var rdp_disable='Commenti Disabilitati';
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 post_casuali(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/AVvXsEjQMv4kicv1IXK5LJxHKkFjZM7_9Avg-5EZJzIqssIwBmJcjGJdPciyjh5uk_LZVUJU7ylRDTVAVt9iwYHxklIP7nVVyJ5z46x8BnBwnEgCzshbyORaE79UnhG1H07gTlH6jC-U46MddXc/s172-no/"}}};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('<br/><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=post_casuali\"><\/script>')};
</script>
</ul>

Si salva e si posiziona nella sidebar. Le personalizzazioni più importanti riguardano

1. La dimensione delle miniature proposta di 75 pixel
2. La dimensione dei font del titolo proposta a 16 pixel
3. La dimensione dei font dello snippet proposta a 12 pixel
4. Il numero dei post mostrati proposti come 6
5. Il numero dei caratteri dello snippet, 100 quello proposto
6. La giustificazione dello snippet (text-align:justify)
7. La visualizzazione o meno dello snippet (rdp_info='yes'; oppure no)
8. L'URL della immagine di default se non ce ne fossero (colorato di viola)
9. Codici dei colori, stile dei bordi, opacità e durata della transizione

MOSTRARE IL WIDGET SENZA DATA

Se non vi piace la data inserita subito sotto il titolo basta usare quest'altro codice

<style>
#post-casuali img{border-radius: 10px;float:left;margin-right:5px;
width:75px;height:75px;background-color: #F7F7F7;padding: 3px;transition: all 0.3s linear 0s;}
#post-casuali img:hover{opacity: 0.6;}
ul#post-casuali {list-style-type: none;padding: 0px;}
#post-casuali a {font-size: 16px; padding: 0px auto 5px;}
#post-casuali a:hover {text-decoration: none;}
.rp-snippet {font-size: 11px; text-align:justify; background: none; padding: 4px; margin-right: 6px;}
#post-casuali span {}
#post-casuali li {margin-bottom: 10px;border-bottom: 1px solid #ddd; padding: 4px;}
</style>
<ul id='post-casuali'>
<script type='text/javaScript'>
var rdp_numposts=6;
var rdp_snippet_length=100;
var rdp_info='yes';
var rdp_comment='Commenti';
var rdp_disable='Commenti Disabilitati';
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 post_casuali(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/AVvXsEjQMv4kicv1IXK5LJxHKkFjZM7_9Avg-5EZJzIqssIwBmJcjGJdPciyjh5uk_LZVUJU7ylRDTVAVt9iwYHxklIP7nVVyJ5z46x8BnBwnEgCzshbyORaE79UnhG1H07gTlH6jC-U46MddXc/s172-no/"}}};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_commentsNum)+'</div></span>'};document.write('<br/><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=post_casuali\"><\/script>')};
</script>
</ul>

Dopo aver salvato si otterrà questo risultato




Le personalizzazioni sono le stesse del codice precedente.