Dovete gestire i vostri contenuti in più schede? Devono essere visualizzate, scheda per scheda, con i rispettivi tasti di collegamento? Ecco il plugin che fa per voi.

Nel web designing moderno è di moda suddividere i contenuti in sezioni, categorie e schede, sia per rendere il sito più fruibile e scorrevole per gli utenti, ma anche per avere sempre sotto controllo la struttura generale. Inoltre, dividere del testo in più schede, consente l’integrazione di più materiale e, contemporaneamente, aumentandone l’accessibilità.

Sweet Tabs è scritto in AJAX ed è molto affidabile in quanto è ormai alla versione 1.4.

Demo | Downlaod

Oggi vi propongo dei menu navigator in HTML con il layout già prestabilito e installabile “al volo” su un una vostra pagina. Le anteprime le potete osservare nell’immagine in alto e, come avrete notato, vanno dallo stile stravagante con pattern (in alto) a quello semplice ed elegante (quelli più in basso).

Le immagini di base di questi navigator sono fornite nelle cartelle compresse in basso; inoltre, all’interno di questo file, troverete anche la pagina HTML con il navigatore funzionante e il file CSS per la gestione del mouse positioning.

Questo materiale, prelevato dal sito www.psdgraphics.com, è freeware anche a scopo commerciale.

Green stars CSS navigation
Purple CSS navigation
Orange halftone CSS navigation
Blue waves CSS navigation
Rainbow colors CSS navigation
Gray grunge CSS navigation
Yellow abstract CSS navigation
Blue abstract CSS navigation

gMap è un leggerissimo plugin in jQuery per integrare la mappa di Google in qualsiasi sito web.

Esso è semplicemente inserito attraverso il codice HTML con la seguente funzione:

$("#map").gMap();

Può essere, ovviamente, configurato con molti parametri quali la selezione della mappa attraverso latitudine/longitudine, livello di zoom, marcatori di posizione con le classiche finestre pop-up (come in foto), presenza o meno dei controlli sulla sinistra e tanto altro…

Ecco qualche esempio.

Buon embedding!

slideViewerPro è una galleria completamente personalizzabile in jQuery attraverso il CSS, deriva dal plugin slideViewer, ma con altre features.

La galleria è formata da una lista unordered con qualsiasi numero di immagini.

Alcune caratteristiche personalizzabili sono: didascalie, riproduzione casuale, pulsanti di avanzamento, definire l’animazione e il tempo delle slides e molto molto altro.

Quando un Web Designer visita un sito, visualizza un’immagine o qualsiasi altro elemento, spesso, desidera conoscere le dimensioni dei contenuti.

Pixus è un’applicazione open source scritta con il framework AIR di Adobe che, attraverso il drag and drop dei bordi della finestra principale, stampa le dimensioni del contenuto misurato in pixel.

Ti interessa conoscere la dimensione dello spazio vuoto fra due oggetti in una pagina html? Ti serve sapere la dimensione di un determinato banner su un blog? Nessun problema: apri Pixus, trascina la sua interfaccia user-friendly nella posizione desiderata, segna le dimensioni.

Era da tanto tempo che cercavo un’applicazione del genere: davvero semplice, utile ed immediata.

Avete bisogno di ispirazioni per il design di footers? Ecco il sito che fa per voi.

La parte in coda di ogni sito web, attualmente, è largamente utilizzata per fornire al visitatore una buona navigazione e altre informazioni. Footerama è una galleria di footers che può aiutarvi alla scelta dei colori, nello stile del contenuto e negli elementi che lo costituiscono.

I footers mostrati sono disposti in categorie in base ai temi ed i colori e viene aggiornato frequentemente.

MarkerCss è un framework contenente codice open source per poter realizzare siti web con i templates offerti. Esso è composto da una serie semplicissima di fogli di stile CSS che caratterizzano gli elementi del contenuto delle pagine: bordi, sfondi, links, testi, colori e tabelle.

Esso include una serie di references prestabilite, come la classe w10 (che può essere definita da 10 a 1000) che determinerà la larghezza di un elemento in 10px (o altro), o per esempio la classe p5 (definita da 5 a 50) che aggiungerà un padding di 5px all’elemento a cui si riferisce.

C’è una lista di esempi fornita dal sito che lascia intuire meglio tutte le funzionalità di questo interessante, funzionale e pratico framework.

Attraverso i templates di Wordpress è semplicissimo aggiungere blocchi di codice, che siano Google AdSense o altro, attraverso il semplice editing dell’html. Oggi però voglio proporvi un tutorial per poter inserire del codice in ogni post pubblicato dal popolare cms ed utilizzare le funzioni in php.

bxGallery è un plugin sviluppato su framework jQuery per creare gallerie a partire dalle thumbnails.

Le immagini vanno definite in una lista unordered <ul>, dopodiché esso convertirà gli oggetti <li> in immagini anteprima (thumbnails) e, attraverso il click su di esse, lo scorrimento della galleria principale.

Possono essere configurati vari parametri: larghezza e altezza delle immagini (mantenendo i rapporti reali), opacità e ritaglio delle thumbnails oppure testi e immagini di caricamento…

Inoltre il plugin fornisce la documentazione necessaria per poter spostare le thumbnails nella pagina (in alto, in basso, a destra o a sinistra) rispetto alla galleria.

Il pacchetto Go Green! contiene 108 icone free di colore verde utili per l’e-commerce, blogs e forums.

Questi files sono tutti 64×64 pixel e sono file trasparenti in PNG: questo significa che eventualmente è possibile cambiare le tonalità dei colori.

Questo pacchetto è gratis, sia ad uso personale che per uso commerciale.