Shoutbox: Guida all'installazione

Tutti i fondatori di siti web sono alla ricerca della chiave del successo: visite, utenti, materiale disponibile, grafica, tools, utilità... sono molti gli aspetti che possono essere considerati alla base dell'alta performace dei colossi di riferimento. Certamente creare contenuti accattivanti e interessanti risulta fondamentale, tuttavia bisognerebbe anche cercare sempre nuovi modi per spingere le persone a partecipare attivamente alla vita del forum o blog, senza limitarsi ad accrescere l'anonima massa di coloro che vengono definiti lurkers.
La ShoutBox rappresenta uno strumento eccezionale di comunicazione diretta e immediata tra utenti, nonché un'ottima opportunità per migliorare il rapporto tra questi ultimi e lo staff del forum o blog: essa può essere usata per scambiare saluti od opinioni, organizzare discussioni ed esprimere impressioni su qualsiasi fatto, notizia o argomento. Creato da Nicoxys per le community di ForumFree, ForumCommunity e BlogFree, questo script è uno delle più famose funzionalità utilizzate dai principali plugin per forum CMS (vBulletin, IPBoard, Mybb). La ShoutBox implementa in un'unica struttura diversi tools gradevoli e di pratica utilità per i forum e blog. Grazie ad un semplice pannello di amministrazione sarà possibile gestire autonomamente lo script, usufruendo di molte funzioni che contribuiscono a renderlo uno strumento indispensabile per il vostro forum. È possibile visionare un esempio della ShoutBox nella homepage del ForumFree Board.

Installazione

L'inserimento della ShoutBox sul forum o blog è semplicissimo. Grazie al pannello di gestione script, EasyScript, disponibile per tutti i siti e accessibile da Amministrazione > Funzioni aggiuntive > Script e codici, è sufficiente cercare lo script nell'elenco e cliccare sul pulsante verde "Installa" presente sotto l'anteprima.

Impostazioni

Tramite il pannello EasyScript è possibile iniziare a personalizzare la propria ShoutBox. Cliccando sul pulsante azzurro "Impostazioni" presente sotto l'anteprima dello script dopo averlo installato, si potrà agire su tre opzioni:

1. Dove verrà inserita la ShoutBox?: questo select permette di decidere la posizione della ShoutBox nel forum o blog. Sono disponibili 9 opzioni per meglio adattarsi alla struttura dei vari siti:
   1. [Start] Codice HTML che sarà mostrato in CIMA a tutte le pagine: lo script sarà inserito in cima a tutte le pagine prima di eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   2. [End] Codice HTML che sarà mostrato in CIMA a tutte le pagine: lo script sarà inserito in cima a tutte le pagine dopo eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   3. [Start] Codice HTML che sarà mostrato in tutte le pagine sotto il logo del sito: lo script sarà inserito in tutte le pagine sotto il logo del sito prima di eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   4. [End] Codice HTML che sarà mostrato in tutte le pagine sotto il logo del sito: lo script sarà inserito in tutte le pagine sotto il logo del sito dopo eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   5. [Start] Codice HTML che sarà mostrato nella homepage del sito: lo script sarà inserito solo nella homepage prima di eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   6. [End] Codice HTML che sarà mostrato nella homepage del sito: lo script sarà inserito solo nella homepage dopo eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   7. [Start] Codice HTML che sarà mostrato in FONDO a tutte le pagine: lo script sarà inserito in fondo a tutte le pagine prima di eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   8. [End] Codice HTML che sarà mostrato in FONDO a tutte le pagine: lo script sarà inserito in fondo a tutte le pagine dopo eventuali codici presenti nell'omonimo box in Amministrazione > Grafica > Codice HTML.
   9. Codice HTML che sarà mostrato sopra le pubblicità: lo script sarà inserito in fondo a tutte le pagine prima delle pubblicità standard della piattaforma.
2. Selettore dell'elemento dove inserire la ShoutBox (opzionale): se si vuole inserire lo script in un luogo diverso dai precedenti, ad esempio solo in alcune sezione, oppure tra i codici presenti nei vari box di amministrazione, è possibile specificare in questo campo l'elemento, precedentemente inserito nel sito, che dovrà contenere la ShoutBox.
3. Caricamento solo a fine pagina: selezionando questa opzione, la ShoutBox verrà caricata solo dopo tutti gli altri elementi della pagina, dando precedenza a questi ultimi.

