Come eliminare il pulsante di Google+ nella versione mobile di Blogger.
I pulsanti per la condivisione nei social network possono essere inseriti nella versione desktop andando su Layout > Post sul blog > Modifica e mettendo la spunta su Mostra i pulsanti per la condivisione. Si può anche decidere di non mostrare questi bottoni togliendo la flag accanto a tale opzione. Bisogna comunque sempre ricordarci di andare in basso su Salva, nella finestra che si apre, per rendere effettive le modifiche introdotte.
Anche nel caso si sia scelto di non mostrare i pulsanti di condivisione sociale nella versione mobile rimarrà comunque il pulsante con contatore di Google+ che vista la posizione che ha nel layout rende piuttosto difficile l'inserimento di altri elementi. In questo articolo vedremo come si procede per nascondere questo pulsante senza eliminare il codice in modo da rendere molto semplice un suo eventuale ripristino.
Partiamo quindi da una situazione come quella mostrata nello screenshot precedente. Come di solito quando si opera nel codice HTML è assolutamente consigliabile di salvare il template per questioni di sicurezza. Si va si Modello > Modifica HTML e con Ctrl+F si cerca questa riga
che rappresenta l'inizio del codice per la versione mobile di Blogger. Per visualizzare tutto il codice si deve cliccare nella freccetta nera posta a sinistra della riga. Si scorre verso il basso fino a trovare il blocco di codice del pulsante di Google+ che è il seguente
<b:if cond='data:top.showDummy'>
<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
Potremo cancellarlo per togliere il pulsante con contatore ma è preferibile modificarlo così
<!-- Pulsante Google+ Inizio -
<b:if cond='data:top.showDummy'>
<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
- Pulsante Google+ Fine -->
<b:if cond='data:top.showDummy'>
<div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
- Pulsante Google+ Fine -->
In sostanza si è messo il codice tra i tag di un commento <!-- e --> per non farlo rilevare. Si salva il modello e se apriremo un post con un dispositivo mobile non vedremo più il pulsante
![pulsante-google-plus[4]](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBs6X4_Pvgq-vPf9ks7iCDFAzF_PMWF8FsR5bCQoF8UAeYZah8XB6jDbnfo_wTocmiGvajQrIo73Bn_v2JaS3qIJzPefik6e1skrw_xooTEXtDUeZuShfGokotPhxkCPuwbnpCFc646K4/?imgmax=800 "pulsante-google-plus[4]")
Nel caso in cui volessimo ripristinare il pulsante basterà togliere la prima e l'ultima riga per lasciare il solo codice iniziale. Questa tecnica può essere usata anche con altri elementi ed è una scelta più brillante di quella dell'utilizzo del display:none; applicato al selettore univoco.
Ciao Ernesto, ottimo articolo, come sempre.
RispondiEliminaVorrei chiederti un parere in merito alla mancanza di conteggio delle condivisioni su g+ nei Blog su piattaforma Blogger se non si utilizza il pulsante ufficiale.
Ciò accade con i più noti servizi di Condivisione, compresi Shareaholic e Add-This, ad esempio.
Le icone con contatore mostrano il numero di condivisione di tutti i social, tranne quelle di g+. Sui siti ufficiali dei vari servizi non ci sono soluzioni per Blogger;
tu ne avresti qualcuna, magari con stringhe o tag condizionali da inserire mel modello?
Grazie.
Non ero a conoscenza di questa problematica. Nel caso trovassi delle informazioni utili ci farò un post
Elimina@#
Grazie, gentilissimo.
EliminaCiao.
Ciao Ernesto, ho letto molti dei consigli del tuo blog e li trovo davvero semplici ed utili. Purtroppo, non per me: tutte le modifiche che apporto al codice mobile vengono rigettate. Ad esempio, ho provato invano a togliere il pulsante di Google+, pur avendo seguito fedelmente il processo da te indicato. E' come se la parte mobile risulti immodificabile. Precisazione: come veste del blog, ho scelto il template Fantastico S.p.A. sia per la versione desktop che per quella mobile. Che sia un problema di template? O devo fare ulteriori modifiche al codice per sbloccare la sezione riguardante il mobile? Spero tu possa rispondermi, grazie per l'attenzione. E complimenti per il blog!
RispondiEliminaDevi andare su Modello > Cellulare e scegliere Personalizza. Solo in questo modo vengono recepite le modifiche del template nella versione mobile
Elimina@#
Grazie mille, ha funzionato. Ora posso finalmente applicare i tuoi preziosi consigli. Gentilissimo, a presto!
EliminaBuongiorno Ernesto,
RispondiEliminaseguite le istruzioni, tolto g+ e istallato i social come da questo post http://www.ideepercomputeredinternet.com/2015/07/icone-sociali-blogger-mobile.html
non attua nulla di tutto ciò- incluso il banner cookies istallato come da istruzioni qui http://www.ideepercomputeredinternet.com/2015/08/banner-cookie-blogger-google-personalizzare-desktop-mobile.html
puoi aiutarmi a capire come risolvere?
(il mio sito è www.counselingstyle.it)
Grazie
Non ho capito che c'entri il banner dei cookie con le icone dei social. Devi essere più chiara
Elimina@#
scusami.
Eliminasono 2 istruzioni che ho seguito e il mio modello non prende.
la prima: ho eliminato la scritta G+ e poi inserito la condivisione da cellulare.
risultato: continua ad esserci G+ e nessuna icona per la condivisione da cellulare.
la seconda: ho inserito il banner dei cookies, tutto giusto il testo ed i colori, ma lo inserisce solo sopra, nonostante il codice
/* CSS Accettazione Cookie */
#cookieChoiceInfo {
top: auto !important; /* Banner in basso */
bottom: 0 !important; /* Banner in basso */
}
Grazie per l'aiuto e i tuoi consigli
Per la eliminazione del pulsante di Google+ forse non ti funziona questo sistema perché hai un modello non ufficiale scaricato da internet. Prova a cancellare il codice evidenziato di giallo. Prima però salva il template.
EliminaPer la seconda domanda riguardo al banner dei cookie non so che post hai consultato.Prova con questo che è l'ultimo e che recepisce le ultime variazioni del codice da parte di Google
http://www.ideepercomputeredinternet.com/2015/08/banner-cookie-blogger-google-personalizzare-desktop-mobile.html
@#
Provato a cancellare il giallo, nulla da fare.
EliminaIl modello che uso è un simple di blogger modificato tramite css.
Per il banner, è preso proprio da quel post che indichi. ma resta in alto.
Grazie comunque
Allora sbagli sicuramente qualcosa. Provo a indovinare cosa sbagli. Per il pulsante di Google+ forse hai trovato il codice della versione desktop e non di quella mobile. Scorri il codice subito dopo la riga
Elimina< b:includable id='mobile-post' var='post' >
come indicato nel post stando attenta a non andare nella sezione successiva che è quella desktop.
Per il banner sicuramente hai provato a personalizzare il codice prima di incollarlo nel modello. Dopo aver salvato il template incolla il codice così com'è e vedrai che lo visualizzerai in basso visto che è stato abbondantemente testato da centinaia di lettori. Solo successivamente passa a apportare le modifiche per URL della Policy Cookie, del testo, ecc
@#
Ci ho sperato.
Eliminain effetti avevo modificato prima, ora ci sono i tuoi tasti (colori etc) ma resta sempre in alto al blog.
(comunque ne ho due di blog e nel secondo è andato tutto perfettamente, posizionato in basso, con tutte le mie personalizzazioni).
secondo me ci sarà qualche tasto condizionale nel mio template che me lo lascia in alto.
(per G+ ci rinuncio e aspetto che addthis risolva il bug dei cellulari e poi provo a mettere quelli).
Grazie Ernesto
Per il banner credo che tu abbia inserito prima di questo un altro codice e che non lo hai tolto quando hai incollato questo nuovo codice
Elimina@#
Ciao, quale può essere il motivo per cui non trova la riga
RispondiElimina< b:includable id='mobile-post' var='post' > pur seguendo correttamente le istruzioni?
In genere perché non viene usato correttamente la combinazione di tasti Ctrl+F. Leggi questo post
Eliminahttp://www.ideepercomputeredinternet.com/2016/11/blogger-template-manage.html
Se invece sei già esperta allora prova a cercare solo una stringa della riga come per esempio
id='mobile-post' var='post'
@#
Ho provato modificando il codice, ed in fase di salvataggio non mi viene accettato il codice modificato. allora ho provato ad eliminare completamente la stringa, ma a quel punto il tasto sharing nella versione mobile rimane comunque presente.
RispondiEliminaBuongiorno, in questo momento avrei bisogno di una delucidazione veramente particolare. Dopo aver fatto ancora molto attentamente uno dei miei studi da autodidatta, ho concluso che sperimentare continuamente una forte variabilità del First Input Delay, dipende molto dal Tempo di risposta e input lag legati alla risoluzione degli schermi lato Client. Quindi credo, presumibilmente, che nel Template possa essere manipolata, anche se non so in che modo, la stringa "legata" al seguente messaggio, stringa che non posso riportare per intero, data la presenza di Tag che non vengono accettati da questo Sistema, e in proposito attendo delucidazioni, grazie____
RispondiEliminaSe i fantastici membri di questa community me lo consentono, volevo solo avvertire di non implementare con i tag di Goolge Analitics, appesantiscono notevolmente le prestazioni
RispondiElimina