L'Editor dei Contenuti integrato nel sito (in Realtà l'editor serve per tutti i tipi di testi come descrizioni dei Downloads e Gallery, commenti e quant'altro) ha lo scopo di facilitare la scrittura di Contenuti per chi non conosce l'HTML e velocizzarla in generale per le operazioni più comuni.

Questa guida ha lo scopo di illustrare le basi senza andare troppo a fondo. Sarà vostro compito testare i vari TAGS ed esercitarvi alla scrittura dei contenuti per poter comprendere meglio il suo utilizzo.

Per una comoda navigazione ecco il Menù / Indice

Introduzione ai BBCODES
Introduzione all'HTML
Usare l'Editor
Usare la Pulsantiera (Format Box)
Fissare il Testo Aggiuntivo
Il convertitore
Scrivere un Contenuto
Guida alle ancore
Salvataggio Contenuto
Elenco dei BBCODES

Prima di tutto, ogni pagina web andrebbe scritta in HTML in quanto esso è l'UNICO linguaggio che il Browser comprende. Il BBCODE è un codice simile all'HTML che permette di raggruppare insieme alcune operazioni che si fanno comunemente quando si scrive una pagina. Quindi senza conscere HTML possiamo, usando i BBCODES scrivere una pagina con tutti i fronzoli e dati necessari.

Un codice BBCODE è fatto così



dove NOME è il nome del BBCODE (e del TAG bbcode), l'ATTRIBUTO (non sempre presente) è invece un dato aggiuntivo per dare indicazioni al codice, il TESTO è il testo a cui applico il BBCODE.

Un piccolo esempio è il codice per scrivere un testo in ROSSO.



