Aiuto:Formattazione avanzata

Vai alla navigazione Vai alla ricerca

Premessa: L'autore di questo articolo non capisce un cazzo di codici, ma ci ha provato!

Benvenuto a te utente esperto! Se sei un niubbio e sei capitato su questa pagina significa che hai capito molto poco dalla vita... la natura è stata crudele con te, ma non disperare: un giorno vedrai la luce!

Qui di seguito riportiamo un po' di utility e trucchetti che potrebbero farti comodo per abbellire i tuoi articoli.
Per qualsiasi cosa fai riferimento a Wikimedia: è in inglese, quindi cercheremo di tradurre i contenuti più utili a Nonciclopedia.

Sondaggio

Si può inserire un sondaggio molto semplicemente. Prendi spunto da questo codice:

<poll>
Inserire un sondaggio è facilissimo, non trovi?
Sì, ci sono riuscito anche senza questo manuale a prova di idiota
Sì, questo manuale mi ha illuminato
No, ho dovuto pregare 3 santi prima di riuscirci
No, sono un fottuto niubbo e non ci riuscirò mai
Non ci ho mai provato
A che minchia serve un sondaggio?
</poll>

che ti darà questo risultato: <poll> Inserire un sondaggio è facillimo, non trovi? Sì, ci sono riuscito anche senza questo manuale a prova di idiota Sì, questo manuale mi ha illuminato No, ho dovuto pregare 3 santi prima di riuscirci No, sono un fottuto niubbo e non ci riuscirò mai Non ci ho mai provato A che minchia serve un sondaggio? </poll>

Anche se voti più volte, te ne sarà conteggiata una sola. Puoi cambiare voto in qualsiasi momento, rivotando.

NB: se un sondaggio viene modificato tutti i voti verranno azzerati.

Galleria di immagini

La galleria permette d'inserire più immagini in una galleria (appunto).

Esempio:
<gallery>
File:Esempio.jpg|Nel mezzo del camin di nostra vita...
File:Esempio.jpg|...mi ritrovai dentro un comignolo oscuro...
File:Esempio.jpg|...che la cartina era sparita.
File:Esempio.jpg|Tanto va la gatta al lardo...
File:Esempio.jpg|...che fa i gattini ciechi.
File:Esempio.jpg|Sopra la panca...
File:Esempio.jpg|...la capra canta.
</gallery>
...che darà:
  • Parametri aggiuntivi:

Si possono anche utilizzare dei parametri aggiuntivi.

<gallery {parametri}>
{immagine}
</gallery>
  • caption="{titolo}": imposta un titolo alla galleria.
  • widths="{larghezza}px": imposta la larghezza delle immagini.
  • heights="{altezza}px": imposta l'altezza (massima) delle immagini.
  • perrow="{n°}": imposta il numero massimo di immagini per riga.
Esempio:
<gallery caption="Galleria esempio" widths="200px" heights="200px" perrow="2">
File:Esempio.jpg|Tanto va la gatta al lardo...
File:Esempio.jpg|...che fa i gattini ciechi.
File:Esempio.jpg|Sopra la panca...
File:Esempio.jpg|...la capra canta.
</gallery>
...che darà:

NB: non dimenticarti di ricordare di non fare righe con troppe immagini e troppo grandi o potrebbero "slabbrare" fuori dalla pagina con risoluzioni di 1024x768 o inferiore.

Tabelle

Ogni tabella inizia con {| e finisce con |}. Al suo interno hai la possibilità di inserire una classe (class) e delle impostazioni CSS (style). Quello che non devi inserire invece sono i parametri border, cellpadding, cellspacing, width, height, align e valign, se non vuoi che un admin incazzato ti banni a tempo indeterminato.

Vediamo alcuni esempi:

Tabella a singola entrata

Nome Cognome Professione
Silvio Berlusconi Psiconano
George W. Bush Esportatore di democrazia

Il codice è questo:

