Youtube introduce le pagine dedicate ai blog che incorporano i suoi video.

Lo scorso 10 Giugno è stato pubblicato un post sul Blog Ufficiale di Youtube di cui confesso non avevo ben compreso la effettiva portata. Veniva annunciato il servizio "As seen on" per mostrare in una stessa pagina i video incorporati in un singolo sito. Erroneamente pensavo che occorresse fare una domanda per entrare tra i siti con una pagina dedicata da Youtube. Invece non è così, sembra che la cosa sia automatica e che dipenda esclusivamente dal numero di visitatori che aprono i video dal sito che li ha implementati. Quelli di Youtube sono in grado di avere queste statistiche e quindi vogliono in un certo senso ringraziare i blogger che incorporano i loro video con una pagina dedicata al sito.

All'inizio pensavo che la cosa fosse collegata all'account e invece è in funzione del nome del blog. Con mia piacevole sorpresa ho constatato che anche questo blog ha la sua pagina su Youtube

Come personalizzare un video di Youtube incorporato in un blog.

Incorporare i video di Youtube negli articoli del blog è una pratica diffusissima tanto che sembrerebbe superfluo scriverci un articolo. Lo stesso servizio di video-sharing offre diverse opzioni di configurazione direttamente sul sito. Non tutti conoscono però conoscono i parametri forniti dalle API di Youtube. 

Ma andiamo per gradi. Per inserire un video di Youtube nel blog occorre cliccare su Condividi sotto il player

Come inserire una cartina di Google Maps in un blog.

C'è un mashup molto interessante che si chiama UMapper che consente di inserire mappe nei siti con molta facilità e in modo gratuito. Sempre con lo stesso servizio possiamo realizzare anche divertenti giochi geografici. Vediamo adesso come sfruttare alcuni strumenti messi a disposizione da Google per inserire delle mappe nel nostro sito.

Come con GMail anche in Google Maps ci sono diverse funzioni sperimentali raggruppate nei Labs. Dopo aver effettuato l'accesso a Google Mappe tramite il nostro account Google, dobbiamo andare su Impostazioni > Labs di Maps

Come inserire codice HTML o Javascript nei commenti di Blogger.

Nei commenti di un blog come questo che si occupa essenzialmente di tutorial per Blogger ci sarebbe spesso l'esigenza da parte dei lettori e anche da parte dell'autore di postare del codice HTML. Se viene incollato così com'è, Blogger o non lo accetta o non lo pubblica proprio. Nel primo caso viene visualizzata una scritta rossa di questo genere

 

Come sostituire in Blogger il titolo del widget con una immagine.

Con l'avvento del Designer Modelli è possibile personalizzare molti aspetti dei titoli dei widget. Si possono per esempio modificare i colori di sfondo e quelli del testo, la dimensione e il tipo dei caratteri. Comunque c'è sempre qualcuno che non è soddisfatto del tipo di modifiche che si possono apportare e vuole sempre qualcosa di più. Tempo fa mi fu chiesto in un commento se fosse possibile sostituire il titolo di un singolo widget con una immagine. In realtà la cosa è abbastanza semplice ma me ne ero dimenticato e il post con il relativo tutorial non lo avevo mai scritto.

Pongo rimedio adesso con la ragionevole certezza che alcuni lettori si appresteranno alla modifica subito dopo aver letto questo post. Come detto l'obiettivo è quello si inserire una immagine al posto del titolo di un singolo gadget. La foto da inserire può anche essere animata e, per questioni di estetica, deve avere dimensioni compatibili con quelle del titolo che va a sostituire. Come test ho usato il celebre sito CoolText che permette di creare delle scritte molto suggestive che poi possono essere salvate come immagine. Non sto qui a illustrare come ottenerla dato che si tratta di un procedimento molto intuitivo. Si scarica cliccando con il destro del mouse e scegliendo Salva immagine con nome. Ecco un esempio

Come incorporare un Canale di Youtube nel blog.

Molti blogger usano Youtube come supporto dei loro articoli e in molti casi i video postati sono la parte più interessante della loro produzione. 

Possono quindi avere l'esigenza di mostrare sul blog tutti i video del loro Canale per dare ai visitatori la possibilità di scorrerli e aprirli senza lasciare il sito.

Il procedimento per embeddare un Canale di Youtube è semplicissimo visto che c'è solo da incollare in un widget HTML questo codice

<script src="http://www.gmodules.com/ig/ifr?url=http://www.google.com/ig/modules/youtube.xml&up_channel=NomeCanale&synd=open&w=320&h=390&title=&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>

