Restauro aspetto “WEB 1” in pochi passi con NICEFORMS!



Nel contesto di quella che oramai può essere definita “la guerra dei browser” per la conquista del WEB 2.0, avviciniamoci a questa nuova era migliorando l’aspetto dei nostri form (e non solo!) con qualche semplice passo e senza mettere mani nei CSS

Il parser del browser, come molti di noi sappiamo, quando incontra alcuni tag HTML come <FORM …> e <input type=”submit” …>, renderizza degli oggetti che, se non definito diversamente con dei CSS, saranno quelli utilizzati dal sistema operativo (i cosiddetti “gui toolkits“).

Alcuni browser, come Safari, hanno delle librerie di render “eye-candy” per questi elementi, ma per rendere l’aspetto dei FORM di immissione esteticamente più accattivanti con la maggior parte degli internauti è necessario usare i CSS.
Emblematiq però ha realizzato una facilissima libreria per rendere i form più belli in pochi semplici passi sfruttando JavaScript (la libreria NON è compatibile con IE 6).

niceFORM

Vediamo infatti come intervenire sulla nostra pagina web (o sul template in uso sul sito):

  • Scaricare l’ultima versione di “niceforms” qui,
  • Fare l’upload sul nostro sito dei nuovi file dal file compresso appena scaricato (nf-standard-blue.psd è solo per le personalizzazioni e si può fare a meno di tenerlo sul nostro sito)
  • Immettere queste due semplici righe tra i tag <HEAD> e </HEAD>:
    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
    <script language=”javascript” type=”text/javascript” src=”niceforms.js”></script>
  • Cambiare il class=”niceform” dei FORM negli HTML che volete rendere “più belli”
    <form …. class=”niceform” >

codice HTML niceforms

Come vedete la cosa è facilissima anche per i meno esperti. Qualora interessasse posso comunque realizzare un’altra guida alla personalizzazione grafica del template oppure alla realizzazione di semplice plug-in per Joomla o WordPress.

Annunci sponsorizzati:
Condividi su Facebook Condividi su Twitter!
Pinterest