Come abbellire il blog per Carnevale con effetti speciali.

Quest'anno il Carnevale è quantomai precoce visto che arriverà il 7 Febbraio esattamente 6 settimane prima della Paqua da cui dipende la sua data. In occasione di questa festività, come del resto anche per le altre quali San Valentino, Natale e Halloween, in molte tipologie di blog ancorate alla attualità gli webmaster sono soliti implementare degli abbellimenti che la richiamano.

Il Carnevale è associato a maschere, carri allegorici e coriandoli.  Quando il Carnevale cade nel mese di Marzo si possono associare anche immagini floreali tipiche della Primavera. Vado quindi a presentare alcuni effetti speciali da installare nelle pagine web di Blogger ma anche di Wordrpess che richiamino questa iconografia carnascialesca.

CASCATA DI CORIANDOLI ANIMATI MULTICOLORI

Il primo effetto che vi propongo è una classica cascata di coriandoli multicolori e animati. Si tratta in sostanza di immagini circolari in formato GIF che cadono nel blog partendo dall'alto. L'immagine di base è la seguente  e il codice può essere installato su Wordpress andando su Aspetto > Widget > Testo oppure su Blogger accedendo a Layout > Aggiungi un gadget > Base > HTML/Javascript > Sezioni del sito.  In entrambi i casi il codice da incollare è il seguente

Effetti speciali da inserire nel blog per Carnevale.

Come spesso accade San Valentino e Carnevale finiscono per sovrapporsi o comunque per essere separati solo da pochi giorni. Quindi dopo aver pubblicato una serie di effetti da installare nei siti per San Valentino ecco che procedo a illustrare un paio di personalizzazioni da usare per Carnevale.

La simbologia tradizionale associata al Carnevale è quella delle maschere e dei coriandoli. Per quello che riguarda le maschere è difficile trovare trovare un effetto interessante. Certo si possono inserire nel blog delle immagini tipiche del Carnevale ma questo non merita certamente un articolo esplicativo. Insieme a coriandoli e maschere il Carnevale specie quando è "tardivo" è anche associato alla primavera o comunque a una certa iconografia floreale. Ecco quindi i tre effetti che intendo proporvi.

Countdown personalizzato per Capodanno.

Nel post dedicato agli effetti da inserire nel blog per le Feste di Natale era presente anche un countdown che mostra i giorni, le ore, i minuti e i secondi che mancano alla mezzanotte del 31 Dicembre 2013 ovvero all'inizio del 2014.  Si tratta di un contatore completamente testuale che potrebbe essere abbellito con l'inserimento di una immagine magari in GIF. La difficoltà di creare immagini animate in formato GIF può essere superata leggendo questo tutorial mentre se si è trovata una immagine in GIF su internet che ci piace ma che è di dimensioni non adatte si può ridimensionarla usando il tool gratuito GIFResizer.

Si tratta di un programma freeware che non ha neppure bisogno di installazione e che può essere allocato in una cartella di Dropbox per poterlo usare in tutte le nostre postazioni. Dopo aver caricato l'immagine animata su Picasa e averne ottenuto il link diretto possiamo creare il widget.

Cascata di coriandoli animati e colorati per Carnevale.

Continuo la serie di proposte per i widget di stagione. Dopo aver presentato una cascata di cuoricini per San Valentino vado a proporre dei coriandoli che mutano di colore da inserire nel blog per Carnevale che quest'anno arriverà molto presto visto che la Domenica di Carnevale sarà il 10 di Febbraio.

Devo riconoscere che non si tratta di uno dei widget meglio riusciti ma in fondo serve solo per una settimana o poco più e porta una ventata di novità nei layout dei siti. L'installazione del widget è semplicissima visto che non prevede la modifica del template. L'immagine dei coriandoli è una animazione in GIF che i più esperti possono anche sostituire con un'altra   usando un editor come Notepad++ o anche con un semplice Blocco Note

Fuochi di artificio da mostrare nel blog per Capodanno.

Oltre ai widget classici che mostrano le pubblicazioni più recenti come quello degli Ultimi Articoli o le pubblicazioni di maggior successo come quello dei Post più Popolari, hanno grande successo nel mondo del web anche i gadget che potremmo definire stagionali e che si usano in determinati periodi dell'anno. Nel mese di Dicembre sono sempre molto richiesti i gadget di ambientazione natalizia oltre al solito effetto invernale della neve che cade.