{| class="stdTable" style="margin: 0.5em auto;"
!style="width: 100px;"|Nome
!style="width: 200px;"|Cognome
!style="width: 200px;"|Professione
|-
|| Silvio
|| [[Berlusconi]]
|| Psiconano
|-
|| George W.
|| Bush
|| Esportatore di [[democrazia]]
|}
  • La classe inserita (stdTable) indica che la tabella verrà visualizzata con tutti i bordi delle celle e il bordo di contorno. Questa classe è probabilmente la più utile per delle tabelle standard, ma ce ne sono altre che puoi trovare in giro per il sito.
  • Nella proprietà style, il parametro margin indica che c'è un margine di mezza riga sopra e sotto la tabella e un margine automatico a destra e a sinistra. Questo significa sostanzialmente che la tabella viene allineata al centro, per cui non c'è bisogno di scrivere align="center". È possibile mettere quante colonne si desiderano (tenendo conto dei limiti di larghezza delle pagine), ma bisogna ricordarsi di riempire correttamente anche le righe successive, altrimenti il risultato fa schifo.
  • Se vuoi vedere le celle attaccate assieme invece che separate da un bordino bianco, scrivi subito dopo la proprietà margin, rimanendo dentro le virgolette di style: border-collapse: collapse;.
  • Le celle iniziali hanno un punto esclamativo all'inizio invece che una sbarretta verticale. Questo significa che sono delle celle che contengono un titolo (per gli esperti di HTML, riconducono ai tag <th>). Non è obbligatorio metterle, in alcune tabelle non servono titoli per le colonne.
  • Le indicazioni di larghezza delle celle servono solo nella prima riga, le celle nelle righe successive saranno larghe esattamente quanto la prima cella della loro colonna.
  • I caratteri |- indicano l'inizio di una nuova riga. È possibile specificare un parametro style dopo questi caratteri, che verrà applicato a tutta la riga successiva.
  • Ogni riga inizia con i caratteri ||. Come forse avrai già intuito guardando la prima riga, è possibile inserire un parametro style fra le due sbarrette, che verrà applicato alla singola cella.

Tabella a doppia entrata

Tabella degli idioti
Nome Cognome Professione
Idiota 1 Silvio Berlusconi Psiconano
Idiota 2 George W. Bush Esportatore di democrazia
{| class="stdTable" style="margin: 0.5em auto 0.5em 0;"
|+ style="font-size: larger;"|Tabella degli idioti
|style="width: 60px;"|
!style="width: 200px;"|Nome
!style="width: 200px;"|Cognome
!style="width: 200px;"|Professione
|-
!| Idiota 1
|| Silvio
|| [[Berlusconi]]
|| Psiconano
|-
!| Idiota 2
|| George W.
|| Bush
|| Esportatore di [[democrazia]]
|}

Il codice è il medesimo, solamente che devi creare una colonna in più, che conterrà i titoli delle righe. Sì, anche le righe possono avere i titoli.

  • Ho spostato la tabella a sinistra della pagina modificando la proprietà margin: i valori inseriti indicano rispettivamente il margine superiore, destro, inferiore e sinistro (puoi ricordarti facilmente dell'ordine pensando a come si muovono le lancette di un orologio). Se ometti il valore del margine sinistro vale quello del margine destro, se ometti anche quello del margine inferiore vale quello del margine superiore (come nell'esempio precedente), infine se ometti anche il margine destro, tutti e quattro i margini hanno il valore del margine superiore. In questo caso ho impostato il margine sinistro a 0, in modo da evitare di dover scrivere align="left".
  • Ho inserito una colonna in più dal titolo vuoto e dalla larghezza di 60px, ho allargato la colonna "Nome"
  • Ho dato i titoli alle 2 righe
  • Ho inserito un titolo per l'intera tabella (riconducibile al tag HTML <caption>): la riga che comincia con |+ infatti fa da titolo alla tabella. Se ne può inserire unicamente una e andrebbe messa in cima al codice della tabella.

Per colore, allineamento testo e altri trucchi assolutamente inutili, consulta un qualsiasi manuale CSS in giro per il web.

Fondere celle

