Pubblicato il 22/10/17 - aggiornato il  | 21 commenti :

Attivare la connessione HTTPS nei domini personalizzati di Blogger.

Come migrare da HTTP alla connessione criptata HTTPS se si possiede un dominio personalizzato di Blogger usando il servizio gratuito CloudFlare.
A partire da questo mese di Ottobre il browser Google Chrome denoterà come non sicuri i siti che ancora non siano passati alla connessione protetta HTTPS dal protocollo HTTP.

La scritta Non Sicuro verrà mostrata a sinistra dell'indirizzo della pagina subito accanto alla icona della . Al momento questa funzione è presente solo nel Canale Chrome Canary ma con i prossimi aggiornamenti verrà introdotta anche nella versione stabile di Chrome. L'applicazione Chrome Canary di Android non ha ancora introdotta questa novità ma presumibilmente lo farà in futuro.

Gli utenti di Blogger che gestiscono siti gratuiti del tipo nomeblog.blogspot.com possono agevolmente passare alla connessione HTTPS mediante l'opzione presente su Bacheca -> Impostazioni -> Di Base -> HTTPS -> Reindirizzamento HTTPS. Il problema si pone invece per gli amministratori di siti sulla piattaforma Blogger che abbiano un dominio personalizzato cioè con URL www.dominio.ext per i quali la connessione HTTPS non viene abilitata automaticamente da Google.

Nelle Impostazioni della Bacheca di Blogger si legge testualmente che "il protocollo HTTPS non è attualmente disponibile per i blog con dominio personalizzato." Questo potrebbe far pensare che lo sarà in futuro. D'altra parte l'avviso Non Sicuro viene mostrato solo quando la pagina si apre con un scheda In Incognito o quando il lettore inizia a digitare un commento o una query di ricerca.





La visualizzazione di tale scritta è quindi limitata a una percentuale piuttosto piccola dei lettori e quindi potrebbe essere trascurata. In questo post vedremo come si possa attivare una connessione HTTPS anche per i domini personalizzati in modo da poter scegliere questa opzione in qualunque momento nel caso fosse necessario.

non-sicuro-chrome

Ho creato un sito apposito per testare questo processo che prima delle modifiche come vedete nello screenshot era denotato come Non Sicuro se aperto con una scheda In Incognito o se si digitava in un campo.

1) SALVARE IL MODELLO


Prima di procedere occorre andare su Bacheca -> Tema -> Backup/Ripristino e salvare il Tema del blog per un eventuale ripristino nel caso in cui le modifiche non andassero a buon fine.
I certificati HTTPS vengono offerti gratuitamente ai possessori di siti del tipo Blogspot mentre non è così per i domini personalizzati. In rete esistono diverse società che offrono tali certificati ovviamente a pagamento. Ce ne sono però anche alcune che li offrono gratuitamente. Questa può essere una soluzione nell'attesa che Google risolva questo problema anche per i domini personalizzati.






C'è inoltre da dire che la connessione HTTPS permette di avere un ranking maggiore su Google e quindi di migliorare le SERP e aumentare il traffico. È però necessario che siate consapevoli di alcune cose.
  • Durante la migrazione del blog da HTTP a HTTPS il traffico diminuirà nei primi giorni finché Google scansionerà e indicizzerà tutti gli URL con HTTPS
  • Una volta eseguita la migrazione in HTTPS non saremo più in grado di rimuovere l'HTTPS e quando si tenterà di farlo si perderà il traffico e forse Google ci potrebbe penalizzare.





2) REGISTRARSI A CLOUDFLARE


Si utilizzerà il servizio gratuito CloudFlare per crearci il nostro Certificato HTTPS. Si va in alto su Sign Up per poi digitare le nostre credenziali di accesso al servizio come email e password. Si va poi su Create Account dopo aver messo la spunta sulla accettazione del Termini e delle Condizioni.

cloudflare

Su Add a website si incolla il dominio del nostro sito e si va su Scan DNS Record

scan-dns-record-cloudflare

Il processo di scansione durerà un minuto. Si va su Continue. Verranno creati dei Record DNS per il dominio

dns-cloudflare

Si va su Continue quindi si sceglierà il Piano Gratuito di CloudFlare e si va ancora su Continue.

