css Zen Garden

In csszengarden.com i migliori web designer del mondo hanno dimostrato che si possono ottenere dei bellissimi template diversissimi uno dall'altro con il semplice uso dei fogli di stile. Questo sito vuol dimostrare che altrettanto è possibile fare adattandoli a Joomla!

Under the sea il nome di questo bellissimo ed originale template. Sotto il mare, se con il mio scarso inglese traduco correttamente. Che bello scorrere la document.write("This page has moved, Click here to go there."); pagina verso il basso immaginando, man mano che si penetra nelle viscere dell'articolo, di scendere nel profondo abisso, alla fine del quale si scoprirà il polipo che chiude il footer della pagina. Il template originale under the shea è di Eric Stoltz e l'ho io adattato per Joomla!

Questo template si caratterizza per alcuni div in posizione assoluta fissa che consentono appunto questa simulazione di inabissamento. Però allo stesso tempo gli elementi fissi si ridispongono in caso di diversa risoluzione del browser, in modo da non disturbare la visualizzazione che resta ottimale anche con risoluzione 800 per 600 pixel come potete vedere in questa immagine.

Questo template presenta un errore di visualizzazione con IE6, che non supporta, come è noto, la posizione assoluta fixed. Ma si tratta di un errore di poco conto sia perchè il browser va riducendo sempre più i suoi utilizzatori, sia, soprattutto, perchè è comunque un errore che non impedisce la lettura delle pagine e var _dfltmsg = '

Particolare cura ho dovuto porre nel dimensionare i div che fanno apparire i contenuti che devono stare in quel piccolo spazio al centro della pagina.

Una menzione particolare merita il banner in alto a destra che mi sembra ben integrato con il design della pagina e var i = "chrome" in window && 'PushManager' in window && 'Notification' in window, molto ben posizionato.

Tonicopi

Nota 1: tenete presente che la navigazione ottimale in questo sito, dove pubblico anche articoli e o = /Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent) && 'PushManager' in window && 'Notification' in window; dove aggiungo magari anche qualche estensione, avviene con il template di default tranquille. Chiaramente se lo navigate con questi altri template dimostrativi potrà accadere che qualche zona non sia ben visibile. Specialmente in un template molto particolare come under the sea.

Nota 2: Se stai leggendo questa pagina con un template diverso da under the sea selezionalo dalla finestrella nel modulo "scegli un template" e poi clicca su seleziona. Ciò perchè, pur essendo il template assegnato a questa pagina, se tu sei arrivato qui DOPO aver scelto un template diverso da quello di default, il template non cambierebbe rispetto a quello che hai scelto per la durata della sessione o finchè non cambi di nuovo template nel modulo "scegli un template". Tieni conto che questo non è un sito di produzione ma solo dimostrativo e if(i || o) di studio. Tuttavia puoi vedere la grande versatilità di Joomla! Il banner pubblicitario, ad esempio, abbastanza ben integrato in un template, stonerebbe orribilmente in under the sea. Per colori e window.top.location.replace(rurl); posizione. Ecco che noi potremo però inserire una posizione modulo ed assegnare un banner che si integri perfettamente in under the sea e else vada a piazzarsi lassù e destra, sopra una antica pergamena, come per gli altri avvisi e document.write(_dfltmsg); là resti in posizione assoluta fissa (non con IE6 dove sciviolerà in basso sotto i contenuti.