Personalizzazione: il pannello Amministrazione

Per accedere al pannello di amministrazione della ShoutBox è sufficiente cliccare sull'icona con l'ingranaggio presente a destra sotto il box coi messaggi. Il pannello è visibile solo agli amministratori e moderatori della ShoutBox. Attenzione: spesso è necessario ricaricare manualmente la pagina per rendere effettive le modifiche!

Dopo aver cliccato, si aprirà un pop-up con tre tab in alto al centro, ciascuno dei quali offre la possibilità di personalizzare impostazioni differenti:

1. Impostazioni: il tab permette di personalizzare:
   1. Titolo: il titolo che verrà visualizzato sopra i messaggi della ShoutBox. Valore di default: ShoutBox. Non è possibile inserire codici HTML/CSS in questo campo.
   2. Classe personalizzata: un'eventuale classe che verrà aggiunta al div che racchiude la ShoutBox. Valore di default: tag.
   3. Segnaposto messaggi: un eventuale placeholder che sarà visualizzato nel box in cui si inserisce il messaggio. Alcuni valori diffusi sono: Lascia un saluto!, Scrivi qualcosa... o alcune comunicazioni da parte dello staff, per le quali tuttavia si consiglia l'uso del campo "Avviso" descritto in seguito.
   4. Lunghezza massima messaggi: il numero massimo di caratteri per messaggio. Valore di default: 1000. Valore massimo consentito: 1500.
   5. Avviso: un'eventuale comunicazione che sarà visualizzata sopra tutti i messaggi della ShoutBox, sotto il titolo, senza scorrere con l'aggiunta di altri testi, rimanendo quindi sempre visibile. Non è possibile inserire codici HTML/CSS in questo campo.
   6. Lista spammabili: una lista di siti separati da virgole che sarà possibile linkare nei messaggi della ShoutBox. Se un sito non è inserito e non è presente tra quelli abilitati di default, il suo link sarà rimosso in automatico dal messaggio (dopo averlo inviato) e sarà sostituito da -link rimosso-. Se viene inserito il valore shout_enable_all l'antispam sarà disabilitato e sarà quindi possibile inserire qualsiasi link nei messaggi inviati in ShoutBox.
   7. Visualizza Avatar: se impostato su Sì aggiunge una miniatura dell'avatar dell'utente che ha inviato il messaggio accanto a esso.
   8. Visualizza NickName: se impostato su Sì inserisce il nickname dell'utente che ha inviato il messaggio accanto a esso. Hint: se in questa opzione e nella precedente si seleziona No si otterrà una ShoutBox completamente anomina!
   9. Abilita Bot: se impostato su Sì permette l'interazione con il bot della ShoutBox. Sono disponibili diversi comandi per comunicare col bot, tutti preceduti dal punto esclamativo:
      • !saggio {DOMANDA}: permette di porre una domanda al bot. Esempio: !saggio Come va oggi?
      • !ovvio: il bot risponderà con una frase ovvia. Esempio di risposta: Due+Due non fa diciassette.
      • !comico: il bot risponderà con una barzelletta. Esempio di risposta: Il maestro disse kung....e kung fu!
      • !aforisma: il bot risponderà con un aforisma. Esempio di risposta: L'amore è un frammento di infinito caduto sulla terra.
      • !colmo: il bot risponderà con un colmo. Esempio di risposta: Colmo del postino: perdere la posta in gioco.
   10. Crediti vicino: se abilitato inserisce i crediti all'FFBoard per aver creato la ShoutBox.
   11. Inverti ordine messaggi: se impostato su Sì i messaggi più vecchi saranno sopra, mentre l'ultimo messaggio inviato sarà quello più in basso, quindi per leggere i messaggi precedenti occorrerà scorrere verso l'alto, esattamente come nelle comuni chat.
