Pubblicato il 29/01/11 - aggiornato il  | 3 commenti :

Come inserire una textarea con un'immagine di sfondo.

Mi sono già occupato di come inserire una textarea e una textarea trasparente, adesso vediamo come sia possibile inserire in un elemento pagina, ma anche in un post, una textarea con una immagine di sfondo. Presento due opzioni, la prima utilizzando i fogli di stile e quindi creata modificando il modello, la seconda senza bisogno di intervenire nel template.

Textarea con immagine di sfondo agendo sul modello

Andate su Design > Modifica HTML e cercate la riga </head>. Immediatamente sopra incollate questo codice

<style type='text/css'>
<!--
textarea {
background-image:
url(URL IMMAGINE DI SFONDO);
height: 200px;
width: 300px;
}
-->
</style>

Salvate il modello. Per inserire una textarea, andate su Design > Aggiungi un gadget > HTML/Javascript e incollate quest'altro codice

<form name="form1" method="post" action="">
<textarea name="textarea">
Immettere il testo da visualizzare all'interno della textarea
</textarea>
</form>

Questo metodo può anche essere utilizzato con blog che hanno uno sfondo creato con immagini del tipo texture per mantenere il disegno anche nella textarea.

Textarea con immagine di sfondo senza operare sul modello

In questo caso si va su Design > Aggiungi un gadget > HTML/Javascript e si incolla il seguente codice

<form>
<textarea cols="50" rows="6" style="background-image: url(URL IMMAGINE DI SFONDO); color: #191919; background-color: #FDBCB7; font-weight: bold; font-size: 14pt;">TESTO DA VISUALIZZARE NEL BOX</textarea> 
</form>

Ovviamente si deve inserire il testo e possiamo personalizzare tutti i dati evidenziati di rosso. Nel caso volessimo una textarea senza immagine possiamo eliminare l'attributo background-image: url(URL IMMAGINE DI SFONDO);.

I due codici presentati possono anche essere incollati in un post ma ricordo che pubblicare una textarea con Windows Live Writer presenta delle difficoltà, in questo caso è quindi meglio usare l'Editor di Blogger. Ecco un esempio di textarea in un post senza immagine di background ma solo con lo sfondo. La textarea è molto usata per postare HTML o per mostrare il codice da inserire in un sito per visualizzare un antipixel.



3 commenti :

  1. Ciao Parsifal.
    Io vorrei mettere una textArea sovrapposta a parte di un gadget, quindi che copra una porzione di esso. Come posso fare?
    Grazie

    RispondiElimina
  2. @SilVan
    La domanda che ti faccio io è "Perché?" :D
    Scherzi a parte non vedo la possibilità di "intersezioni" tra textarea e gadget

    RispondiElimina
  3. Perchè ho inserito nel mio blog la chat di ShoutMix, ma vorrei coprire gli annunci pubblicitari che compaiono sotto la lista di messaggi mettendoci un semplice rettangolo con due parole su come usarla. Si riesce a farlo come elemento fisso nel layout del blog?
    Grazie mille, bye bye

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy