Pubblicato il 09/11/11e aggiornato il

Come abilitare la versione mobile di Blogger per i modelli personalizzati.

Blogger Buzz ha annunciato che da adesso sarà possibile abilitare la versione mobile anche per i modelli personalizzati. Tutti coloro che hanno un template modificato rispetto a quelli offerti da Blogger, che sono praticamente il 90% del totale, nel momento in cui dovevano abilitare la versione mobile erano costretti a selezionare obbligatoriamente il modello Semplice. Chi aveva un modello ufficiale poteva invece scegliere tra le 27 versioni proposte. Se qualcuno dei lettori non sa di cosa parlo può leggersi questo post per approfondire l'argomento.

Il traffico proveniente da dispositivi mobili di fascia alta è in continuo aumento e si prevede che la tendenza rimanga costante in futuro. Anzi è prevista una accelerazione del processo visto che gli smartphone di nuova generazione hanno una risoluzione paragonabile a quella dei notebook. Attraverso i browser degli smartphone il nostro blog su Blogger veniva quindi visto in modo totalmente diverso rispetto alla normale visione via computer.

Da oggi anche coloro che hanno un modello personalizzato potranno mostrare ai lettori che accedono al blog dagli smartphone un layout molto più simile a quello standard. Vediamo come abilitare questa opzione attraverso la nuova Bacheca di Blogger. Si va su Modello

versione-mobile-blogger

In Cellulare sarà visibile l'anteprima della visualizzazione corrente del blog sui dispositivi mobili. Si clicca sull'icona della versione mobile, si aprirà un menù a discesa in cui sarà adesso disponibile l'opzione Personalizza

personalizzare-blogger-mobile    

Nella finestra successiva sarà possibile cliccare su Anteprima per vedere come viene visto con i cellulari il nostro modello personalizzato

versione-mobile-blogger[4]

Se siamo soddisfatti andiamo su Salva. Le novità non finiscono qui perché si potrà personalizzare ulteriormente l'aspetto del nostro blog. In linea di massima Blogger mostrerà nella versione mobile l'Intestazione, gli Articoli, il Profilo, il Gadget delle Pagine, gli annunci Adsense e il widget dei Crediti.

Sarà possibile verificare quali sono i widget visibili anche nella versione mobile. Occorre andare su Modello > Modifica HTML > Procedi.  Non bisogna mettere la flag a "espandi i modelli widget". Visto che non abbiamo messo il segno di spunta, dei gadget sarà visibile nel template solo una riga. In questo modo si cerca il widget che ci interessa anche inserendo un titolo provvisorio da eliminare in una fase successiva e che potrà avere questo codice

<b:widget id='HTML2' locked='false' title='navigazione' type='HTML'/>

L'ho preso dal mio blog ed è il widget del menù che non voglio mostrare nella versione mobile. Basta modificare questa riga così

<b:widget id='HTML2' mobile='no' locked='false' title='navigazione' type='HTML'/>

in cui è stato aggiunto il tag in rosso. Al contrario ci può essere un widget che vogliamo mostrare nella versione mobile che invece non è stato installato di default da Blogger. Si cerca nel modello sempre senza espandere i modelli widget. Potrebbe avere per esempio questo aspetto (codice preso da questo blog)

<b:widget id='HTML6' locked='false' title='Articoli simili:' type='HTML'/>

Si tratta del widget degli Articoli Correlati che mi interessa mostrare alla fine della pagina anche nella versione mobile per offrire ai visitatori la possibilità di leggere altri articoli su argomenti simili. Per farlo diventare visibile anche nella versione mobile ho dovuto cambiare tale riga in questo modo

<b:widget id='HTML6' mobile='yes' locked='false' title='Articoli simili:' type='HTML'/>