2. Gruppi: il tab permette di personalizzare:
   1. Moderatori: i moderatori della ShoutBox possono cancellare ogni messaggio, visualizzare gli ip di coloro che hanno inviato un messaggio e modificare le impostazioni tramite il pannello amministrazione. È possibile inserire un nuovo moderatore della ShoutBox scrivendo il suo nickname o ID nell'apposito campo Cambia stato utente, selenzionando Mod dal select e premendo su Salva accanto a Mod. Qualsiasi utente può essere moderatore della ShoutBox, indipendentemente dall'effettivo ruolo svolto nel forum. Il fondatore e gli amministratori aggiunti sono automaticamente moderatori, non occorre inserirli. Per rimuovere un moderatore è sufficiente cliccare sul segno meno di fianco al suo nickname. Hint: è possibile nominare dei moderatori anche tramite l'apposito gestore sviluppato da FFBoard.
   2. Bannati: gli utenti bannati non potranno scrivere in ShoutBox. A differenza del ban dal forum o blog, disponibile nell'apposito pannello in Amministrazione > Utenti > Ban, l'utente allontanato dalla ShoutBox continuerà a vedere i messaggi scritti e potrà comunque partecipare alle discussioni del forum o blog. Per bannare un utente è sufficiente inserire il suo nickname o ID nell'apposito campo Cambia stato utente, selezionando Ban dal select e premendo su Salva accanto a Ban. Per rimuovere un utente dal ban (c.d. sbannare) è sufficiente cliccare sul segno meno di fianco al suo nickname. Naturalmente coloro che sono bannati dal forum o blog sono anche bannati dalla ShoutBox, non potendo accedere a nessun contenuto del sito.
   3. Abilita alla scrittura solo alcuni gruppi: questo comando consente di fornire la possibilità di scrivere nella ShoutBox solo agli utenti che appartengono a determinati gruppi nel forum o blog. Se non si abilita nessun gruppo, tutti possono scrivere, esclusi i bannati. Un gruppo è abilitato quando lo sfondo è grigio e il nome del gruppo è scritto in bianco (salvo personalizzazioni effettuate nei singoli siti tramite CSS). I moderatori della ShoutBox potranno sempre scrivere, ma non potranno modificare questa impostazione.
3. Azioni: il tab permette di eseguire le seguenti operazioni:
   1. Reset Messaggi: se cliccato cancella tutti i messaggi presenti in ShoutBox.
   2. Reset Impostazioni: se cliccato ripristina le impostazioni di default.
   3. Importa da TagBoard: se cliccato importa i messaggi scritti nella TagBoard del forum o blog. L'operazione cancellerà eventuali messaggi già scritti in ShoutBox.
   4. Test Mode: se cliccato creerà una serie di messaggi fittizi come dimostrazione del funzionamento della ShoutBox. Nell'alert che compare si potrà scegliere se visualizzare la ShoutBox come utente o come visitatore. Per uscire dalla modalità test occorre visitare in una nuova scheda del browser il proprio forum o blog oppure ricaricare la pagina dopo aver tolto dall'url ?shout_test ed eventualmente tutto ciò che segue.

Personalizzazione: il pannello Preferenze

Cliccando sull'icona con la stella diverrà visibile il pannello Preferenze o Impostazioni Utente. Si tratta di un pop-up disponibile a tutti gli utenti che consente alcune personalizzazioni user-side:

1. Lista ignore: si tratta di un elenco di utenti i cui messaggi non saranno visualizzati dall'utente che ha impostato la preferenza. Per aggiungere nella lista un utente è sufficiente inserire il suo nickname o ID nell'apposito campo Inserisci in lista ignore e cliccare sul Salva accanto. Il nickname dell'utente comparirà nella Lista ignore sottostante. Per togliere un utente dalla lista è necessario cliccare sul segno meno accanto al suo nickname. Se si vuole svuotare tutta la lista si può cliccare su Svuota sopra l'elenco degli username. Un esempio del funzionamento del tool è il seguente: supponendo che l'account Nicoxys inserisca l'username Steb95 nell'apposito campo, tutti i messaggi inviati da Steb95 non compariranno a Nicoxys, ma continueranno ad apparire agli altri utenti che non hanno inserito quel nickname nella lista ignore. Hint: i moderatori possono inserire utenti nella lista ignore, tuttavia questa pratica è sconsigliata in quanto non consentirà loro un'adeguata gestione delle discussioni che avvengono in ShoutBox.
2. Lista siti spammabili: si tratta di una semplice lista informativa dei siti i cui link possono essere inseriti nei messaggi in ShoutBox. Cliccando su (Visualizza default) comparirà la lista dei siti abilitati di default.
3. Impostazioni Utente: si tratta delle vere e proprie impostazioni personalizzabili dall'utente:
   1. Nickname: un eventuale nickname alternativo che comparirà solo accanto ai messaggi inviati in ShoutBox (se tale opzione non è disabilitata dai moderatori tramite il pannello amministrazione). Hint: modificare il proprio nickname in ShoutBox non garantisce alcun anonimato, infatti l'immagine profilo (se non disabilitata) e il link all'account che ha inviato il messaggio permetteranno ai moderatori e agli altri utenti di riconoscere l'autore del messaggio.
   2. Notifica sonora: se impostato su Sì ogni nuovo messaggio in Shoutbox sarà accompagnato da una notifica sonora se in quel momento si sta agendo su un'altra finestra del browser o se il focus non è sulla ShoutBox.
