Introduzione
Con questo script sarete in grado di inserire un messaggio o alert nel vostro sito a comparsa ogni
x ore, potendo impostare il parametro a scelta.
In questo modo potete dire addio a tutti i messaggi assillanti che ad ogni accesso disturbano i vostri utenti.
Lo script ha due varianti: la prima mostra un box classico nel sito, il secondo un alert.
Versione messaggio
Per mostrare un messaggio
classico basterà utilizzare questi codici.
Inserire questo codice nel box html (Amministrazione → Grafica → Codice HTML) dove si vuole inserire l'avviso (ad esempio decidendo di inserirlo solo in homepage, in tutte le pagine o anche in una singola sezione):
HTML
<div id="avviso_giornaliero"><div class="close_box" onclick="document.querySelector('#avviso_giornaliero').style.display='none';">Chiudi</div>
MESSAGGIO</div>
Al posto di
MESSAGGIO inserite ciò che volete mostrare nel box, può essere qualsiasi cosa (anche codice html).
Lo script vero e proprio si può inserire direttamente sotto il box html appena inserito ed è questo:
HTML
<script type="text/javascript">
var hours_delay = 24,
date_now = Math.round(+new Date()/1000);
if (typeof localStorage['avviso_giornaliero'] == 'undefined' || typeof localStorage['avviso_giornaliero'] != 'undefined' && (parseInt(localStorage.getItem('avviso_giornaliero'))+(hours_delay*3600)) < date_now) {
localStorage.setItem('avviso_giornaliero', parseInt(date_now));
document.querySelector("#avviso_giornaliero").style.display='block';
}
</script>
L'unica modifica da fare a questo codice è il valore
24 ad hours_delay se si vuole modificare ogni quanto si vuole mostrare l'avviso (in ore).
Infine inserire questo codice in Colori e stili:
HTML
#avviso_giornaliero {display: none; position: fixed; z-index: 9; left: 37%; top: 120px; background: #FFF; border-radius: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, .1)}
#avviso_giornaliero .close_box {font-size: 12px; margin: 10px auto; font-weight: bold; cursor: pointer}
Questo serve per mostrare il box fisso sulla pagina, sempre in primo piano: si può modificare a piacimento modificando gli stili come meglio si crede, l'importante è che permanga il
display: none nella prima dichiarazione.
Versione alert
La seconda versione mostra invece un alert e consiste solo della parte javascript, per cui bisognerà inserire questo codice nel box html (Amministrazione → Grafica → Codice HTML) dove si vuol far apparire l'alert.
HTML
<script type="text/javascript">
var hours_delay = 24,
date_now = Math.round(+new Date()/1000);
if (typeof localStorage['avviso_giornaliero'] == 'undefined' || typeof localStorage['avviso_giornaliero'] != 'undefined' && (parseInt(localStorage.getItem('avviso_giornaliero'))+(hours_delay*3600)) < date_now) {
localStorage.setItem('avviso_giornaliero', parseInt(date_now));
alert("Messaggio");
}
</script>
Qui le modifiche da fare sono due: il numero di ore come nella versione precedente e
Messaggio nel codice dell'alert: ricordarsi che il testo deve essere dentro gli apici (ad esempio
alert("Ciao a tutti"); e non
alert(Ciao a tutti); che non funzionerebbe).
Questi forniti sono codici di base da poter usare per mostrare un avviso/alert nel proprio sito con un tempo scandito, è molto personalizzabile (sia graficamente che a livello di script, ad esempio mostrando l'avviso solo per i visitatori o solo per gli utenti registrati, e così via), ma date le molteplici circostanze sarebbe stato insufficiente dare qualche esempio di base: se si è alla ricerca di una determinata modifica si può chiedere nella sezione di supporto script di questo forum.