Nome Cognome Professione
Idioti Silvio Berlusconi Psiconano
George W. Bush Esportatore di democrazia
{| class="stdTable" style="margin: 0.5em auto;"
|style="width: 60px;"|
!style="width: 150px;"|Nome
!style="width: 150px;"|Cognome
!style="width: 200px;"|Professione
|-
!rowspan="2"| Idioti
|colspan="2" style="text-align: center;"| Silvio [[Berlusconi]]
|| Psiconano
|-
|| George W.
|| Bush
|| Esportatore di [[democrazia]]
|}
  • La proprietà rowspan indica che la cella si estende su più righe, due in questo esempio. Ricorda quindi che nelle righe successive devi inserire una cella in meno.
  • La proprietà colspan indica che la cella si estende su più colonne, due in questo esempio. Anche in questo caso devi ricordarti di inserire meno celle sulla riga.

Evitare di far arrabbiare MFH

Nell'introduzione c'è scritto che sono da evitare i parametri border, cellpadding, cellspacing, width, height, align e valign, ma non c'è scritto né il motivo, né come fare per ottenere gli stessi effetti. Il motivo è molto semplice: questi attributi sono deprecati e potrebbero non venir più supportati dai browser in un prossimo futuro, e c'è chi sta buttando via un sacco di tempo per correggere l'intero sito, per cui è anche chiaro perché si rischia il ban se si usano. Uomo avvisato...

  • I parametri border, cellpadding e cellspacing non sono più necessari se si usa la classe stdTable, come negli esempi precedenti.
  • width e height vanno specificati via CSS (ovvero così: style="width: 50px; height: 30px;"). Cosa cambia? Prima di tutto i CSS saranno supportati probabilmente in eterno, e poi così è possibile essere molto più specifici.
  • align va sostituito con la proprietà CSS margin per allineare la tabella nella pagina e con text-align per allineare il testo nella tabella.
  • valign va sostituito con l'analoga proprietà CSS vertical-align. Usatela correttamente!

Per maggiori informazioni consulta la pagina Aiuto:Sintassi corretta.

Pagine di stile (CSS)

Se vuoi cambiare completamente lo stile di un tuo articolo (sfondo, testo, colori, dimensioni, titoli) guarda qui:

Per il momento la guida è incompleta: potete imparare guardando il codice di altri css già fatti.

Vi riconduciamo ad una guida più che esaustiva: [1]

Guida a LaTeX

Non questo genere di latex, maiale!

Introduzione

LaTeX è un linguaggio di scripting tipografico. Le possibilità che offre sono pressoché infinite, dalle formule matematiche all'egiziano antico, passando per la chimica, la musica e anche per l'Autostrada del Sole.

In questa breve guida verranno illustrati principalmente i comandi per i simboli matematici e un po' di formattazione di base, anche perché la versione di LaTeX usata sulle wiki è parecchio ridotta.

I comandi basilari

Prima regola, una wiki è stupida, quindi bisogna specificare che si sta scrivendo in LaTeX usando i tag <math>...</math>

All'interno di questi tag le normali regole di formattazione cessano di esistere. Infatti tra le prime cose che si notano c'è la totale assenza di spazi:

CodiceRisultato
<math>Questo testo contiene degli spazi.</math>

Ci sono due modi per ovviare al problema:

  1. Al posto di scrivere un semplice spazio si scrive "\ ", questo fa in modo che lo spazio venga visualizzato.
  2. Si scrive l'intero testo all'interno di \mbox{}, che però verrà visualizzato come un normale testo.
<math>Questo\ testo\ contiene\ degli\ spazi.</math>
<math>\mbox{Questo testo contiene degli spazi.}</math>

Come probabilmente avrete notato, il backslash "\" e le parentesi graffe "{}" sembrano svolgere un ruolo abbastanza importante nella sintassi di LaTeX. Ah, non lo avete notato? Allora forse dovreste consultare prima questa pagina.

Posso continuare? Bene.

Si parlava di backslash e graffe: quasi tutti i comandi sono preceduti da un backslash (abbiamo visto per esempio "\ " e "\mbox{}", mentre fanno eccezione i comandi di apice "^{}" e di pedice "_{}") e, se possono accettare dei parametri, sono seguiti da una o più coppie di parentesi graffe, una coppia per ogni parametro. Vediamo alcuni esempi:

CodiceRisultatoSignificato
<math>\frac{x}{y}</math>Frazione
<math>\sqrt{x}</math>Radice quadrata
<math>x^{y}</math>Apice, esponente
<math>x_{y}</math>Pedice
<math>\sum^{n}_{i=1}</math>Sommatoria