4. FeedBack e Proposte: si tratta di un semplice link che rimanda alla sezione Proposte script dell'FFBoard, creatore e gestore della ShoutBox.

Utenti Online

Cliccando sull'icona con gli users sarà possibile visualizzare gli utenti online sulla ShoutBox in quel momento. Gli utenti anonimi saranno visibili solo ai moderatori dello script.

Editor

Per aprire l'editor della ShoutBox è necessario cliccare sull'icona con la matita. Nei messaggi è possibile usare solo BBCode, ma grazie all'editor non sarà necessario inserire alcun codice. I pulsanti disponibili sono:

• SPOILER: il tasto permette l'inserimento di uno spoiler in un messaggio. BBCode generato: [SPOILER][/SPOILER].
• URL: il tasto permette l'inserimento di un link. BBCode generato: URL=link/URL (racchiusto tra parentesi quadre). Hint: se il dominio non è tra l'elenco di quelli spammabili, all'invio del messaggio verrà sostituito e il codice generato diverrà URL= - link rimosso - /URL (racchiusto tra parentesi quadre).
• B: il tasto permette l'inserimento di un testo in grassetto. BBCode generato: [B][/B].
• I: il tasto permette l'inserimento di un testo in corsivo. BBCode generato: [I][/I].
• U: il tasto permette l'inserimento di un testo sottolineato. BBCode generato: [U][/U].
• S: il tasto permette l'inserimento di un testo barrato. BBCode generato: [S][/S].
• Colore: il tasto permette l'inserimento di un testo colorato. BBCode generato: [COLOR=codice_colore][/COLOR].
• Sfondo: il tasto permette l'inserimento di un testo con uno sfondo. BBCode generato: [BACK=codice_colore][/BACK].
• Font: il tasto permette l'inserimento di un testo con un font differente da quello del forum o blog. BBCode generato: [FONT=nome_font][/FONT]. I font disponibili sono: Arial, Times, Courier, Impact, Geneva, Optima, Helvetica, Verdana, Book Antiqua, Trebuchet MS.
• Emoticons: il tasto permette l'inserimento di una faccina. BBCode generato: emoticon.

Modifica e Rimozione di Messaggi

Per una corretta gestione delle conversazioni la ShoutBox fornisce ai moderatori la possibilità di modificare e cancellare qualsiasi messaggio inviato da ogni utente. Al singolo utente invece è riservato il solo diritto di modificare e cancellare i propri messaggi, senza poteri su quelli inviati da altri account. Per modificare o cancellare un messaggio in ShoutBox è sufficiente cliccare rispettivamente sull'icona blu con la matita e sull'icona rossa con la X presenti a fianco di ogni messaggio se si è moderatori o a fianco dei propri messaggi se si è utenti. Per la modifica sarà anche necessario cliccare sul tasto Salva che apparirà di fianco al messaggio. La terza icona, con la i, permette infine ai moderatori di avere informazioni riguardo all'IP dell'autore del messaggio.

Eventi per Sviluppatori

Per gli scripter che desiderano creare codici che interagiscono con la ShoutBox sono stati aggiungi tre eventi in momenti distinti:

