Lavorare con le immagini

Le basi

Se si vuole solo ottenere una immagine su una pagina, bisogna semplicemente caricare il file dell'immagine (usando il collegamento "Allegati"). Quindi utilizzare {{attachment:image-name.png}} (dove image-name.png è il nome del file). L'immagine comparirà nel punto in cui quel codice è stato inserito. Se inserito all'interno di un paragrafo, sarà parte del flusso del paragrafo. Per piccole immagini, questo può essere una buona cosa, ma bisogna prestare attenzione con le immagini grandi, altrimenti la pagina risulterà sproporzionata.

Per esempio, inserendo una grande immagine {{attachment:duckie.png}} nel mezzo di un paragrafo, in questo modo , questo è esattamente quello si ottiene. Comunque bisogna prestare attenzione, perchè come si può vedere la grafica può peggiorare la disposizione del paragrafo. Però con una piccola immagine, come questo pesce [], non vi sono problemi.

Allineamento nella pagina

Questo esempio utilizza l'immagine di una sedia che è allineata a sinistra. Notare che il testo del paragrafo vi scorre intorno, per cui è possibile (per esempio) impaginare le immagini. Questo è il codice: {{attachment:chair.jpg||align="left"}}

Questo esempio utilizza l'immagine di una sveglia che è allineata a destra. Notare che il testo del paragrafo vi scorre intorno. Questo è il codice: {{attachment:clock.jpg||align="right"}}

Ottenere l'immagine posizionata correttamente nella pagina (e in relazione ai paragrafi) necessita di un po' di lavoro. Normalmente, inserire il codice dell'immagine al di sopra del paragrafo fa in modo che sia allineata perfettamente con il paragrafo in questione. Se si preme Mostra il testo grezzo su questa pagina, si vedrà che entrambi i codici per le immagini sono stati messi all'inizio di questa sezione.

Allineamento sulla riga di base del testo

Usando un ananas come esempio, quelli che seguono sono esempi di allineamento di una immagine rispetto alla riga di base del testo :

Immagini come pulsanti di collegamento

Questo è un esempio di utilizzo di una immagine come se fosse un pulsante. Oppure, in questo caso, un bottone di un bottone. Come si può osservare dal codice di esempio, questo collegamento si aprirà in una nuova finestra. Se non fosse necessario, è sufficiente eliminare la parte |target="_blank". In alternativa, è pure possibile sostituire la parte HelpOnEditing con un qualsiasi collegamento valido, compreso URL esterne.
[[HelpOnEditing|{{attachment:button.png}}|target="_blank"]]

Miniatura di una immagine

Nel caso si abbia una grande immagine che non è necessario o non si vuole mostrare nella sua interezza, è possibile creare una anteprima in miniatura. Quando gli utenti faranno click sull'immagine, otterranno la versione originale allargata. È solo necessario specificare la larghezza oppure l'altezza, e l'immagine verrà automaticamente ridimensionata in proporzione.

Il codice: [[attachment:Grand_Tetons.jpg|{{attachment:Grand_Tetons.jpg||width=100}}]]

Testo dei suggerimenti

Opzionalmente, si può aggiungere un suggerimento ( title text ) al collegamento di ogni immagine, e esso sarà visualizzato quando si posizionerà il mouse sopra l'immagine stessa (che l'immagine venga mostrata oppure no). Per fare questo, è sufficiente inserire il testo nel secondo argomento: {{attachment:fish.jpg|Un piccolo pesciolino!}} per generare .

I suggerimenti possono essere combinati con ognuno degli esempi descritti in questa pagina. Vanno semplicementi messi tra le doppie barre (`||`) nel collegamento. Usando l'esempio qui sopra, ecco qui ancora la sveglia con in aggiunta una descrizione: {{attachment:clock.jpg|vecchia sveglia|align="right"}}

Combinare le opzioni

Si possono combinare facilmente delle opzioni multiple separandole con delle virgole. Per esempio, per impostare sia la larghezza modificata che l'allineamento bisogna usare qualcosa simile a questo:

{{attachment:clock.jpg|new caption|width=49,align="left"}}

che viene visualizzato in questo modo.