piano-gratuito-cloudflare

Adesso inizia la parte più delicata. CloudFlare ci fornirà due nomi di server da sostituire a quelli presenti nel Pannello di Controllo del Registrar.

cambiare-nomi-server

Per esempio su Tophost si va su Pannello di Controllo -> Servizio DNS. Si clicca quindi su SOA -> Modifica SOA e si cambia il nome del server primario. Prima di procedere con l'attivazione del servizio HTTPS di Cloudflare controllate che nel pannello di controllo del vostro Registrar sia possibile questa modifica.

Si torna su CloudFlare e si va su Continue. Potrebbero volerci anche 24 ore per attendere che le modifiche del DNS del registrar si propaghino come sanno bene coloro che hanno rediretto il loro blog a un dominio personalizzato. Quando i nuovi DNS saranno attivi lo si visualizzerà nella dashboard di CloudFlare.

3) ABILTARE LA CONNESSIONE CRIPTATA HTTPS


Con i DNS propagati si torna nella Dashboard di  CloudFlare e si sceglie la scheda Cripto quindi si seleziona Flexible nelle opzioni presenti sulla destra.

criptare-connessione

Ora sempre nella Dashboard di CloudFlare si va su Pages Rules -> Create Page Rules

page-rules

Si creano quindi 3 nuove regole delle pagine con questa struttura

https-cloudflare

dove dovrà essere sostituito il dominio usato come test con il vostro dominio. Si va su Save and Deploy. Dopo ver creato queste tre regole si va nella scheda Firewall e si seleziona Security Level -> Low. A questo punto non si ha più bisogno di CloudFlare e si può chiudere la pagina.

4) IMPOSTAZIONI SU BLOGGER


Si va su Bacheca -> Tema -> Modifica HTML e subito sopra alla riga </head> si incolla questo codice