Dobbiamo sostituire a NomeCanale l'ID del Canale che vogliamo incorporare che poi non è altro che il nome dell'account. In teoria possiamo anche incorporare un Canale che non ci appartiene. Le dimensioni si possono modificare rispetto a quelle proposte, evidenziate di viola, ma potremmo nascondere qualcosa in caso di rimpicciolimento.

Google Docs Viewer per aprire qualsiasi documento e per embeddarlo nel blog.

Google Docs Viewer è una funzionalità che mi risulta essere poco utilizzata ma che ha grandi potenzialità. Viene anche chiamato Visualizzatore di Documenti e permette di aprire direttamente nel browser tutta una serie di file di diversi formati. Proprio ieri il blog ufficiale di Google ha dato la notizia che ne sono stati aggiunti altri 12 a quelli che già erano supportati. Praticamente vengono aperti tutti i formati della Microsoft oltre ai PDF e molti altri quali .PAGES della Apple, .Al della Adobe, .PSD di Photoshop, .DXF di Autocad, .SVG, .EPS, .XML, .XPS, .TTF, ecc

Per visualizzare un documento presente in rete ne dobbiamo solo acquisire l'URL. Successivamente si incolla nell'apposito campo di Google Docs Viewer e si clicca su Genera link. Per rendere più chiaro il funzionamento ho inserito un documento DOCX su DropBox nella cartella Public e ne ho copiato l'URL pigiando sul destro del mouse e, successivamente, andando su DropBox > Copy Public Link

 

Come inserire una radio con un player musicale in un blog di qualsiasi piattaforma.

Dopo aver presentato un metodo per inserire una musica di sottofondo e aver presentato il player My Flash Fetish vi illustro come inserire una sorgente radio in un blog di qualsiasi piattaforma. Ci si basa sul sito inglese Internet Radio che offre un servizio particolare che forse merita di essere spiegato, sia pure brevemente. Nei suoi server sono presenti delle emissioni di playlist musicali suddivise in generi musicali. L'utente clicca sull'icona del suo player preferito per scaricare un piccolo file che può essere aperto facendo doppio click.

Le radio sono ordinate in ragione del numero di persone che stanno ascoltandole in quel momento. E' visibile anche il dato riguardante la velocità di connessione e quindi la qualità della emissione in numero di Kilobyte per secondo. I player che possono essere usati per ascoltare la musica sono tra gli altri Flash, Windows Media Player e Real Player.

Come inserire un video di Youtube con l'editor di Blogger in Draft.

Se si voleva inserire un video nel post di un blog su Blogger con il suo editor finora avevamo due opzioni. Si poteva caricare direttamente sulla piattaforma cliccando sulla relativa icona oppure si sceglieva l'opzione "Codice da incorporare", per esempio su Youtube, e si incollava in Modalità HTML. Per centrare il  video occorreva utilizzare i tag

<div align="center"> e </div>

all'inizio e alla fine del codice. Mentre per metterli sulla sinistra del layout del post o inserirli sulla destra, era necessario usare Windows Live Writer a meno che non si fosse degli esperti di linguaggio HTML.

Utilizzando Blogger in Draft è adesso possibile inserire i video di Youtube con grande semplicità. Se si ha un account Youtube è anche possibile selezionare il video da inserire direttamente nell'editor. Bisogna cliccare sull'icona dell'inserimento video

e scegliere una delle tre opzioni: Carica, Da Youtube e I miei video su Youtube. Con Carica si può fare l'upload di un video dal nostro hard-disk su Blogger. Questa opzione però è poco usata perché non viene mostrata la miniatura e il player appare tutto nero. Se si va su I miei video su Youtube, si può selezionare ciascun video che è stato caricato sul nostro account. Cliccandoci sopra sarà riprodotto all'interno della finestra.

Inserire una mappa di Bing in un post con Windows Live Writer 2011.

Mi sono ripromesso di illustrare un poco per volta le novità che sono presenti su Windows Live Writer 2011 rispetto al predecessore Windows Live Writer prima versione. All'inizio mi sembrava tutto più o meno identico ma vedo che sono presenti opzioni molto interessanti per arricchire il post che non c'erano nella suite precedente. Dopo aver parlato del differente modo per inserire i tag alt e title nelle immagini, eccomi a illustrare come si possa inserire una mappa in un articolo. Ovviamente si tratta di una mappa di Bing, il che non è un problema visto che ho già pubblicato un post che spiega come inserire una mappa di Google Maps.

Nella Barra Multifunzione, o Omnibar o Ribbon, se si clicca sulla scheda Inserisci, si visualizza l'icona della Mappa insieme a quelle delle Immagini, Album, Video e Emoticon 

Se ci si clicca sopra si apre un'anteprima della mappa che per default sarà formata dall'intero globo

