[Guida] Come creare una Tabella

Come e dove creare la tabella
Per generare una tabella, con grafica uguale alla skin in uso, basta accedere al pannello amministrativo, sotto la voce Gestione codice HTML > Generatore di tabelle con grafica uguale a quella del forum. (si trova in alto, prima dei box, è il terzo link)
Basta specificare il numero di righe e quello delle colonne desiderate, se desiderate o meno lo spazio per i sottotitoli per le colonne e il tipo di allineamento del testo e questo tool crea il codice HTML della tabella da inserire nel box desiderato di Gestione codice HTML.

Come modificare la tabella
Il codice fornito dal generatore presenta essenzialmente tre parti: la parte blu e la parte verde devono essere sempre presenti, integralmente, la parte rossa invece è quella relativa ai contenuti della nostra tabella, varia quindi a seconda dei parametri impostati.

Il titolo
Per dare un titolo alla vostra tabella basta modificare la parola TITOLO a metà della parte blu, se non intendete dare un titolo alla tabella è consigliato inserire   al fine di evitare possibili errori di visualizzazione.
Se volete cambiare colore o stile del titolo, siccome stiamo lavorando in html, è indicato guardare l'apposita voce nel wiki.

I contenuti
Per inserire i contenuti nella tabella bisogna modificare la parola COLONNA ? (dove ? indica il numero della colonna) sostituendola con il testo da noi scelto.

ATTENZIONE!: in HTML le righe vengono indicate con il tag <tr> e le colonne con quello <td>, è bene ricordarsi che <tr> include sempre <td> e che l'ultimo tag aperto deve obbligatoriamente essere chiuso per primo, poi a scalare tutti gli altri.
Cosa vuol dire chiudere un tag? Significa riscrivere il tag apponendo uno slash ( / ) dopo la parentesi angolare di apertura ( < )
Per cui in base a quanto sopra detto la dicitura corretta è solamente questa: <tr> <td> .. </td> </tr>

Ovviamente all'interno della riga possono essere incluse più colonne, ripetendo i tag <td> .. </td> dopo l'ultima colonna.
Esempio: <tr> <td> colonna 1 </td> <td> colonna 2 </td> </tr>

Cosa analoga nel caso la tabella presenti più righe, infatti dopo il tag di chiusura: </tr> possiamo trovare altri 'blocchi' che indicano le righe.

Esempio:

<tr> <td> colonna 1 riga 1 </td> <td> colonna 2 riga 1 </td> </tr>
<tr> <td> colonna 1 riga 2 </td> <td> colonna 2 riga 2 </td> </tr>

ATTENZIONE!: per far sì che una colonna si estenda su più colonne non basta inserire un solo <td> .. </td> bisogna aggiungere al suo interno l'attributo colspan.
Tale attributo presenta questa dicitura: <td colspan="?" > .. </td> dove ? va sostituito con il numero di colonne che intendiamo far apparire in una sola riga.

Esempio 1:

	COLSPAN SU INTERA COLONNA
	COLONNA UNICA COLONNA1 COLONNA2

Codice:



Esempio 2:

	COLSPAN SU UNA PARTE
	COLONNA2 COLONNA3 COLONNA1 COLONNA2 COLONNA3

Codice:



Nel caso in cui, invece, vogliamo unire più righe l'attributo da usare è rowspan che funziona in maniera similare al precedente, si inserisce sempre all'interno della colonna, ma in questo caso si elimina la colonna 'in più' nella riga sottostante.

Esempio 1:

	TITOLO
	COLONNA1 COLONNA2 COLONNA3 COLONNA1 COLONNA2 COLONNA UNICA

Codice:



Esempio 2:

	TITOLO
	COLONNA SINISTRA COLONNA CENTRALE 1 COLONNA DESTRA COLONNA CENTRALE 2

Codice:



I sottotitoli
I sottotitoli inseriti dal generatore appaiono solo sopra alla prima fila di colonne, qualsiasi sia il numero inserito.
Nel caso sia necessario aggiungere dei sottotitoli anche nelle colonne sottostanti in codice da usare è il seguente e va inserito prima del blocco della riga:



