La piattaforma usa il normale HTML per tutta la formattazione, perciò consiste solo di scrivere una pagina web ma senza header. L'HTML consiste nello stesso concetto del BBCode usato sul forum, si mettono dei testi o indirizzi web all'interno di tags. Il BBCode distinge i suoi codici con quadre [ ] mentre l'HTML con virgolette < >.
Di fatto, i codici essenziali sono davvero pochi.
Formattazione di base
Per il testo:
- Codice: Seleziona tutto
<p>*testo*</p>
Apre un paragrafo. I paragrafi sono porzioni di testo separati da una riga bianca, e servono a separare i vari argomenti di un articolo sul blog.
All'interno del tag <p> vanno settate le opzioni per formattare il testo.
- Codice: Seleziona tutto
<p style="text-align: justify;">*testo*</p>
Allineamento giustificato (cioè le parole occupano tutto lo spazio di una riga). E' l'allineamento standar di tutti gli articoli e va sempre usato, a parte eccezioni.
- Codice: Seleziona tutto
<p style="text-align: center;">*testo*</p>
Allineamento centrato. Usato di default per posizionare immagini, video incorporati, e alcuni elementi particolari di testo (es il "continua a leggere").
- Codice: Seleziona tutto
<p style="text-align: left;">*testo*</p>
Allineamento a sinistra.
- Codice: Seleziona tutto
<p style="text-align: right;">*testo*</p>
Allineamento a destra.
- Codice: Seleziona tutto
<p style="color: #ff0000;">*testo*</div>
Cambia il colore al testo. I codici vanno inseriti in formato esadecimale (codice alfanumerico a cui si antepone il simbolo #. Il codice si può sapere con un qualsiasi programma di fotorintocco). Mai usato.
- Codice: Seleziona tutto
<p style="font-size: medium;">*testo*</p>
Dimensione del carattere (font). Le dimensioni sono xx-small, x-small, small, medium, large, x-large, xx-large. Mai usato.
Se usate più di una opzione, vanno inserite tutte in un singolo tag, e il ; viene usato come separatore di ogni opzione.
Ad esempio:
- Codice: Seleziona tutto
<p style="text-align: justify; font-size: medium; color: #ffffff;">*testo*</p>
Paragrafo con testo giustificato, dimensione del carattere media, colore nero.
Per formattare dimensione e colore di singole parole, queste vanno messe tra i codici
- Codice: Seleziona tutto
<span>*testo*</testo>
oppure
- Codice: Seleziona tutto
<div>*testo*</div>
con le stesse opzioni del codice <p>.
Per andare a capo senza generare una riga bianca.
- Codice: Seleziona tutto
<br>
Niente tag di chiusura. Va messo solo a fine della riga.
Parole in grassetto:
- Codice: Seleziona tutto
<strong>*testo*</strong>
Parole in corsivo:
- Codice: Seleziona tutto
<em>*testo*</em>
riga nera di separazione
- Codice: Seleziona tutto
<hr>
Senza chiusura.
Inserire la funzione "Continua a leggere" negli articoli.
- Codice: Seleziona tutto
<p style="text-align: center;"><!--more--></p>
In prima pagina, l'articolo si vedrà solo fino al punto in cui è inserito questo codice.
Inserire indirizzi web
- Codice: Seleziona tutto
<a href="http://indirizzoweb" target="_blank">indirizzo web o testo che fa da link</a>
Inserisce un link. Includere anche il comando "target="_blank"" per far aprire il link in una nuova pagina.
Inserire immagini
- Codice: Seleziona tutto
<img src="http://URLimmagine" alt="" />
Inserisce una immagine usando l'URL indicato. Non c'è tag di chiusura.
Elenchi puntati.
- Codice: Seleziona tutto
<ul style="text-align: justify;">
<li>*testo*</li>
</ul>
Elenco puntato non numerato.
Il tag <ul> definisce un elenco non puntato, mentre <li> indica di mettere il punto. Tutti e due i tags vanno chiusi col loro corrispettivo.
Sia i comandi <ul> e <li> hanno le stesse opzioni del comando </p>. Un <ul style="text-align: justify;"> crea un intero elenco puntato con allineamento giustificato. Un <li style="text-align: justify;"> crea una sola riga giustificata.
L'allineamento negli elenchi è diverso dai paragrafi, perciò dovete definirlo sempre quando aprite un elenco.
Elenchi numerati
- Codice: Seleziona tutto
<ol>
<li>*testo*</li>
</ol>
Stessa sintassi e opzioni di <ul>.
Per usare le lettere va aggiunto a <ol> l'opzione style="list-style-type: lower-alpha;". Ci sono vari tipi di elenchi con lettere, che cambiano cambiando "lower-alpha", ma non ne faccio uso.
Video:
Inserire il codice fornito dal sito che ospita i video, ognuno ha il suo (youtube è diverso da Dailymotion). Va ricopiato così com'è.
Questo esempio è con Youtube (il più frequente).
Cliccate sul comando "condividi", tab "codice da incorporare". Le opzioni che ci interessano sono la dimensione del video e il codice di incorporamento.
Le dimensioni del video per il blog non devono superare i 640x480 Pixel, altrimenti fuoriescono dal template del blog.
Delle quattro opzioni, l'unica di nostro interesse è la quarta "Usa vecchio codice di incorporamento". Vengono forniti due codici, uno col comando Iframe e un'altro con object. Il blog li visualizza entrambe, ma se uno dei codici vi dovesse dare problemi, spuntate o meno questa opzione e usate l'alternativa che da.
Infine copiate tutto il testo nel campo e incollatelo nel punto dove volete che appaia il video, all'interno dell'articolo.
Un articolo può essere scritto usando solo tre codici: <p>, <img> (immagini) e <a url=> per i links. Il resto è per curare la leggibilità del testo (corsivo e grassetto).
I codici <p></p> aprono e chiudono i paragrafi, e vanno usati sempre per definire pezzi di testo di un articolo. Immaginateli come una scatola in cui ci mettete dentro la roba. All'interno di questi due tag vanno tutti gli altri: grassetto, corsivo, links e immagini.