La tradizione di salutare il nuovo anno con i fuochi d'artificio è ormai consolidata nonostante la condanna unanime dei botti di fine anno che in certe zone d'Italia portano al pronto soccorso numerose persone tutti gli anni. Volendo attrezzare il nostro blog con un stile adeguato per la fine dell'anno vecchio e l'inizio dell'anno nuovo, ho già illustrato il Fireworks Effect che mostra tutta una serie di fuochi d'artificio che partono dalla parte bassa del layout. Vado adesso a presentare una variante più complessa e quindi più suggestiva di questo effetto. Ne ho pubblicato anche una demo

Coriandoli animati nel blog per Carnevale.

Il Carnevale quest'anno cade nella seconda metà del mese di Febbraio. Si inizierà il 16 Febbraio con il Giovedì Grasso mentre il Carnevale vero e proprio cadrà da Domenica 19 Febbraio a Martedì 21 Febbraio. Fa eccezione la città di Milano con il suo Carnevale Ambrosiano che terminerà Sabato 25 Febbraio.

Per i blog che volessero aggiornare un pochino il tema in occasione di questa festività ho preparato uno script che mostra una caduta di coriandoli variopinti in tutto il layout del blog. Tale script può essere installato in tutte le piattaforme che supportano il javascript. Per Blogger si va su Layout > Aggiungi un gadget > HTML/Javascript mentre per Wordpress si va su Aspetto > Widget > Testo.

Contatore personalizzato per Natale e Capodanno.

Dopo essermi sbizzarrito a presentare diversi Effetti per Natale un po' in ritardo illustro un modo semplicissimo per creare un countdown impostato sulla mezzanotte del 25 Dicembre 2011. Tale script mostrerà una scritta che in tempo reale si aggiornerà sul numero di giorni, ore, minuti e secondi che mancano allo scoccare della mezzanotte. Lo script potrà facilmente essere adattato anche a un'altra scadenza temporale come potrebbe essere per esempio quella di Capodanno. Nulla vieta di utilizzarlo anche per Pasqua o per un compleanno, basta modificare la data dello script (in inglese) colorata verde.

Quando il conto alla rovescia sarà terminato, i visitatori del blog visualizzeranno un messaggio scelto dall'autore. Si potranno anche configurare dimensioni, colore e altri parametri della scritta che verrà mostrata. Il javascript potrà essere inserito in un post o anche su Layout > Aggiungi un gadget > HTML/Javascript. Il codice per Natale è questo

Come inserire immagini in cornici e modelli di Natale o di Capodanno.

Uno degli articoli con il più alto Page Rank di questo blog è quello che elenca tutta una serie di siti in cui creare fotomontaggi. Lo stesso post ha anche ricevuto un numero piuttosto alto di Mi Piace. Mi sembra quindi naturale andare incontro alle aspettative dei lettori indicando un paio di applicazioni in cui fare in modo molto semplice dei fotomontaggi natalizi o relativi all'Anno Nuovo. Molti servizi tra quelli elencati nel post appena linkato hanno una o più sezioni dedicate proprio a queste specifiche festività come del resto a quelle di Pasqua o di San Valentino. Mi limito quindi a segnalare i più interessanti in questo senso.

Photo Montager ha per esempio le sezioni Merry Christmas e Happy New Year. La sezione natalizia conta circa 350 modelli che possono essere usati per inserire le nostre immagini mentre in quella di Capodanno si può scegliere tra una sessantina di template preconfezionati. Dopo aver cliccato sul tipo di fotomontaggio prescelto apparirà una finestra con tre icone in cui si può selezionare la nostra immagine dal computer, dalla webcam o da un album di Facebook. Andando su Fx si può selezionare uno dei numerosissimi effetti e cliccando su T si può anche aggiungere del testo formattato. Si può sempre annullare l'operazione, cambiare foto e aggiungerne un'altra cliccando sull'icona del più. Quando si è finito si clicca su Vai.

Come aggiungere un widget per la Festa della Mamma.

La Festa della Mamma esiste in tutto il mondo ma non c'è una data comune a tutti gli Stati in cui venga celebrato questo evento. In Italia si è scelta la seconda domenica di Maggio, quindi quest'anno si festeggerà l'8 Maggio. In rete esistono anche dei countdown relativi al Mother's Day ma sono evidentemente sfasati rispetto alla data italiana visto che ci sono paesi in cui si festeggia in Marzo, altri in Aprile e altri ancora appunto in Maggio.

Ho trovato però un widget countdown personalizzabile in cui si può inserire la data che può essere utilizzato anche da noi italiani per mostrare il conto alla rovescia della Festa della Mamma