Annidamento

È possibile, ovviamente, annidare comandi e ottenere risultati come questo:

Errori

Capita a volte di scrivere delle formule scorrette (a voi, a me no), per esempio quando ci si dimentica di chiudere una parentesi graffa o non viene riconosciuto un comando. Gentilmente l'interprete di LaTeX vi fornisce un messaggio di errore lunghissimo che in teoria dovrebbe aiutarvi a rintracciare il problema. In pratica vi conviene rileggere attentamente ciò che avete scritto.

<math>Questo\ testo\contiene\ degli\ spazi.</math>Errore del parser (SVG (MathML può essere abilitato tramite plug-in del browser): risposta non valida ("Math extension cannot connect to Restbase.") dal server "https://wikimedia.org/api/rest_v1/":): {\displaystyle Questo\ testo\contiene\ degli\ spazi.}

In questo caso ho scritto "testo\contiene", tralasciando lo spazio, e il messaggio di errore non è proprio così evidente da interpretare...

Approfondimenti

Hiero

Hiero?? E che è sto Hiero?
Con il tag <hiero> puoi scrivere un articolo sull'Antico Egitto usando solo i geroglifici e, se non sai cosa sono, clicca qui

Niubbo : Si, ma come faccio? Qui nessuno mi aiuta... ;-(
Utente emancipato : Certo che voi niubbi avete sempre bisogno della pappa pronta eh?! Visita questa pagina e smettila di lagnarti!
Pagina speciale per la creazione di geroglifici

Per fare un esempio:

I2C12

se vuoi raccontare che una tartaruga è andata a trovare il Papa.

Test

È possibile creare dei test con una grafica accattivante e con la possibilità di calcolare automaticamente il punteggio, e il tutto in maniera talmente semplice che anche tu puoi riuscirci senza problemi![1] Ci sono due tipi di test disponibili.

Se hai difficoltà a visualizzare la formattazione corretta dei test che hai creato, prova ad utilizzare Mozilla Firefox come web browser al posto di Internet Explorer.

Avvertenza: Evitate di spaziare le varie righe con degli a capo supplementari, o i test non verranno visualizzati. La stessa cosa vale per le immagini sotto forma di thumb[2]: mettetele al di fuori, o rendono inutilizzabile questo sistema.

Test a punteggio

Domande

Ogni test, ovviamente, deve avere delle domande[3] con le relative risposte. Per visualizzare le domande, si deve usare il tag <test>. La sintassi completa per questo tag è la seguente:

<test group="gruppo" type="tipo">Domanda
|Risposta 1|Punteggio 1
|Risposta 2|Punteggio 2
...
|Risposta N|Punteggio N
</test>

Come potete notare, ci sono due parametri all'interno del tag, e sono entrambi opzionali.

  • group: serve a creare un gruppo di domande, se si fanno una serie di test diversi nella stessa pagina. Se invece c'è un test solo[4], si può anche non specificare.
  • type: serve a stabilire che tipo di risposta accetta il test. Ci sono 3 possibili tipi di domanda:
    • Se si scrive type="multi" oppure type="mct" (acronimo di Multiple Choice Test), oppure tralasciando il parametro, il test accetta risposte multiple.
    • Se invece si scrive type="single" oppure type="sct" (acronimo di Single Choice Test), si potrà dare una sola risposta.
    • Infine, se si scrive type="insert" oppure type="ins", il test accetta un valore inserito dall'utente. In questo caso al posto del punteggio si può usare una formula contenente somme (+), sottrazioni (-), moltiplicazioni (*), divisioni (/) e elevazioni a potenza (^), delle parentesi, e la lettera x per indicare il numero inserito dall'utente.
    • Per qualsiasi altro valore, il test sarà comunque a risposta multipla.

Le domanda e le risposte possono essere scritte usando qualunque altro elemento stilistico all'interno, i punteggi invece devono essere dei numeri, non è importante che siano interi o decimali, positivi o negativi. Se dovete usare numeri decimali, ricordatevi di scriverli con un punto, non con una virgola.[5]

Valutazione

Ovviamente le sole domande non bastano, ci vuole anche uno strumento che valuti le risposte e restituisca il profilo adeguato al punteggio. Per fare questo, bisogna usare il tag <testresult>. La sintassi completa per questo tag è la seguente:

<testresult group="gruppo">Titolo
|Profilo 1|Punteggio massimo 1
|Profilo 2|Punteggio massimo 2
...
|Profilo N-1|Punteggio massimo N-1
|Profilo N
</testresult>

In questo caso c'è un solo parametro, group, che indica quale gruppo di domande considerare per calcolare il punteggio. Se non avete scritto nessun gruppo nelle domande, questo parametro si può tralasciare. Il Titolo sarà, appunto, il titolo visualizzato sopra il profilo, per esempio un semplice e banale Risultati. Il sistema profili-punteggi è invece un po' più macchinoso del resto del codice: bisogna scrivere i profili in ordine da quello col punteggio minore a quello col punteggio maggiore. I punteggi indicano qual'è il punteggio massimo per rientrare in un determinato profilo, quindi fino a Punteggio massimo 1 si rientra nel profilo 1, da Punteggio massimo 1 escluso a Punteggio massimo 2 compreso si rientra nel profilo 2, e così via. L'ultimo profilo non ha punteggio, perché non c'è un limite superiore: se il punteggio è ,maggiore di Punteggio massimo N-1, allora si rientra nel profilo N.

Esempio

Vediamo un esempio semplice, per capire come funziona questo sistema:

<test>Su che argomenti preferisci scrivere articoli?
|Storia e personaggi storici|5
|Geografia|5
|Nonsense|5
|Attualità|5
|Politica|5
|Religione|5
|Sesso|5
|Cinema e spettacolo|5
|Informatica|5
|Altro|5
</test>

<test type="single">Hai già vandalizzato un articolo?
|Sì|-100000
|No|0
</test>

<test type="insert">Parliamo dei tuoi [[Speciale:Editcount|contributi]]:
|Quanti contributi hai nel namespace principale?|x/50
|E nel namespace immagini?|x/20
</test>

<testresult>Risultato:
|Sei un vandalo, dovresti vergognarti!|-1
|Hai gusti molto ristretti. Dovresti considerare anche altri temi, potresti scoprire nuovi orizzonti.|15
|Sei un articolista con un ampio repertorio, complimenti!|35
|Sei un articolista a 360°, continua così!
</testresult>

Questo è il risultato:

<test>Su che argomenti preferisci scrivere articoli? |Storia e personaggi storici|5 |Geografia|5 |Nonsense|5 |Attualità|5 |Politica|5 |Religione|5 |Sesso|5 |Cinema e spettacolo|5 |Informatica|5 |Altro|5 </test>

<test type="single">Hai già vandalizzato un articolo? |Sì|-100000 |No|0 </test>

<test type="insert">Parliamo dei tuoi contributi: |Quanti contributi hai nel namespace principale?|x/50 |E nel namespace immagini?|x/20 </test>

<testresult>Risultato: |Sei un vandalo, dovresti vergognarti!|-1 |Hai gusti molto ristretti. Dovresti considerare anche altri temi, potresti scoprire nuovi orizzonti.|15 |Sei un articolista con un ampio repertorio, complimenti!|35 |Sei un articolista a 360°, continua così! </testresult>

Test a profili

Domande

Contrariamente al test precedente, questo non assegna un punteggio per ogni domanda, ma calcola la maggioranza di risposte di un certo tipo. Data la differenza concettuale fra i due tipi di test, è necessario usare un altro tag e non è possibile combinare un test a punteggio con uno a maggioranza di risposte.[6] La sintassi completa è la seguente:

<abc group="gruppo">Domanda
|Risposta A
|Risposta B
...
|Risposta Z
</abc>

Come si può notare, la sintassi è un po' più semplice di quella dell'altro tipo di test, e questo non solo per venire incontro alle tue ridotte capacità mentali. Sono disponibili fino a 26 risposte, poi anche se le risposte verranno visualizzate, non verranno conteggiate nella valutazione, quindi fattele bastare.[7] Inoltre, anche se sembra stupido dirlo, per ottenere dei risultati sensati sarebbe il caso di usare sempre lo stesso numero di risposte per domanda, altrimenti alcune categorie di risposte risultano svantaggiate rispetto alle altre. C'è anche da notare che viene già aggiunto automaticamente dal programma la lettera alla domanda (A, B, C, ...), quindi non c'è bisogno di scriverle.

Anche in questo caso il parametro group è opzionale, e serve solo quando si vogliono fare due test differenti nella stessa pagina.[8]

Valutazione

Come prima, per valutare le risposte c'è un apposito tag:

<abcresult group="gruppo">Titolo
|Maggioranza di A
|Maggioranza di B
...
|Maggioranza di Z
</abcresult>

Anche in questo caso la sintassi è più semplice, basta inserire il profilo per ogni maggioranza. C'è da notare che, in caso di parità fra due opzioni, vengono mostrati entrambi i profili. È inoltre perfettamente inutile, anche in questo caso, inserire nel profilo "Maggioranza di A:" eccetera perché provvede già il programma.

Esempio

Vediamo un esempio semplice, per capire come funziona quest'altro sistema:

<abc>Vedi errori di ortografia in un articolo, cosa fai?
|Li correggo, che domande. Per quale altro motivo avrei installato il dizionario su [[firefox]]?
|Metto il template {{template|Formattazione}}, ci penserà un [[Nonciclopedia:Progetto Restauro|Restaurante]].
|Me ne frego, il testo è leggibile comunque.
|Ne aggiungo degli altri, così si sentono meno soli.
</abc>

<abc>C'è un'immagine che si chiama 013ncwq98r3hfqn09q8h.jpg, cosa fai?
|La sposto grazie al sacro potere del Movefile.
|Metto il template {{template|Nomedimmerda}}, ci penserà uno [[Nonciclopedia:PCI|sguardone]].
|Me ne frego, l'importante è l'immagine, non il suo nome.
|Ne aggiungo altre con un nome simile.
</abc>

<abc>Quanti contributi hai?
|Più di 1000
|Più di 100
|Più di 10
|Più di 1
</abc>

<abcresult>Risultato:
|Un vero nonciclopediano DOC!
|Voglia di fare 0, ma almeno sai come comportarti su [[Nonciclopedia]].
|Dannato bimbominkia, vade retro!
|Congratulazioni, hai appena vinto un ban!
</abcresult>

Questo è il risultato:

<abc>Vedi errori di ortografia in un articolo, cosa fai? |Li correggo, che domande. Per quale altro motivo avrei installato il dizionario su firefox? |Metto il template {{Formattazione}}, ci penserà un Restaurante. |Me ne frego, il testo è leggibile comunque. |Ne aggiungo degli altri, così si sentono meno soli. </abc>

<abc>C'è un'immagine che si chiama 013ncwq98r3hfqn09q8h.jpg, cosa fai? |La sposto grazie al sacro potere del Movefile. |Metto il template {{Nomedimmerda}}, ci penserà uno sguardone. |Me ne frego, l'importante è l'immagine, non il suo nome. |Ne aggiungo altre con un nome simile. </abc>

<abc>Quanti contributi hai? |Più di 1000 |Più di 100 |Più di 10 |Più di 1 </abc>

<abcresult>Risultato: |Un vero nonciclopediano DOC! |Voglia di fare 0, ma almeno sai come comportarti su Nonciclopedia. |Dannato bimbominkia, vade retro! |Congratulazioni, hai appena vinto un ban! </abcresult>

Note

  1. ^ Ok, forse è meglio se ti fai aiutare dalla mamma, non si sa mai...
  2. ^ Non sai cosa sono? E i manuali sulle immagini cosa li abbiamo scritti a fare? E per ripicca il link te lo cerchi da solo!
  3. ^ Io specifico, per sicurezza.
  4. ^ Ho detto test, non domanda.
  5. ^ Ovvero 2.5 e non 2,5.
  6. ^ Pensaci bene, che diavolo di risultati dai?
  7. ^ Insomma, 26 risposte non sono poche, tanto lo sanno tutti che l'unica vera risposta è 24.
  8. ^ A proposito, è perfettamente inutile fare i furbi e usare lo stesso gruppo per un test a punti e uno a maggioranza di risposte, verrebbero considerati comunque separatamente.