Pubblicato il 12/09/15e aggiornato il

Come mostrare un colore di sfondo casuale nei post di Blogger.

Come mostrare uno sfondo casuale in tutti i post di Blogger o in uno soltanto o anche in una pagina statica.
Siete dell'idea di offrire sempre qualcosa sempre di nuovo ai lettori del vostro sito? Se pensate che per fidelizzare i navigatori sia una buona scelta quella di sorprenderli allora potrebbe essere di vostro gradimento il trucco che vado a mostrarvi.

COME CAMBIARE COLORE DI SFONDO A TUTTI I POST DEL BLOG


Con il codice che andrò a presentare il colore dello sfondo dei post cambieranno in modo casuale e lo faranno ad ogni caricamento della pagina. Quindi se i lettori visualizzeranno lo sfondo di un certo colore pigiando su F5 per ricaricare la pagina cambierà di nuovo.

La casualità è totale e i colori vengono scelti tra i codici dei colori estraendo delle sestine ordinate tra tutte le cifre esadecimali (0, 1 ,2 ,3 ,4 ,5 ,6 ,7 ,8 ,9 ,A ,B ,C ,D ,E ,F). Lo script si basa su jQuery e quindi se fosse già presente nel vostro template non va nuovamente incollato il suo URL.

Dopo aver salvato il template si va su Modello > Modifica HTML e, subito sopra alla riga </head>, si incolla il codice seguente per poi salvare il modello.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
function get_random_color(){var e="0123456789ABCDEF".split("");var t="#";for(var n=0;n<6;n++){t+=e[Math.round(Math.random()*14)]}return t}$(function(){$(".post").each(function(){$(this).css("background-color",get_random_color())})})
//]]>
</script>

Il risultato sarà il seguente

sfondo-casuale-post-blogger

con i colori degli sfondi che sono assolutamente casuali. Lo script jQuery è stato evidenziato di giallo per rendere più semplice la sua cancellazione nel caso fosse già presente nel template.

COME MOSTRARE LO SFONDO CASUALE SOLO IN UN POST O IN UNA PAGINA


Mostrare uno sfondo casuale in tutti i post e le pagine del blog comporta dei problemi per quello che riguarda i colori del testo, dei link, dei link visitati e dei link puntati dal mouse. Naturalmente si possono scegliere dei colori molto chiari per renderli più facilmente visibili.

Se invece si decide di mostrare lo sfondo casuale solo in un post o in una pagina statica allora non c'è bisogno di modificare il modello. Dopo averlo creato si va su HTML e all'inizio si incolla

<div id='sfondo'>

mentre alla fine del codice si chiude con il tag </div>. Subito sopra alla riga iniziale si incolla

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js?ver=1.5' type='text/javascript'></script>
<script type='text/javascript'>//<![CDATA[
function get_random_color(){var e="0123456789ABCDEF".split("");var t="#";for(var n=0;n<6;n++){t+=e[Math.round(Math.random()*14)]}return t}$(function(){$(".post").each(function(){$(this).css("background-color",get_random_color())})})//]]></script>
<style>
#sfondo, h3.post-title {color:#fff !important;}
#sfondo a {color:#eee;}
#sfondo a:hover {color:#ddd;}
</style>

in questo modo

colore-sfondo-casuale

Si pubblica o si aggiorna come al solito.
I codici dei colori del testo, del titolo e dei link possono essere scelti a piacere.




Nessun commento :

Posta un commento

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.