Calendario con eventi

Lo script pubblicato in questa guida vi consentirà di inserire nei vostri siti (forum o blog) un calendario con eventi (nel calendario si visualizza il mese in corso), a cui potrete aggiungere, nei giorni associati ad un evento, un messaggio visualizzato in un pop up (apribile cliccando sulla parola Evento a destra della data) e anche un link (questo inserito nella cifra della data), come esempio si potrebbe inserire il link di una discussione di avviso, o di comunicazioni riguardanti l'evento del giorno, o dove si possa parlare dell'evento, ma è comunque possibile inserire qualsiasi tipo di link.

Lo script è utilizzabile praticamente ovunque, può essere inserito non solo in un box di Codice HTML o in una pagina personalizzata, ma anche all'interno di una discussione, contenuto in un post, la procedura di installazione differisce leggermente a seconda di dove viene inserito il calendario, le varianti della procedura verranno spiegate dettagliatamente nel prossimo paragrafo della guida.


Per inserire il calendario in Codice HTML (per esempio in homepage) inserite i seguenti codici nel box corripondente a dove volete visualizzare il calendario



il primo codice è da inserire nel punto dove volete far visualizzare il calendario (si consiglia l'utilizzo di un contenitore, ad esempio una tabella con grafica uguale a quella del forum, oppure potete inserirlo in una cella dati di una tabella già presente), gli altri due sono da inserire nello stesso box di Codice HTML, sotto al primo codice

il secondo codice serve per inserire gli eventi nel calendario, per ogni evento andrà inserita una stringa di questo tipo (se inserite più eventi separateli con una virgola, come nell'esempio)

e_Giorno_Mese_Anno: {link: "https://newsboard.forumfree.it/", new_page: "true", mess: "Messaggio di prova 1!"}

nella prima parte inserite la data dell'evento, con i valori numerici di giorno, mese e anno, se la data scelta è il 31 dicembre 2016 scriverete quindi e_31_12_2016, fra le parentesi graffe sono presenti tre attributi che si possono aggiungere all'evento, mess è il messaggio visualizzato nel pop up quando si clicca sul marker Evento del calendario (nell'esempio è Messaggio di prova 1), link associa all'evento un link di vostra scelta (apribile cliccando sul numero del giorno), questo attributo è opzionale, e può essere omesso (come nel secondo evento dell'esempio, che contiene solo il messaggio), new_page è collegato a link, se inserito (con valore true) il link si aprirà in una nuova finesta (o scheda) del browser

il terzo codice è lo script che genera il calendario, da inserire sotto al secondo codice, e non richiede modifiche.

L'installazione in una pagina personalizzata è identica a quella già descritta, i tre codici vanno inseriti nel box della pagina, seguendo la stessa procedura dell'intallazione in Codice HTML, per installare il calendario in una discussione inserite il primo codice nel messaggio dove volete far visualizzare il calendario, gli altri due andranno inseriti in amministrazione, in Codice HTML -> Codice HTML che sarà mostrato in FONDO a tutte le pagine.

In tutti i casi, il secondo codice serve per inserire gli eventi, quindi se desiderate un calendario senza eventi potete ometterlo.


La grafica base del calendario si adatta alla skin utilizzata dal forum / blog in cui è installato, ma è completamente personalizzabile, come aspetto (colori, font, dimensioni del testo, eccetra), aggiungendo in colori e stili le classi corrispondenti ai vari elementi del calendario, qui di seguito trovate quelle fondamentali, la classe principale è

.nb_calendar

la barra con mese e anno ha come classe .sunbar, quindi è personalizzabile come

.nb_calendar .sunbar

la riga con i giorni della settimana (da lunedì a domenica) ha classe .weekday, le celle dei giorni hanno la classe .day,il marchio Evento è contraddistinto dal tag mark, quindi con .nb_calendar mark si agirà sia sulla parola Evento che sul messaggio contenuto nel popup, per agire solo sulla parola specificate .nb_calendar mark b, se invece volete personalizzare il testo del messaggio i selettori sono .nb_calendar mark span.

in questa pagina personalizzata https://newsboard.forumfree.it/?pag=calendario potete vedere un demo del calendario.