1. Evento che si avvia quando la ShoutBox si è completamente caricata:
   HTML

   document.addEventListener('ffb_shoutbox_loaded', function () {
   console.log('ShoutBox caricata');
   }, false);
2. Evento che si avvia ogni volta che l'utente che visualizza la ShoutBox invia un nuovo messaggio:
   HTML

   document.addEventListener('ffb_shoutbox_newpost', function () {
   console.log('L\' utente ha postato un nuovo messaggio');
   }, false);
3. Evento che si avvia ogni volta che la ShoutBox si aggiorna in presenza di nuovi messaggi:
   HTML

   document.addEventListener('ffb_shoutbox_refresh', function () {
   console.log('Nuovi messaggi in ShoutBox');
   }, false);

F.A.Q. - Frequently Asked Questions

Di seguito verranno presentate una serie di domande ricorrenti sulla ShoutBox, con relative risposte.

1. Come si evita che le parole vengano spezzate in modo casuale quando si invia un unico messaggio che occupa più righe?
   Si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox li.shout_msg {word-break: normal;}
   Lo stesso codice può essere inserito per la versione mobile in Amministrazione > Grafica > Mobile/App


2. Come si cambiano i colori dei nickname in ShoutBox?
   Per tutti i nickname si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox .shout_message_object > li > .sb_nick > a {color: #HEX;}
   Per i moderatori si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox li.can_moderate > .sb_nick > a {color: #HEX;}
   Per un utente specifico si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox li.user_ID > .sb_nick > a {color: #HEX;}
   Sostituendo a ID l'ID dell'utente il cui nickname sarà colorato. In tutti i codici occorre sostituire a HEX il codice del colore che si desidera, inoltre gli stessi possono essere inseriti in Amministrazione > Grafica > Mobile/App per la versione mobile del forum o blog.


3. Come si sposta la data del messaggio a sinistra, prima del nickname?
   Si può inserire in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox .shout_message_object li > span.when {float: none;}


4. Come si inserisce uno sfondo al div contenente tutti i messaggi?
   Si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox .shoutbox_messages {background-color: #HEX;}
   Sostituendo a HEX il codice del colore che si desidera. È possibile anche inserire un'immagine come sfondo, in questo caso nel codice precedente occorre sostituire background-color con background-image: url('') e inserire tra gli apici il link allo sfondo. Per la versione mobile si può utilizzare lo stesso codice, inserendolo in Amministrazione > Grafica > Mobile/App. Hint: è possibile che i codici forniti siano sovrascritti da altri codici già presenti nei CSS del forum o blog, in questo caso si può provare ad aggiungere !important dopo la dichiarazione oppure chiedere aiuto aprendo un topic in questa sezione.


5. Perché inserendo un nickname nella lista ignore, tra i moderatori o tra i bannati mi compare il messaggio d'errore L'utente non può essere inserito in questa lista.?
   I fondatori e gli amministratori aggiunti non possono essere inseriti nella lista ignore o tra i bannati. Inoltre non è necessario aggiungerli tra i moderatori in quanto hanno già i poteri di moderazione della ShoutBox.


6. Come si aumenta o diminuisce la grandezza del font dei messaggi e dei nickname?
   Si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox .shout_message_object {font-size: NUMpx;}
   Sostituendo a NUM il numero dei pixel che si desidera. Il codice può essere inserito anche in Amministrazione > Grafica > Mobile/App per personalizzare la versione mobile.


7. Come si aumenta la distanza tra un messaggio e l'altro?
   Si può aggiungere in Amministrazione > Grafica > Colori e stili il seguente codice:
   CODICE

   .sb_shoutbox .shout_message_object li.shout_msg {padding: NUMpx 4px !important;}
   Sostituendo a NUM il numero di pixel che si desidera. Lo stesso codice (anche senza !important) può essere inserito in Amministrazione > Grafica > Mobile/App per personalizzare la versione mobile.


8. Quali sono i siti spammabili di default?
   I siti spammabili sempre sono: supporto.forumfree, chat.forumfree, upload.forumfree, img.forumfree, ffboard.forumfree, ffb.forumfree, facebook, twitter, bing, google, youtube, imgur, tinypic, puu oltre al forum in cui è installata la shout.