SeeNow per creare fotomontaggi divertenti con la nostra faccia.

SeeNow è un altro sito che offre un servizio gratuito per realizzare fotomontaggi o meglio per inserire un volto, non necessariamente il nostro, in una serie di modelli già predisposti. E' multilingue con la presenza anche dell'italiano e c'è pure una sezione dedicata ad Halloween che può essere utilizzata proprio in questo giorno

I modelli a disposizione sono centinaia e si possono comodamente cercare nelle schede da sfogliare nella parte alta. Non vi fate ingannare dal quel Get it Now che è solo pubblicità. Arrivati nella scheda preferita si seleziona il template che più ci piace per il fotomontaggio. Abbiamo la possibilità di caricare la foto dall'hard-disk cliccando su Sfoglia oppure da internet incollandone l'URL

Esiste un sistema automatico che inserisce il volto all'interno del template, si può comunque aggiustare come si vuole attraverso il mouse. Appena compiuta questa operazione si clicca in basso a destra su Finire ed Inviare.

L'immagine ottenuta può essere inviata agli amici, se ne può acquisire l'URL, può essere stampata su delle magliette, bicchieri o adesivi, può essere condivisa su Facebook, Twitter, MySpace e altri social.

Andandoci sopra con il destro del mouse si può scaricare come una qualsiasi foto selezionando Salva Immagini con nome. L'immagine avrà un watermark in basso a sinistra che però volendo può essere tolto attraverso il programma Inpaint. Ecco Elisa Isoardi nei panni della diavoletta di Halloween, che si può ingrandire puntandoci sopra il mouse  e utilizzando l'effetto Expando 

 

Altri servizi per fotomontaggi divertenti sono Photofunia, LoonaPix, FunFacer e AmigoXAmigo.

Come inserire emoticon animate (animoticon) nei commenti di un blog su Blogger con l’opzione pagina intera o finestra pop-up.

In un blog su Blogger si può scegliere di inserire i commenti in tre diversi modi

1. Pagina intera
2. Finestra popup
3. Incorporato sotto il post

Per selezionare l’opzione preferita si va su Impostazioni > Commenti > Posizionamento modulo dei commenti e si mette il segno di spunta sulla modalità prescelta ricordandosi di Salvare le impostazioni

In questo blog per il momento ho scelto la Finestra popup. In un articolo di diverse settimane fa avevo parlato di come inserire delle emoticon animate nei commenti ad un articolo. Il metodo illustrato però funzionava solo se si avevano i commenti incorporati sotto il post.
Purtroppo esiste Internet Explorer che è tuttora il browser più usato anche se, per fortuna, sta perdendo utenti continuamente! Il fatto è che detto browser non riusciva ad aprire le pagine di questo blog con quella modalità di commenti e con la presenza del widget Google Friend Connect.

Tutta la storia l’ho raccontata nell’articolo

• Il blog si vede nuovamente anche con Internet Explorer -

Per quanto riguarda il widget Google friend Connect ho supplito con l’inserimento di uno screenshot come spiegato nel post

• Come farsi seguire con Google Friend Connect senza inserire il widget -

Restava quindi il problema delle emoticon animate che non potevano essere più inserite. Adesso ho risolto anche questo piccolo problema e brevemente ne illustro il procedimento.
Andare su Layout > Modifica HTML, scaricare un modello completo e espandere i modelli widget. Cercare la seguente linea di codice

<div class='post-footer-line post-footer-line-3'/>

Se non si trova questa linea può essere che ci sia un altro numero al posto del 3. In ogni caso possiamo anche procedere per tentativi visto che abbiamo salvato il modello e quindi lo possiamo all’occorrenza ripristinare.

L’idea è quella di mettere le faccine proprio alla fine dell’articolo, sotto anche al nome dell’autore, l’ora di pubblicazione e le etichette. E’ ovvio che a secondo dei modelli uno può scegliere un’altra posizione. Per quanto riguarda questo blog immediatamente sopra alla succitata riga di codice è stato inserito quest’altro codice, come mostrato in questo screenshot

Il codice in questione deve essere personalizzato a seconda del modello del nostro blog. Alcune personalizzazioni potrebbero essere queste

- Togliere i due tag <center> e </center> se si vuole che il rettangolo con le faccine sia sulla sinistra e non al centro

-Il colore del testo #191919 e il background #FFFFFF può essere variato a seconda dei colori del blog

- La percentuale del rettangolo è del 68% ed è stata calcolata per questo layout dopo vari tentativi. Se avete un layout più stretto vi consiglio di partire con una percentuale superiore (p.e. 80%) per poi scegliere quella che dà i migliori risultati estetici. Detta percentuale rappresenta la larghezza del rettangolo in cui sono rinchiuse le faccine animate.