in cui ho aggiunto la stringa in rosso. Come ultima opzione consideriamo la possibilità di mostrare un widget solo nella versione mobile e non in quella per desktop. Potrebbe per esempio essere un Codice QR di cui magari parlerò in un prossimo post. In questo caso bisognerebbe aggiungere al widget il tag

mobile='only'

da inserire nella stessa posizione di quelli precedenti. Ovviamente bisognerà salvare il modello per rendere effettive le modifiche. Come esempio ecco il post

visto attraverso un cellulare di ultima generazione. Come vedete ha un layout molto simile a quello originale.





24 commenti :

  1. Ciao Parsi. Vedo che hai personalizzato la tua versione mobile e sinceramente preferivo la versione precedente. Assomiglia molto alla versione Home ma la navigazione da dispositivi mobili è peggiorata e meno chiara. Scusami la critica ma è molto meno comodo e per uno come me che ti segue molto anche da mobile il cambiamento non è piaciuto molto, eheheheh. :)

    Ciao. :D

    LeNny.

    RispondiElimina
  2. @LaNny
    Può darsi che le cose migliorino. E' solo il primo giorno, lasciali lavorare ;)

    RispondiElimina
  3. @Parsi:

    Certo ma fino a quel momento ti consiglio di tornare alla versione mobile precedente. Non si può nemmeno commentare, manca il link di riferimento e tante altre cose. Check. :)

    Ciao.

    RispondiElimina
  4. @LeNny
    Credo che terrò questa interfaccia mobile per almeno dieci giorni per verificare eventuali variazioni in quanto a numero di visite, frequenza di rimbalzo, dispositivi usati, ecc
    Per esempio vengo molto raggiunto dagli iPad e in quel caso penso che la visione sia buona. Non so quale smartphone tu usi e con che risoluzione. Poi vedrò un po' se cambiare e in che modo.

    RispondiElimina
  5. @Parsi:

    Scusami ma guarda che le variazioni di visite, frequenza di rimbalzo, dispositivi usati, ecc. si vedono comunque benissimo anche con la versione mobile precedente che è la medesima mia e che abbiamo sempre usato fin da quando disponibile. Non cambia assolutamente nulla! Da mobile ti seguo con iPad 2 e iPhone 4 con iOS 5 e la visione è tutt'altro che buona. Si visualizza una brutta copia della versione Home e lo spazio riservato alla sidebar (a destra) è bianco, non sfruttato, gli articoli allungati.

    Non puoi postare un commento, c'è la scritta ma manca il collegamento (link), non si vede l'intestazione, è sparito il menu navigabile dell'intestazione e l'utente non può interagire. Per scriverti ora da iPhone, ho dovuto modificare l'url a mano e togliere la visualizzazione mobile, visto che manca anche il collegamento per la versione Home.

    Ognuno fa quello che meglio crede ma mi dici che senso ha tenere un'interfaccia mobile del genere? Quelli di Google potevano pure risparmiarsi di rendere disponibile una schifezza del genere. Spero tanto che nessuno la utilizzi se i risultati sono questi!!!

    Buona serata.

    LeNny. :)

    RispondiElimina
  6. @LeNny
    Sono dati che conosco volevo vedere le loro eventuali variazioni. Mi dici quindi che fa schifo? Baah non capisco

    RispondiElimina
  7. @Parsi:

    Le variazioni non cambiano con la nuova interfaccia mobile personalizzata, la quale - come dici - fa schifo!!!

    Guardala tu stesso wia web (?m=1), altrimenti stasera appena arrivo a casa ti mando un paio di screen. Tu l'hai vista???

    Non starei qui a dirtelo se veramente non fosse così! L'ho abilitata anch'io per il mio Blog, con piccole modifiche ed il risultato era il medesimo. Ritornato subito alla precedente.

    Ciao.

    RispondiElimina
  8. @LeNny
    Mi hai convinto sulla parola ;)
    comunque vista dal computer è perfetta

    RispondiElimina
  9. @Parsi:

    Non vorrei contraddirti... Ma da web la versione per dispositivi mobili è identica come da mobile, con tutte le "lacune" che ti ho elencato e su tutti i browser.

    Riprovala da web e posta un commento, tanto per dirne una... Se riesci! :P

    Ciao.

    RispondiElimina
  10. @LeNny
    Non si possono postare i commenti perché ho aggiunto un messaggio che impedisce l'attivazione del link ma per il resto è assolutamente eccellente con Chrome, Firefox e Internet Explorer.

    RispondiElimina
  11. @Parsi:

    Non insisto, anch'io ho fatto tutte le prove del caso... Via iPad/iPhone è qui da vedere. Non si scappa!

    Ciao.

    RispondiElimina
  12. Comunque chi ha gli smartphone di ultima generazione può visualizzare la versione normale del blog senza problemi.

    RispondiElimina
  13. Una cosa che non capisco è come inserire/far vedere gli annunci Adsense nella la versione mobile. Mi sai aiutare?

    RispondiElimina
  14. Ho voluto inserire nel mio blog un link a piè di pagina per visualizzare la versione mobile. Ho inserito questo link: http://tobiaalberti.blogspot.it/p/home-page.html?m=1
    In questo modo però cliccando da qualunque punto/sezione del sito si viene reindirizzati (in visualizzazione mobile) alla Home.
    E' possibile inserire un link "magico" che permetta di passare alla versione mobile ricaricando la pagina che si sta consultando, senza essere reindirizzati in un altro posto? Senza essere trasferiti sulla pagina che indica il link?

    Grazie!

    RispondiElimina
    Risposte
    1. @TobiaAlberti
      Queste operazioni si possono fare con il browser del cellulare. Ciascuno visualizza la versione più adatta al suo dispositivo. Io ho un Galaxy Nexus e ho messo di default la visualizzazione della versione desktop. Sono scelte che secondo me devono rimanere più di competenza dell'utente che del proprietario del sito. Comunque non sono a conoscenza di un metodo per "obbligare" a visualizzare la versione desktop anche se si potrebbe fare un redirect dei vari link, operazione però molto lunga.

      Elimina
    2. Allora non ne vale la pena..
      Si, quando si accede da dispositivo mobile è già attivata la versione dedicata, di default. Volevo solo aggiungere un pulsante che, se si fosse passati da mobile a versione web, avesse dato la possibilità di far marcia indietro..
      Lo lascio con il link alla home.
      Ti ringrazio. :) e buona giornata.

      Elimina
  15. Io ho incollato un codice text/javascript che mi serve subito dopo body.
    Da premettere che non lo posso inserire in un gadget ma solo dopo body.
    Questo codice per vederlo nella versione mobile cosa devo fare?
    Se fosse stato un gadget l'avrei trovato subito dove inserire mobile=yes ma così non sò dove aggiungerlo.

    RispondiElimina
    Risposte
    1. @Andrea
      Non mi sono mai occupato di questo tema che però è interessante. Vedrò di informarmi quando avrò un po' di tempo (e di voglia ^_^)

      Elimina
    2. Va bene per questo c'è tempo ed alla fine ho notato che è una cosa molto complessa.
      Potresti rispondermi al post "Come inserire una finestra popup con Shadowbox" ?

      Elimina
  16. salve ernesto, esiste un modo per scegliere il numero di post da visualizzare nella versione mobile? per la versione web ho impostato "2"... ma in quella mobile me ne visualizza "5"...grazie :)

    RispondiElimina
    Risposte
    1. @MarioAlan
      Se esiste non lo conosco :)

      Elimina
    2. ciao ernesto, hai per caso scoperto involontariamente qualcosa a riguardo? :) grazie :)

      Elimina
    3. No, riguardo al numero dei post non ci si capisce granché. @

      Elimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti. Se ti ho aiutato con il post o con le risposte ai commenti condividi su Facebook o su Twitter. Grazie.