Si digita il testo, si va su Refresh per vedere l'anteprima e si clicca su Copy to Clipboard per acquisire il codice negli appunti. Sarà nostra cura incollarlo su Design > Aggiungi un gadget > HTML/Javascript e posizionarlo a piacere.

Effetti speciali da inserire nel blog in occasione delle Feste di Pasqua.

Gli sviluppatori chiamano Easter Eggs dei programmi nascosti che inseriscono appositamente per fare dei piacevoli scherzi agli utenti. Si tratta di qualcosa che è estraneo alle funzionalità del software e sono sempre assolutamente innocui. In genere si tratta di videogiochi o cose simili. Non ho intenzione di fare nulla di simile ma mi è stato chiesto in un commento o in una email, adesso non ricordo bene, se intendevo presentare degli effetti dedicati alle prossime Festività Pasquali.

Non sono in una particolare fase creativa quindi mi sono limitato a utilizzare il celebre script di Dynamic Drive per la neve che cade inserendo delle immagini più attinenti a questo periodo. Ho sostituito quindi i fiocchi di neve, i cristalli di neve e le foglie secche con delle immagini animate tipiche del periodo pasquale. Riporto i codici qui di seguito. Vedremo successivamente come e dove inserirli:

Come inserire dei fuochi di artificio nel blog in occasione di feste o di ricorrenze.

Vediamo come installare quello che viene chiamato Fireworks Effect e che si deve allo sviluppatore che ha creato anche il Groovy 1970s e il Tinkerbell Mouse Effect. L'effetto provoca un lancio di fuochi dalla parte bassa del layout che poi si "espandono" in modo tale da somigliare a fuochi di artificio. Come è mia abitudine ho testato il funzionamento in questo post

• Demo dell'Effetto Fuochi di Artificio -

Si possono personalizzare il numero di tiri, i colori e la potenza dell'esplosione. L'installazione è semplicissima. Si va su Design > Modifica HTML e si salva il modello completo. Si cerca la riga </head> e, immediatamente sopra, si incolla il codice che ho postato in Google Documenti 

Come inserire una bandiera nel blog per festeggiare i 150 anni dell'Unità d'Italia.

Il 17 Marzo 1861 ci fu la proclamazione dell'Unità d'Italia attraverso l'approvazione da parte del Senato e della Camera dei Deputati della legge n. 4671 del Regno di Sardegna. Le Camere dei rappresentanti si erano riunite tre giorni prima il 14 Marzo 1861. Per festeggiare questa ricorrenza si può inserire nel blog la bandiera nazionale come immagine statica. Vi posto il semplice codice da utilizzare

<div style="position:fixed;top:80px;left:30px;" title="Festa per i 150 anni dell'Unità d'Italia - 17 Marzo 2011" alt="Bandiera Italiana"><a href="http://goo.gl/bKVG7" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-zThHYq6vrg1N__vhNADYeKgMxG8SlX6gdAqTQX-qI82LnObFVNOTJ5YGxs52kEbEHIPEojjX9OnhEl-C-stn-nUAJnY22LvD2DA-8JggJyMaUnZckRH0J6qfm5UNVglveqsnq5DHlPc/" /></a></div>

Può essere personalizzato a piacimento secondo i seguenti parametri:

1. La posizione può essere fixed e allora si mantiene fissa nello schermo allo scorrere della pagina, oppure absolute per farla rimanere immobile rispetto alla pagina
2. Si può inserire nella parte bassa oppure in quella alta: bottom o top. A sinistra (left) o a destra (right)
3. Si possono configurare i margini più opportuni rispetto ai lati prescelti (30px)
4. Il tag Title indicherà quale sarà il tooltip visualizzato se ci si passa sopra con il mouse. Il tag Alt indicherà il testo alternativo.
5. L'URL della immagine, evidenziato di viola, può essere sostituito a piacere da un'altra foto caricata su Picasa o Skydrive.

Hypergurl per inserire nel blog dei giochi online gratuitamente.

<hiper>gURL è un portale di giochi molto interessante perché dà l'opportunità di acquisire l'HTML per postare in un articolo o in una sezione del layout del blog. Ci sono anche diversi tutorial per affrontare tutte le tematiche principali del linguaggio di programmazione e altri tool di interesse generale per i blogger. Limitandoci ai giochi, si nota che sono suddivisi in categorie: Mario Games, Concentration memory card game, Online Christmas game, ecc

Visto che siamo in tema di Feste Natalizie e dopo aver presentato l'effetto nevicata e quello nevicata colorata, mi concentrerò sui Giochi per Natale. Ne sono presenti quattro: Christmas Tree, Christmas Smash, Santa Gift Jump e Boing Boing Santa.