ATTENZIONE!: ricordatevi di inserire tante colonne del sottotitolo, quante sono le colonne della tabella, se volete estendere un sottotitolo su più colonne usate l'attributo colspan.

Esempio 1:

	TITOLO
	SOTTOTITOLO COLONNA 1 SOTTOTITOLO COLONNA 2 SOTTOTITOLO COLONNA 3 COLONNA1 COLONNA2 COLONNA3 SOTTOTITOLO COLONNA 1 SOTTOTITOLO COLONNA 2 SOTTOTITOLO COLONNA 3 COLONNA1 COLONNA2 COLONNA3

Codice:



Esempio 2:

	TITOLO
	SOTTOTITOLO COLONNA UNICA COLONNA UNICA SOTTOTITOLO COLONNA 1 SOTTOTITOLO COLONNA 2 SOTTOTITOLO COLONNA 3 COLONNA1 COLONNA2 COLONNA3

Codice:



Definire l'altezza o la larghezza delle celle
Basta inserire i parametri: height="??" (per l'altezza) e width="??" (per la larghezza) all'interno della colonna, al posto di ?? potete inserire sia misure in pixel che in percentuale. Visto che la community fa uso di template fluidi è consigliato usare i valori in percentuale per le larghezze, ricordate però che la somma dei valori deve restituire 100%.

Esempio:



Anteprima:

	TITOLO
	COLONNA1 COLONNA2 COLONNA3

Codice:



Inserire uno sfondo personalizzato
Per inserire uno sfondo personalizzato nella vostra tabella, dovete prendere il tag table prima di <tr tilte="RIGA1"> che si presenta così:



All'interno dell'attributo style, inserita la proprietà: ;background-image:url(http://..); dove al posto di http://.. va inserito l'url della vostra immagine.
Inoltre dovete togliere class="aa" e class="ww" dalle colonne della vostra tabella, ottenendo una cosa di questo tipo:



Esempio:

	TITOLO
	COLONNA1 SOTTOTITOLO COLONNA 1 SOTTOTITOLO COLONNA 2 COLONNA1 COLONNA2

Codice:



Inserire una scrollbar
Per inserire una scrollbar dentro a una cella, basta inserire subito dopo <td class="??"> (dove al posto di ?? potete trovare aa o ww ) questo codice:



Se volete variare l'altezza, basta aumentare o diminuire il valore: 100px.

FONTE



Altri esempi di tabelle con relativo codice HTML:

TABELLA 1

	Esempio Tabella nr.° 1
	Benvenuto nel Forum Se vuoi scambiare messaggi o usufruire dei servizi del forum registrati, è facile, semplice e gratuito! Link Utili - Collegamenti a discussioni importanti quali regolamento, ultime notizie ecc. - Staff - Nick del membro dello staff e il rispettivo profilo. Esempio: Amministratore: <geniv> - Affiliati

CODICE



TABELLA 2

	Esempio Tabella nr.° 2
	Importanti Registrati Annunci - Regolamento Forum - - Chiedi Affiliazione - - Domande e Aiuti - Se vuoi scambiare messaggi o usufruire dei servizi del forum registrati, è facile, semplice e gratuito! - Inizia il Contest, iscriviti - - Inserito nuovo tutorial -

CODICE



TABELLA 3

	Esempio Tabella nr.° 3
	Sottotitolo Forum Il Forum apre i battenti 'Geniv's forum' - 12/09/2008 Il Forum apre oggi i battenti. Inizia così una nuova avventura con un nuovo forum che presenta grandi innovazioni. Per scoprire tutte le potenzialità del nostro forum, non vi resta che navigare e quindi: buona navigazione dallo Staff del Forum. Nome Forum Informazioni Importanti: Regolamento - Banner per Affiliazioni e Firme Nome Forum ultime notizie: Cercasi Staff - Inizia il primo contest del forum

CODICE



Fonte: Geniv