- L’espressione “Combinazione di tasti per inserire emoticon animate nei commenti” può essere ovviamente sostituita con un altra.

Dopo aver salvato il modello vi accorgerete che la Homepage avrà lo stesso aspetto ma i singoli articoli, nella parte bassa si presenteranno più o meno così

Per completare l’opera bisogna aggiungere lo script che consente di sostituire automaticamente i gruppi di segni ortografici con le relative faccine.

Sempre in Layot > Modifica HTML cerchiamo la seguente riga di codice

</body>

che si trova nella parte conclusiva del modello e, immediatamente sopra, inserite quest’altro codice

<script src='http://is.gd/3pxvm' type='text/javascript'/>
<noscript><a href='http://parsifal32.blogspot.com' target='_blank'><span style='font-size: x-small;'>Aggiungi emoticons</span></a></noscript>
come mostrato nello screenshot seguente

Salvate il modello. Adesso provate ad inserire come commento delle combinazioni di tasti presenti nel riquadro alla fine del post

Ecco come sarà visualizzato da Firefox, Chrome, Opera (non Internet Explorer!)
 
Termino questo lungo post ricordando che il segno della tilde (~) si ottiene digitando 126 con il tastierino numerico tenendo premuto Alt e che lo script è retroattivo; cioè se in qualche commento precedente sono presenti delle combinazioni come quelle previste allora vi apparirà anche la relativa animoticon.


Aggiornamento Importante: Questo tutorial è obsoleto. Per inserire le emoticon nei commenti di Blogger consultate quest'altro articolo

TokBox è un servizio gratuito che consente l’apertura immediata di una videochat da condividere con amici o contatti sui vari social.

TokBox è un sito che offre un servizio gratis di videochat rapido e semplice da utilizzare. Dobbiamo solo iscriverci gratuitamente ed attivare l’account attraverso il collegamento che ci verrà spedito via email

Occorre inserire un nome e l’età. Mi sono permesso di inserire quello di Dante Alighieri! Verrà quindi creata una pagina personale nella quale invitare amici o inserire i contatti che già si hanno in altri servizi. Non sono riuscito a trovare se c’è un limite massimo di partecipanti ma non credo, il limite sarà probabilmente dato solo dalla larghezza di banda.


Ci sono un sacco di possibili opzioni e opportunità. Mi limito a segnalarne qualcuna

1. Si può inviare l’URL della nostra videochat ad un amico per aprire immediatamente una sessione. Per la cronaca ecco l’URL di quella che ho creato come test
2. Possiamo inserire i contatti di altri servizi come Messenger, Yahoo, Google Talk, ecc
3. Si può creare ed inviare un video, un messaggio, una “greeting card”
4. Si possono cercare amici in altri servizi
5. Si può implementate la videochat nel blog con opzioni che riguardano la presenza o meno di testo, la dimensione, mostrare o nascondere i nick dei partecipanti. Non resta che copiare ed incollare il codice nel sito dopo aver scelto la piattaforma

Per quanto riguarda la videochat vera e propria si clicca su Start a videochat , si consente l’accesso alla nostra webcam e al nostro microfono quindi si invitano gli amici comunicandogli l’URL. Se non si è soddisfatti di questa mia recensione se ne può sempre sapere di più guardando questo video-tutorial.

Il miglior sistema per inserire simboli o caratteri speciali in un articolo, in un modulo o in una email.

A ciascun carattere ortografico corrisponde un numero che lo caratterizza. Questa consuetudine va sotto il nome di codice ASCII. In rete sono presenti alcune tabelle, una è qui, che consente di digitare dei simboli non presenti in tastiera cliccando su Alt+ (numero del simbolo).

Questi simboli però non sempre vengono correttamente digitati perché i numeri che li contraddistinguono possono variare a seconda del software usato. Vi sarà anche capitato di non riuscire ad inserire il simbolo @ in qualche modulo perché la vostra tastiera non era compatibile con un certo sito.

A questi inconvenienti si può rimediare con Copy Paste Character che, come dice il nome stesso, permette di copiare il carattere che ci interessa e successivamente di incollarlo nell’editor dell’articolo o della email che stiamo scrivendo

Il funzionamento è semplicissimo

1. Si clicca sul simbolo da inserire
2. Questo viene automaticamente copiato negli appunti
3. Si incolla dove lo vogliamo mettere
4. Eventualmente ne ridimensioniamo il carattere o ne variamo lo stile (grassetto)

Ecco alcuni esempi qui sotto

« »   ★   ♥   ♪    ♫   ☜   ☞    ♀    ♂    ∞   ↑    ↓   ®

Un sito da mettere decisamente nei Preferiti.