Se si clicca su una delle miniature relative, si accede alla pagina in cui si giocare online

Cursore con cappello di Babbo Natale per mettere nel blog per le Feste.

Sembra che soprattutto il pubblico femminile ami particolarmente le personalizzazioni che mutano la forma del mouse all'interno di un sito o anche solo di una singola pagina. In occasione delle Feste di Natale ho quindi pensato di proporre un codice che, se inserito nel blog, mostrerà ai visitatori il puntatore con la forma del cappello di Babbo Natale.

Lo script funziona benissimo su Chrome e Firefox mentre è un po' più lento su Internet Explorer. Non ho dati sugli altri browser che comunque sono usati da una netta minoranza di navigatori.

Occorre andare su Design > Modifica HTML e cercate la riga

</head>

Subito sopra bisogna incollare il seguente codice

Come partecipare ai festeggiamenti per l'undicesimo compleanno di Blogger.

Blogger è nato il 23 Agosto del 1999 da una società di San Francisco che si chiamava Pyra Labs; fu acquistato da Google nel 2003 che ne ha fatto una delle piattaforme per il blogging più diffuse. Se volete saperne un po' di più consultate la voce Blogger (piattaforma) su Wikipedia che anch'io ho contribuito a scrivere. Per curiosità potete visionare i miei contributi andando su Visualizza Cronologia in alto della pagina.

Per i dieci anni di Blogger sono state introdotte un sacco di novità; ne ricordo alcune tra le più interessanti con la certezza che qualcuna la dimenticherò

1. Il Read More per visualizzare il riassunto dell'articolo in Homepage (in modo nativo)
2. La visualizzazione degli avatar dei commentatori
3. L'introduzione delle pagine statiche
4. I bottoni ufficiali di condivisione su Google Buzz, Facebook, Twitter, ecc
5. Il filtro automatico dei commenti per limitare quegli di spam (questa funzione è di poche settimane fa)

Come mettere nel blog un logo o un badge per la Festa della Donna dell'8 Marzo.

In occasione della Giornata Internazionale della Donna dell'8 Marzo potrebbe essere carino esibire nel blog un logo dedicato all'avvenimento. Questo vale non solo per le donne ma anche, e soprattutto, per i blogger maschi.

Nel sito ufficiale dell'International Women's Day si possono scaricare dei logo dedicati all'avvenimento. Si tratta di semplici immagini che possono essere scaricate con il destro del mouse

Effetti di uova di Pasqua, campanelli e pulcini per preparare il blog alla Settimana Santa.

Per questi effetti mi baserò sullo script creato dal sito Dynamic Drive e che ho usato per la neve che cade per le feste di Natale e per i cuoricini di San Valentino.

I codici seguenti vanno selezionati, copiati ed incollati in un gadget (elemento pagina) del blog in modalità HTML.

Per coloro che hanno Blogger basta andare in Layout>Aggiungi un gadget>HTML/Javascript, non mettere il titolo ed incollare il codice. Salvare e con il mouse posizionare preferibilmente in posizione alta e centrale.  

Gli effetti sono costituiti da una caduta di piccole immagini che avranno il loro massimo al momento dell’apertura della pagina.

Insieme ad ogni riga di codice è mostrata l’immagine a cui si riferisce.

Uova che si aprono -

<script src="http://anonimotoscano.googlepages.com/pasqua1.js?download" type="text/javascript"/></script>

Uova con sorpresa -  

<script src="http://anonimotoscano.googlepages.com/pasqua2.js?download" type="text/javascript"/></script>
 
 Campanelli che suonano -   

<script src="http://anonimotoscano.googlepages.com/pasqua3.js?download" type="text/javascript"/></script>

Uovo decorato -  

 
<script src="http://anonimotoscano.googlepages.com/pasqua4.js?download" type="text/javascript"/></script>

Uova che ballano -  

 
<script src="http://anonimotoscano.googlepages.com/pasqua5.js?download" type="text/javascript"/></script>

Uovo che rotola -  

 
<script src="http://anonimotoscano.googlepages.com/pasqua6.js?download" type="text/javascript"/></script>



Pulcino -    

 
<script src="http://anonimotoscano.googlepages.com/pasqua7.js?download" type="text/javascript"/></script>

Tre uova che girano -  

 
<script src="http://anonimotoscano.googlepages.com/pasqua8.js?download" type="text/javascript"/></script>

 
Ho messo nel web un paio di esempi che potete vedere per rendervi meglio conto di cosa si tratta
Vedi effetto uova che ballano -
 
Vedi effetto uova che girano -