Una versione di questa personalizzazione l'ho già presentata nel precedente post che mostrava un banner insieme ai bottoni di condivisione di Facebook e Twitter ma è una funzionalità visibile in molti quotidiani online come Il Sole 24 Ore anche se in quel caso il banner esce dal basso e non dalla destra come nella versione proposta nel post linkato e in questo articolo.
La differenza tra questo widget e il precedente risiede nella mancanza delle icone sociali di Twitter e Facebook e nella possibilità entro certi limiti di gestire la quantità di scorrimento della pagina che fa aprire il banner con il post consigliato. Se in quest'ultimo sono presenti delle immagini sarà mostrata anche la miniatura della prima che viene rilevata
Qualche tempo fa era ancora possibile installare il plugin dei Recommended Posts di Facebook che però è stato deprecato unitamente alPlugin Activity Feed. Tale plugin mostrava un banner laterale quando si scorreva la pagina con i link ad altri articoli dello stesso sito condivisi su Facebook.
Seguendo quella stessa falsariga è stato realizzato un gadget analogo per Blogger. Dopo l'installazione di questo widget, se si scorre la pagina verso il basso, si visualizzerà un banner con titolo e link a un altro articolo del sito unitamente alle icone di Facebook e Twitter munite di contatori per eventuali condivisioni. Tale banner verrà visualizzato solo nei post e non nella homepage, nelle pagine di archivio o delle etichette.
Il gadget che vado a presentare è una elaborazione del widget scorrevole dei post consigliati per piattaforma Blogger reso di più facile installazione e con la presenza dei bottoni concontatore di Twitter e Facebook. Per la realizzazione di questo gadget ho dovuto attingere al lavoro di altri siti verso cui inserirò i crediti di attribuzione a fondo pagina. Il concetto del widget è quello di mostrare in basso sulla destra un popup a scomparsa quando l'utente scorre la pagina fino in fondo. Tale banner avrà un collegamento a un articolo dello stesso blog che tratti un argomento simile. Il lettore potrà cliccare sul titolo del post per aprire l'articolo oppure andare sulla icona della croce per nasconderlo.
Nel caso in cui nel post simile ci sia almeno una immagine, se ne vedrà la miniatura subito a sinistra del titolo. Ecco cosa vedranno sulla destra i navigatori che scorreranno il post
Da qualche tempo su alcuni siti, anche prestigiosi come Il Sole 24 Ore, quando si scorre un articolo, in basso a destra compare un rettangolo che invita a aprire un articolo correlato a quello che si sta leggendo. Esistono dei servizi ancora in Beta che offrono questi widget ma, pur avendo fatto richiesta da diverse settimane, non mi hanno ancora mandato l'invito. Probabilmente vengono privilegiati i siti di lingua inglese.
Per fortuna sul web ho trovato un grande plugin diCodrops realizzato con JQuery e che è stato riadattato daBlogger Plugins per gli utenti di Blogger. Ve lo presento con qualche modifica e con le istruzioni per ulteriori personalizzazioni. Il rettangolo che invita a leggere un altro post del blog comparirà solo in calce agli articoli e non sarà visualizzato in homepage e nelle pagine delle etichette.
Dopo aver installato il modulo dei commenti di Facebook su Blogger ci potremo porre il problema di eliminare completamente i commenti di Blogger e lasciare ai lettori la possibilità di commentare solo attraverso Facebook. Non so come questa soluzione possa essere azzeccata ma vediamo come procedere senza neppure modificare il modello. Per prima cosa il modulo dei commenti di Facebook va inserito in una posizione diversa da quella indicata nel post e deve essere inserita una condizione affinché risulti visibile solo negli articoli.
Ho recentemente pubblicato un articolo riguardo a uno Slideshow degli ultimi post con miniature in orizzontale che ha avuto un certo successo. In un paio di commenti mi è stato fatto presente che sarebbe stato meglio poter selezionare la velocità di scorrimento del widget per adattarlo alle singole esigenze. Ne posto quindi un'altra versione che viene incontro a questa richiesta. Ho postato in rete una
Come vedete è molto più lento visto ciascuna schermata rimane per 10 secondi invece dei 5 del precedente slideshow. Ho anche modificato il numero dei post visualizzati che adesso sono cinque invece di sei. Per l'installazione di questo widget non occorre modificare il modello, si va semplicemente su Design > Aggiungi un gadget > HTML/Javascript e si incolla questo codice HTML
La ricerca di slideshow orizzontali per gli Ultimi Post su Blogger è sempre stata ai primissimi posti tra gli utenti di questa piattaforma. Dopo aver visto un gadget presente suArona Immobiliare ad opera di Giorgiogal e dopo aver consultato il lavoro diAntonio Lupetti suNews Ticker with Horizontal Scrolling basato sul framework MooTools, sono in grado di presentare un gadget orizzontale scorrevole che mostra miniature e titoli degli ultimi post pubblicati. Ho, come mia abitudine, inserito online una
E' sempre visibile con Chrome, Firefox e Opera mentre con Internet Explorer dipende da quanti e quali altri script sono presenti nel modello. In quello che ho usato come test ce ne sono di troppi per i gusti di IE ma questo non toglie che non possa essere visibile nel vostro template. Il widget mostra gli ultimi 12 articoli con miniature in due schermate di sei che si susseguono in modo automatico con effetto slide.
Ho presentato molti gadget per mostrare gli Articoli Più Recenti del nostro blog su Blogger. Ricordo quello semplice con solo titoli e sommario, quello più complesso con le miniature e infine il gadget slideshow, il più sofisticato. Questo widget che vado a presentare è molto originale ed è stato realizzato usando le API di Google. Può essere personalizzato nei colori e nel numero dei post da visualizzare. La sua particolarità risiede nel fatto che saranno mostrati gli Ultimi Post con un breve sommario di solo uno di questi. Ci sarà un effetto di transizione che porterà in primo pianoalternativamente tutti gli articoli dell'elenco. Per avere una idea del suo funzionamento visionatelo sulla destra del post di prova
Aspettate qualche secondo per apprezzarne appieno le potenzialità. Ci sarà una freccia che indica di volta in volta il post di cui si visualizza l'incipit
Ho presentatoMenù di tutti i tipi ma questo è veramente originale perché riunisce in un solo slide, oltre alle voci classiche del Menù, anche le icone per accedere allapagina fan di Facebook, all'account Twitter o per sottoscrivere i feed del blog. C'è anche il modulo per iscriversi alla Newsletter a cura di FeedBurner. Come è mia abitudine, ho pubblicato in rete una
Illustrerò questo effetto per un blog su Blogger ma il codice potrà essere utilizzato anche su altre piattaforme visto che si basa su una libreria JQuery supportata da tutti i browser. Il concetto è quello di mostrare una immagine sotto a un'altra che appaia tramite scorrimento della prima quando ci si passa sopra con il mouse. Prima di procedere con il procedimento di installazione, vi invito a visualizzare l'effetto che ho creato in un post di prova
Per ottenerlo occorre andare su Design > Modifica HTML e salvare il modello completo. Cercare la riga </head> e, immediatamente sopra incollare questo codice
Alcune personalizzazioni che andavano bene, e funzionano tuttora, per i vecchi modelli di Blogger non sono più compatibili con i nuovi template che sono stati introdotti insieme al Designer Modelli. E' mia intenzione quindi di riproporre alcuni dei widget, degli effetti e dei menù in modo che siano installabili anche da chi usa l'ultima generazione di template. Il Menù laterale espandibile risale a un anno e mezzo fa e mi risulta da alcuni commenti che la sua installazione sia diventata problematica. Eccone una nuova versione che ho testato sul modello "Semplice". Ricordo che, nel caso si modifichi il template passando a un altro mediante le funzionalità del Designer Modelli, questo menù sparirà e dovrà essere reinstallato. Comunque ho constatato che funziona con tutte le versioni del modello "Simple". Questo fa presupporre che sia installabile su tutti i nuovi modelli di Blogger, anche se per ovvie ragioni di tempo non ho potuto verificarlo.
Per prima cosa occorre costruirsi la struttura del menù. Ecco uno screenshot del suo aspetto che aiuta a progettarlo
Stupeflixha un modo davvero originale di proporre degli slideshow. Per utilizzarlo dovrete registrarvi gratuitamente ed inserire alcuni dati personali. Appena lo avete fatto potete andare nell’editor degli slideshow. Per default sono già presenti alcune foto ma voi potete eliminarne alcune cliccando su “+” e Delete the group oppure andando in basso e scegliere Clear All per eliminarle tutte. Adesso, sempre in basso, cliccate su Add Images per aggiungere le vostre Si può scegliere come al solito se caricarle dall’hard-disk o da URL. Con il mouse si possono trascinare tutte nella stessa finestra e cliccando sul “+” in alto a destra di ciascuna si può eliminarla o titolarla Andando su Open in XML Editor possiamo compilare una pagina in HTML modificando gli attributi dello screenshot Ho sostituito l’effetto kenburnscon explode. Può anche essere modificata la durata di un singolo effetto e la sua direzione. Per conoscere tutti i tipi di effetti possibili e i relativi attributi andate nella pagina delle API nel Dev Center. Appena terminato cliccate su Generate the Video in basso a destra. Sarà quindi creato un video slideshow delle immagini che abbiamo inserito. Viene chiesto il formato che preferiamo
e se vogliamo riceverlo o inviarlo per email. Quindi cliccare su Launch generation. Verrà mostrato l’evolversi del processo Quando è tutto terminato si può vedere la realizzazione in un Player
Possiamo scaricare il video andando su Download the video oppure acquisirne l’URL per inserire eventualmente in un blog. Spero che la Cristina Chiabotto non se la prenda troppo visto che uso spesso le sue foto per le demo
Se si ha un blog sulla piattaforma Blogger per inserire uno slideshow in Homepage non ci sono molti problemi basta andare su Layout> Aggiungi un gadget> Slideshow
Inserire una parola chiave. Nell’esempio è riportato Sunset (tramonto), le parole chiave inglesi hanno una maggiore varietà di immagini. Si può inserire anche il nome di una celebrità per vedere in successione alcune sue foto presenti nel web
Velocità – qui non c’è nulla da spiegare
Opzioni – se si vogliono aprire i collegamenti alle immagini in un altra finestra (auspicabile) e se si vuole dare un casualità all’ordinamento delle immagini
Questa funzionalità è interessante ma ha dei limiti oggettivi
Non si possono fare slideshow con immagini proprie
Questi possono essere caricati solo in Homepage
Gli effetti di transizione sono modesti
In rete esistono dei servizi che creano gratis degli slideshow a partire dalle nostre foto. Oggi vi voglio parlare di Slideche può essere utilizzato oltre che per Blogger anche per un blog in un’altra piattaforma, per MySpace, per Facebook, e per molti altri servizi ancora.
La registrazione è assolutamente gratuita e anzi mi risulta non sia neppure necessaria anche se consigliabile. Quello che occorre è avere una collezione di foto per creare lo slideshow e poi pensa a tutto il servizio.
Per iniziare cliccate su Make a Slideshow e selezionate le vostre preferenze e le vostre foto
Nella parte sinistra sono elencati i servizi in cui cercare le foto. Se voi le avete nel computer scegliete la prima opzione My Files; se sono caricate nel web scegliete l’ultima, Image URL. Nella parte destra si può scegliere il Design del nostro slideshow su Styles. Ci sono anche altre interessantissime opzioni quali Skins, Themes, Music/Video, Background, Effects, Size, Privacy che concernono rispettivamente
L’aspetto dello slideshow
Il modello dello stesso
Se si vuole inserire della musica ci sono dei pezzi a disposizione ma se ne possono cercare altri
Sceglierne lo sfondo
In Size si può scegliere la dimensione in pixel che per default è 426x320
In Privacy si può scegliere di mantenerlo privato o renderlo pubblico
Le foto possono anche essere caricate tutte assieme selezionandole tenendo premuto Ctrl. Dopo che si sono caricate si può modificare
l’ordine con il trascinamento del mouse, il colore di sottofondo, inserire il titolo. Quando si è finito si clicca su Save (get code). Successivamente ci sarà un’anteprima dello slideshow e, se siamo soddisfatti, si clicca nuovamente su Save Slideshow, bottone verde che si trova sulla destra.
Si può aggiungere direttamente a MySpace o agli altri servizi presenti nella colonna di sinistra selezionandoli. Per un blog bisogna selezionare, copiare ed incollare il codice HTML in un gadget di Blogger del tipo HTML/Javascripit per metterlo in Homepage. Se invece si vuole inserirlo in un articolo basta incollarlo in modalità HML. Questo è quello che ho fatto io ed ecco il risultato
Se si elimina il codice che viene dopo </object> e che è selezionato di blu in questo screenshot si tolgono i pulsanti che stanno alla base dello slideshow. Il collegamento al sito rimane comunque quindi non credo che possa considerarsi pratica sleale
Con lo stesso servizio si può creare anche un FunPic, sostanzialmente significa inserire delle nuvolette di testo in una foto, e un Guest Book per raccogliere foto di amici corredate da mappe per la geolocalizzazione. Credo sia un servizio che piacerà molto alle donne che hanno un temperamento artistico e un gusto decisamente superiore a quello degli uomini. Se volete far cessare la musica basta cliccare nel piccolo altoparlante che si trova in alto.