<script>
$(document).ready(function()
{           $("a").each(function()
{             var i = $(this).attr("href");           
  var n = i.replace(http://www.dominio.com, "https://www.dominio.com");                               $(this).attr("href", function() {               return n             })           })         });       </script>

dove al posto di www.dominio.com si incolla il dominio del vostro sito. Si cerca poi questa riga di codice

<b:include data='blog' name='all-head-content'/>

che sta all'inizio del template e si sostituisce con questo nuovo codice

<link href='https://www.dominio.com/favicon.ico' rel='icon' type='image/x-icon'/>
<meta content='blogger' name='generator'/>
<link href='https://www.dominio.com/feeds/posts/default' rel='alternate' title='Nome del Blog - Atom' type='application/atom+xml'/>
<link href='https://www.dominio.com/feeds/posts/default?alt=rss' rel='alternate' title='Nome del blog - RSS' type='application/rss+xml'/>
<link href='https://www.blogger.com/feeds/BlogID/posts/default' rel='service.post' title='Nome del blog - Atom' type='application/atom+xml'/>
<!--[if IE]><script type="text/javascript" src="https://www.blogger.com/static/v1/jsbin/2591933621-ieretrofit.js"></script>
<![endif]-->
<meta expr:content='data:blog.url' name='og:url:domain'/>
<!--[if IE]> <script> (function() { var html5 = ("abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video").split(','); for (var i = 0; i < html5.length; i++) { document.createElement(html5[i]); } try { document.execCommand('BackgroundImageCache', false, true); } catch(e) {} })(); </script> <![endif]-->

dove oltre www.dominio.com si sostituiscono il Nome del Blog e il BlogID. Si salva il Tema.

CONSIDERAZIONI AGGIUNTIVE


Dopo queste nuove impostazioni apri il tuo sito https://www.dominio.com con Chrome e digita Ctrl+Maiusc+J per aprire la Console Javascript. Verranno mostrati gli Errori di Contenuto Misto cioè sia con HTTP sia con HTTPS. Per eliminare questi errori si possono seguire le istruzioni di Blogger.

Potrebbe essere necessario reimpostare il logo della favicon se questa non fosse correttamente visualizzata. Quando si effettua una ricerca con il widget apposito di Blogger si potrebbe visualizzare un avviso di contenuto misto. Per risolvere si va su Tema -> Modifica HTML e si cerca questa riga

<form expr:action='data:blog.searchUrl'>

per poi sostituirla con quest'altra

<form expr:action='data:blog.searchUrl.https'>

e salvare il Tema di Blogger.

Il procedimento però non è ancora finito perché bisogna far sapere a Google che abbiamo migrato da HTTP a HTTPS. Occorre quindi aggiornare il file robots.txt in questo modo

User-agent: Mediapartners-Google
Disallow:
User-agent: *
Disallow: /search
Allow: /
Sitemap: https://www.dominio.com/sitemap.xml

Si va poi su Search Console e si aggiunge la nuova proprietà https://www.dominio.com verificandola e aggiungendo le relative sitemap. Successivamente si potrà inviare la Sitemap anche a Bing e a Yandex.

CONSIDERAZIONI CONCLUSIVE


Non ho potuto testare completamente la procedura perché non mi è stato possibile modificare il nome del server su Tophost che è il Registrar del dominio che avevo usato come test. Direi di considerare la migrazione da HTTP a HTTPS solo come ultima ratio nel caso in cui avessimo un sito molto danneggiato da questa nuova funzionalità di Chrome. L'atteggiamento che mi sento di consigliare è quello di attendere che Google risolva il problema connesso ai domini personalizzati di Blogger. Il fatto che nella Bacheca ci sia la frase "il protocollo HTTPS non è attualmente disponibile per i blog con dominio personalizzato." con l'avverbio attualmente fa pensare che la cosa potrebbe essere risolta senza grossi interventi da parte nostra.


21 commenti :

  1. buongiorno. Io ho un dominio "Aruba", sai se stanno provvedendo a questa novità? Grazie ;)

    RispondiElimina
  2. Non ne ho la più pallida idea. In ogni caso credo che dovrebbe risolvere Blogger (Google)
    @#

    RispondiElimina
    Risposte
    1. Speriamo. Magari possiamo attendere ancora un po' e posticipare eventuali azioni a gennaio (grazie mille!)

      Elimina
  3. Buonasera Ernesto,
    se è utile a te o ai tuoi lettori volevo notificare che ho provato a fare la migrazione http con https con un blog blogspot minore (pochi mesi di vita) completando con successo la procedura. Nel mio caso il Registrar del dominio è Aruba che consente la modifica del nome del server.

    Con la tua procedura elencata qui, nel mio caso, non funzionava ho dovuto modificare il link aggiunto nello screenshot "create a page rule": che nel tuo caso è: http://www.ernestotirinnanzi.it/* togliendo "www", con questa modifica tutto si è risolto al meglio. Non so se vale solo per il mio blog.

    Non mi azzardo ancora a farlo sul blog "master" ben posizionato ma credo che in futuro proverò. Tuttavia se arrivasse prima Google, sarebbe meglio.
    Saluti.

    RispondiElimina
  4. Risposte
    1. Buongiorno Ernesto. Regalo di natale da Google: https per domini personalizzati su blogger attivabile facilmente con 2 click "impostazioni" - "di base". L'ho attivato ieri sera su un blog e, a parte Adsense che è sparito per 10 minuti, poi tutto sembra funzionare bene.

      Elimina
    2. La funzione non è ancora disponibile per i vecchi modelli ma solo per quelli Responsive rilasciati recentemente
      @#

      Elimina
    3. In realtà io ho un modello Emporio ma continuo a vedere "Avviso: il protocollo HTTPS non è attualmente disponibile per i blog con dominio personalizzato". Sbaglio qualcosa?

      Elimina
    4. Chiedi informazioni alla lettrice qui sopra. Avevo ipotizzato che dipendesse dal modello visto che a me la funzionalità non era ancora arrivata. Se anche tu non ce l'hai significa che allora il rilascio avviene seguendo altri criteri, non la lingua visto che il blog in oggetto è in italiano
      https://www.affittareauto.com/2017/10/documenti-per-noleggiare-auto.html
      Restiamo in fiduciosa attesa 😊
      @#

      Elimina
    5. Eccomi.
      Confermo che i criteri non sono lingua né template.
      Forse è solo questione di giorni.

      Ho 3 blog in italiano:
      Il primo del 2014 con un tema NON responsive a cui non ho ancora fatto il cambio http-https ma confermo che la voce "Disponibilità HTTPS" c'è.
      2. Quello da te menzionato "affittare auto" è responsive (nuovi temi blogger) e usa SSL di "CloudFlare".
      3. Un terzo blog con pochi articoli, template NON di blogger a cui ho fatto il cambio https ieri notte via Blogger che offre SSL "Let's Encrypt" e ora sto correggendo alcuni articoli che ho notato hanno contenuto misto.


      Elimina
  5. ragazzi basta che andate su draft.blogger.com e potrete attivare https per i domini custom, funziona per tutti; solo che è in versione draft, cioè di test per ora

    RispondiElimina
  6. Buono a sapersi. Avevo cominciato a avere dei dubbi 😊
    Non c'è fretta. Meglio farlo con la dovuta calma
    @#

    RispondiElimina
  7. A me dice cosi:Spiacenti, si è verificato un errore. (bX-tc0a67)

    RispondiElimina
  8. Ciao Ernesto, io ho avuto il tuo stesso problema con il widget "search" di google. Il mio problema è che questo widget non l'ho attualmente istallato sul blog ma nonostante ciò me lo vede nell'html, infatti dice:
    Mixed Content: The page at 'https://draft.blogger.com/navbar.g?targetBlogID=7822224901470014373&blogName=romanoimpero.com&publishMode=PUBLISH_MODE_HOSTED&navbarType=LIGHT&layoutType=LAYOUTS&searchRoot=http://www.romanoimpero.com/search&blogLocale=it&v=2&homepageUrl=http://www.romanoimpero.com/&vt=6510649303018120088&usegapi=1&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.it.l10LZmJwGZ8.O%2Fam%3DwQc%2Fd%3D1%2Fct%3Dzgms%2Frs%3DAGLTcCM8fq_KPw1zrkmNe1FMuCbd136fBQ%2Fm%3D__features__#id=navbar-iframe&_gfid=navbar-iframe&parent=http%3A%2F%2Fwww.romanoimpero.com&pfname=&rpctoken=52597490' was loaded over a secure connection, but contains a form that targets an insecure endpoint 'http://www.romanoimpero.com/search'. This endpoint should be made available over a secure connection."
    Purtroppo però questo codice non riesco a trovarlo nell'HTML. Sai come vi posso accedere? Grazie.

    RispondiElimina
    Risposte
    1. Sì. C'è la stringa senza la s in http://www.romanoimpero.com. Il widget in qualche modo deve essere presente. Nel tuo codice ci sono anche molte immagini in GIF con http tipo questa
      http://www.revolutiontwo.com/demo/church/wp-content/themes/church_10/images/homepagetop.gif
      che sono immagini prese dalla cartella wp-content di un sito Wordpress. Forse il modello è stato scaricato da internet. Controlla se adesso c'è una versione con gli HTTPS al posto degli HTTP
      @#

      Elimina
  9. Ho trovato questo:

    https://www.blogger.com/navbar.g?targetBlogID\x3d7822224901470014373\x26blogName\x3dromanoimpero.com\x26publishMode\x3dPUBLISH_MODE_HOSTED\x26navbarType\x3dLIGHT\x26layoutType\x3dLAYOUTS\x26searchRoot\x3dhttp://www.romanoimpero.com/search\x26blogLocale\x3dit\x26v\x3d2\x26homepageUrl\x3dhttp://www.romanoimpero.com/\x26vt\x3d6510649303018120088',

    Ma se la parte: "x3dhttp://www.romanoimpero.com/search" la trasformo in "x3dhttps://www.romanoimpero.com/search" e salvo, la S sparisce sempre e torna come prima.. non capisco come mai..

    RispondiElimina
  10. Ho il timore che il codice sia nascosto in qualche modo perchè ho guardato tutto l'html, rigo per rigo ma non ho trovato nulla di questo 'http://www.romanoimpero.com/search'. Esiste un comando per rendere visibile ogni riga dell'html anche quelle più nascoste? Scusami se ti tedio, ma davvero non riesco a trovare il famoso bandolo della matassola..

    RispondiElimina

Non inserire link cliccabili altrimenti il commento verrà eliminato. Metti la spunta a Inviami notifiche per essere avvertito via email di nuovi commenti.
Info sulla Privacy