Scrivere questo testo in HTML avrebbe impiegato più tempo (e la conoscenza dell'HTML stesso) quindi di certo abbiamo avuto un guadagno !!

Alcuni TAG bbcode non hanno testo aggiuntivo, come ad esempio il TAG per il grassetto, corsivo e via dicendo la formattazione del testo



Infine a volte non si usa neanche il testo. Ad esempio con il codice per allegare video youtube



Come possiamo vedere ci sono codici BBCODES per ogni gusto e necessità (ed altri possono essere creati chiedendoli al Webmaster). Una lista completa dei BBCODES validi con relativa spiegazione è reperibile in fondo a questa pagina.

Una piccola digressione che conviene fare è su come viene letto l'HTML in una pagina web. E' bene sapere infatti che scrivere in HTML (e quindi scrivere contenuti sul sito) è diverso dallo scrivere testi normali, soprattutto per quel che riguarda l'andare a capo nel testo.

Infatti, ogni volta che andiamo a capo scrivendo un contenuto, non andremo a capo nella pagina effettiva che vedremo salvando il contenuto stesso !! L'HTML considera che siamo andando a capo SOLO quando usiamo dei particolari TAG.

Per andare a capo quindi all'interno dei nostri contenuti scritti con l'editor occorre usare i tag BBCODES seguenti



Altra puntualizzazione da fare è che è FONDAMENTARE chiudere OGNI TAG, che esso sia HTML o BBCODE, altrimenti la grafica del sito ed il contenuto stesso risultano sballati (verrà in futuro inserito un meccanismo di controllo che avvisa se ci sono TAGS non chiusi).

Iniziamo a vedere come usare l'editor con le conoscenze fin'ora acquisite. Entrando nell'Editor (quando creiamo o modifichiamo un contenuto) possiamo vedere, sotto la barra per il titolo, le iconcine per inserire i BBCODES.



Come possiamo vedere sono divisi per il tipo di operazione ed hanno delle immaginette abbastanza esplicative. Alcune sono abbastanza ovvie, come quelle per il Grassetto, Corsivo ecc... poi ci sono colori, testo a sinistra, destra e centrato (o Giustificato) e via dicendo.

Ci sono anche codici per inserire immagini e video, insomma ce n'è per tutti i gusti. In fondo a questa guida trovate un elenco dei BBCODES (e pulsante associato ad essi quando disponibile) con relativa descrizione e vi consiglio di imparare poco a poco a testarli ed a studiarne il comportamento.

Ricordiamo inoltre di usare sempre [2br] ed [br] per andare a capo dopo (e prima) di una immagine o video (Questo si nota con la praticaccia) e che in genere usando i comandi di formattazione come [center] e simili si ha un "a capo" in più, quindi regoliamoci di conseguenza.

La Pulsantiera, o Format Box è l'insieme di pulsanti e comandi per inserire BBCODES. In questa sezione vediamo una breve descrizione del suo utilizzo.

I pulsanti sono programmati per inserire il BBCODE associato al pulsante stesso "avvolgendo" il testo selezionato. Quindi ad esempio, seleziono il testo da fare in Grassetto e premo il pulsante del Grassetto ... et voilà !! Così vale per TUTTI gli altri pulsanti che devono "avvolgere" il testo (quasi tutti).

Molti BBCODES richiedono un attributo (il nome del colore, il testo del titolo, il font da usare e via dicendo) oltre al testo. Premendo sul pulsantino apparirà una finestra che vi chiede il testo da usare come attributo.

NOTA se utilizzate IE7 la finestrella apparirà solo confermando la sicurezza del sito, cosa abbastanza noiosa. Per questo motivo vi consiglio di togliere tali conferme dal Browser (Vale per tutti i siti però !!), per farlo andate in Strumenti -> Opzioni Internet -> Protezione (in alto) -> Livello Personalizzato -> Esecuzione Script -> Consenti ai siti Web di richiedere informazioni tramite finestre di Script -> ATTIVO, come indicato in figura



Tramite la Finestra di Script potete quindi inserire le info richieste per i vari attributi e personalizzare l'uso della pulsantiera. Notare che facendo ANNULLA sulla finesra il CODICE BBCODE non viene inserito, quindi se volete inserire un attributo nullo date CONFERMA con testo nella finestra vuoto.

Quando inseriamo il TAG bbcode per la sezione dobbiamo inserire due differenti attributi (maggiori info quando spiego come scrivere un contenuto) e quindi avremo due finestre. Dando annulla sulla prima (quella che chiede l'Ancora della sezione) NON invalidiamo il tag ma avremo una sezione SENZA ANCORA (maggiori info sulle ancore successivamente).

Nella pulsantiera posiamo notare due collegamenti speciali, vediamo come utilizzarli.

Possono capitare delle situazioni in cui occorre usare SEMPRE lo stesso attributo per i vari tag che inseriamo (ad esempio se devo mettere un grosso numero di TAG per il colore verde) e scrivere ogni volta daccapo il testo nella finesra può essere scomodo. Per questo possiamo comodamente premere "Fissa Testo Aggiuntivo" inserire l'attributo da FISSARE e dare Conferma.

In questo modo TUTTI i tag che useremo(quelli che richiedono un attributo) avranno lo STESSO attributo senza chiederlo. Per interrompere questo comportamento premiamo "Reset Testo aggiuntivo". Per cambiare il testo aggiuntivo premiamo "Fissa Testo aggiuntivo".

Per coloro che conoscono l'HTML potrebbe tornare utile certe volte andare a MODIFICARE il comportamento dei singoli BBCODES. Questo è possibile cliccando su "Apri il convertitore" ed incollando un TESTO che vogliamo venga CONVERTITO da BBCODE ad HTML. Quindi prendiamo l'HTML, modifichiamolo ed incolliamolo nel contenuto (ricordiamo che il sito riconosce sia i BBCODES che l'HTML puro).

NOTA Il convertitore OVVIAMENTE non funziona al contrario (da HTML a BBCODE).

Finalmente arriviamo al sodo, vediamo cioè come scrivere i nostri contenuti usando i BBCODES ed i pulsanti messi a disposizione nell'Editor. Ovviamente potete anche scrivere BBCODES senza usare i pulsanti ed andando a memoria (cosa comoda per i codici brevi e che si usano spesso).

Una regola FONDAMENTALE da applicare è che OGNI CONTENUTO è DIVISO IN SEZIONI. Una sezione è composta da diverse parti: UN TITOLO, cioè la barretta blu con sopra il testo del titolo di ogni sezione o Paragrafo; UN'ANCORA, cioè una sorta di ETICHETTA che identifica all'interno della pagina il contenuto in modo UNICO così da poterlo richiamare facilmente (successivamente una guida alle ancore); UN LINK AL TOP DELLA PAGINA (il pulsantino "top" che vediamo a sinistra del titolo) che se premuto porta in cima alla pagina attuale; IL CORPO DEL TESTO cioè tutto quello che va scritto dentro la sezione o paragrafo (quindi testo, immagini, video e quant'altro).

Niente paura, per chiarire le idee facciamo un esempio



Questo codice (che possiamo incollare usando l'apposito pulsante SEZIONE) crea una barretta del Titolo con dentro scritto Prova, crea un ancora di nome "test" e mette come TESTO della sezione il testo incluso dentro al BBCODE di nome "sezione". Ecco il risultato

Testo della sezione

Come possiamo vedere abbiamo creato una sezione con dentro del testo, ma poteva esserci QUALSIASI COSA (quindi spazio ai BBCODES). Fondamentale ricordarci di CHIUDERE il TAG scrivendo [/sezione] altrimenti la grafica del sito ed il contenuto risulteranno tutti sballati.

NOTA Se vogliamo solo inserire una barretta possiamo farlo usando il TAG [title] che funziona nel modo seguente (per il quale non esiste un pulsante]



il cui utilizzo è abbastanza ovvio (provare per credere).

Vediamo in questa Sezione cosa sono le Ancore e come utilizzarle. Esse possono rivelarsi uno strumento UTILISSIMO per la navigazione di contenuti MOLTO grossi o corposi e possono anche essere utili per collegare tra loro più contenuti.

Vediamo un'ancora come una "ETICHETTA" che identifica QUEL PUNTO (quello in cui mettiamo l'ancora) all'interno della pagina con il nome dell'ancora. Ad esempio



ha l'effetto di etichettare quel punto del testo o della pagina. La cosa bella adesso è che possiamo creare dei LINK HTML (collegamenti) che se premuti spostino la pagina IN QUEL PUNTO, semplicemente indicando il NOME dell'etichetta. Per fare un esempio vi sveliamo che abbiamo etichettato il punto dell'esempio con un ancora (quì in alto), accessibile cliccando quì.

Visto ?? Abbiamo realizzato il Link di poco fà usando questo codice



ma potevamo farlo così (accessibile cliccando quì)



Cioè inserendo #nome_ancora alla fine di un indirizzo web (assoluto o relativo come nell'esempio) possiamo visitare l'etichetta indicata. Questo ci aiuta ad esempio quando vogliamo visitare una etichetta di un altro contenuto, ad esempio



da come risultato questo collegamento che ci fà visitare (in una pagina esterna) una sezione apposita di nome 4 (infatti usiamo #4) dentro la pagina ff7/guida_faq.php).

Possiamo inoltre usare delle ancore speciali per il TOP DELLA PAGINA ([top][/top] e [gotop][/gotop]) qualora servissero.

Un uso estensivo delle Ancore viene fatto nel Menù in alto a questa guida ed all'interno della pagina stessa così che vi risulti maggiormente lampante l'utilizzo delle stesse.

Come lezione conclusiva discutiamo delle opzioni di Salvataggio, aggiornamento ed Anteprima del contenuto così da avere una visione completa dello stesso.

Prima di tutto in alto nell'editor possiamo vedere (quando applicabile) un campo per il TITOLO DEL CONTENUTO ed la caselletta "Sblocca e dai Titolo". Quando creaiamo un NUOVO contenuto da zero, esso è BLOCCATO (ha il nome blk_nome.php) cioè non è visibile dagli utenti esterni per motivi di sicurezza. Abilitiamo la caselletta e dando un TITOLO testuale, quando facciamo SALVA il contenuto si sblocca ed appare con il Titolo scelto.

Per bloccare di nuovo il contenuto usiamo il pulsante "Blocca" in basso a destra (questo cancella temporaneamente il titolo fintanto che il file prende come nome blk_nome.php).

In basso, sotto il campo per il testo possiamo vedere vari pulsanti. Con "Salva" il contenuto è salvato sul server e si torna al pannello di gestione files. Con "Aggiorna" salviamo il file tornando all'editor. Con "Aggiorna Anteprima" aggiorniamo SOLO l'anteprima che vediamo subito in basso, senza che il file venga salvato su disco. Con "Esci" torniamo al pannello perdendo il lavoro.

Le tre casellette accanto servono per dare comandi specifici, come quello per creare un Backup prima di salvare o quello per andare a capo senza usare i BR (Sconsigliato).

Come già accennato in basso vediamo la versione ATTUALE del contenuto, aggiornabile SINGOLARMENTE con "Aggiorna Anteprima".

Questa sezione comprende un elenco estensivo dei BBCODES disponibili e ne descrive il funzionamento ed i trucchi per usarli al meglio. Vediamoli uno per volta

Questa pagina è stata vista 433 volte/a

Voti ricevuti 1
Votazione