Certificado SSL gratuito de Cloudflare y configuración en Blogger

min highlight

Respondiendo pedidos, en esta ocasión vengo a explicar el certificado SSL, como obtenerlo de forma gratuita y configurarlo correctamente en Blogger.


Ventajas del certificado SSL

El protocolo de seguridad SSL se encarga de cifrar la información que viaja entre un servidor a otro, lo que nos permite defendernos de ataques informáticos como el robo de información.


Para entenderlo un poco mejor, el Internet es libre, por lo tanto la información que recibes desde una pc hacia tu servidor puede ser interceptada, lo cual puede suponer a una empresa perdidas millonarias. Sin embargo al encontrarse esta información cifrada, el hacker no podrá leer los datos directamente. Mientras mas fuerte sea el cifrado, mayor protección.


Sin el cifrado, los ladrones informáticos pueden tomar los datos tuyos o de tus clientes. Es por esto que paginas que manejan información importante, como correos, transacciones bancarias, etc. Cuentan con este certificado, que es visible para los usuarios (Un candado verde). Contar con un certificado también nos proporciona otras ventajas:


Antimalware - Los certificados escanean el sitio en busca de malware.


Mejor posicionamiento (SEO) - Es solo un punto entre muchos, pero buscadores importantes como Google aprecian los sitios que protegen la información de sus usuarios.


Mas confianza - Principalmente bueno para ecommerce, ya que los usuarios tendrán mas confianza en adquirir tus productos.


Legitimidad - Demuestras que tu sitio es el oficial, al conseguir que una entidad independiente certifique tu web.


Obtener Certificado (Cloudflare)

Soy conciente de que existen otras alternativas, pero en este caso voy a centrarme en obtener el certificado de Cloudflare, ya que, ademas del cifrado, nos ofrece muchas herramientas útiles y todo desde la cuenta gratuita.


Crear cuenta y cambiar dns

Dirígete a cloudflare y crea una cuenta siguiendo los pasos de la pagina. Una vez finalizado el registro y haber iniciado sesión veras lo siguiente:


cloudflare-captura-01

Escribe tu dominio y presiona el boton Scan DNS Records. Cloudflare comenzara a buscar todas las DNS correspondiente al dominio. Una vez finalizada la carga se mostraran las dns. No hay que tocar nada (si no lo deseas) solo presionamos continuar para ir a la siguiente pantalla:


cloudflare-captura-02

Seleccionamos el plan gratuito (la primera opción) y damos clic en continuar. Ahora esta parte se complica un poco, sobre todo porque varia dependiendo de la empresa que te proporciona el dominio, en mi caso lo hare con Godaddy. Una vez seleccionado el plan Cloudflare nos mostrara lo siguiente:


cloudflare-captura-03

Básicamente lo que nos esta pidiendo es que vayamos a nuestro administrador de dominio y cambiemos la direccion de las DNS por las de cloudflare. En el caso de godaddy estas se encuentran en la Administración de DNS. Únicamente debemos cambiar las opciones en Servidores de nombres y dejarlo en "personalizado", posteriormente agregar las DNS que nos indicó cloudflare y guardar cambios, nos debería de quedar de la siguiente manera:


cloudflare-captura-04

Ahora en cloudflare damos clic en Continue. Dependiendo del dominio, los cambios que acabamos de hacer en el administrador DNS pueden tardar desde unos minutos, hasta 48 horas, si los cambios aun no se han distribuidos veremos la siguiente pantalla:


cloudflare-captura-05

Podemos esperar unas horas y con el fin de comprobar que ya este todo funcionando presionamos el botón Recheck Nameservers. Si no sucede nada hay que seguir esperando. Una vez los cambios hayan tenido efecto veremos lo siguiente:


cloudflare-captura-06

Ahora ya podemos utilizar cloudflare como nuestro Administrador de DNS y disfrutar de sus ventajas, una de ellas es el certificado SSL gratuito que se auto-renueva cada 6 meses y que vamos a activar justo ahora. En el menú de iconos vamos a ir a la pestaña "Crypto", veremos que la opción SSL se encuentra en "Off", vamos a cambiarla a "Flexible" de la siguiente manera:


cloudflare-captura-07

Nuevamente hay que esperar hasta que se propague y esto puede tardar hasta 24 horas. Una vez propagado podremos entrar a nuestro dominio desde https sin problemas, ademas de que en la opción SSL de cloudflare se mostrará como Activada.


Una vez que hayamos comprobado que nuestro dominio funciona a través de https sin problemas, vamos a activar la opción Automatic HTTPS Rewrites, que también se encuentra al final de la pestaña crypto. Esta opción nos ayuda a resolver el contenido mixto, ya que Cloudflare reemplazará los recurso http hacia https automáticamente.


cloudflare-captura-11

Ahora vamos a crear una regla de tal forma que al entrar a nuestro dominio por http, se re-dirección hacia https. Para ello vamos a la opción Page Rules en cloudflare, presionamos el botón "Create Page Rule" y en la ventana modal, escribiremos nuestro dominio de esta forma: http://*dominio.com/*. Luego presionamos + Add a Setting y seleccionamos Always Use HTTPS, nos quedaría así:


cloudflare-captura-08

Ahora presionamos el botón verde "Save and Deploy" para guardar nuestros cambios. Al hacerlo notaremos que se nos agrego una nueva regla, si por alguna razón se encuentra apagada entonces encenderla:


cloudflare-captura-09

Finalmente vamos a la opción "Caching" de Cloudflare y purgamos toda la cache de esta manera:


cloudflare-captura-10

Y listo, ya tenemos configurado https con nuestro dominio de forma gratuita y todo proporcionado por Cloudflare. Pero aquí no hemos acabado, necesitamos hacer algunos cambios en blogger para que funcione correctamente.


Configurar Blogger para https

Actualmente Blogger no permite activar https en dominios personalizados, por ello tendremos que cambiar manualmente algunas cosas, no es complicado pero lo explicare paso a paso.


Resolver https en sitemap.xml

La url del sitemap que figura en el archivo robot.txt se encuentra como http, lo podemos comprobar si entramos a tudominio.com/robots.txt. Para cambiarlo, ve a Configuración > Preferencias para motores de búsqueda > Archivo robots.txt personalizado y lo habilitamos marcando en "Si". En el cuadro de texto que nos aparece pegamos lo siguiente:


User-agent: Mediapartners-Google
Disallow: 

User-agent: *
Disallow: /search
Allow: /

Sitemap: https://www.dominio.com/sitemap.xml

Reemplazando www.dominio.com por la url correspondiente a nuestro dominio. Guardamos los cambios y si comprobamos nuevamente notaremos que el archivo robots.txt se habrá actualizado.


Resolver https en data:name

Otro gran inconveniente es que las etiquetas data:name que devuelven una url no detectan https. Para resolverlo nos dirigimos a Configuración > Tema > Editar HTML y buscamos todas las etiquetas data:name con estas características:


<data:blog.url/>
<data:blog.homepageUrl/>
<data:blog.canonicalUrl/>
<data:blog.canonicalHomepageUrl/>
<data:blog.newerPageUrl/>
<data:blog.olderPageUrl/>
<data:blog.searchUrl/>
<data:label.url/>
<data:post.url/>
<data:post.href/>

Y reemplazamos todas por las siguientes:


<data:blog.url.https/>
<data:blog.homepageUrl.https/>
<data:blog.canonicalUrl.https/>
<data:blog.canonicalHomepageUrl.https/>
<data:blog.newerPageUrl.https/>
<data:blog.olderPageUrl.https/>
<data:blog.searchUrl.https/>
<data:label.url.https/>
<data:post.url.https/>
<data:post.href.https/>

Si las encuentras de esta forma expr:href='data:blog.url' lo reemplazas con esto expr:href='data:blog.url.https'. En caso de ser una etiqueta html reemplazas esto <data:blog.url/> por esto <data:blog.url.https/>. La única diferencia de estos cambios es que al final de cada parámetro se agrega uno nuevo el cual es .https.


La cantidad de etiquetas data que necesitas reemplazar depende de la plantilla, este paso es necesario ya que algunos widgets (por ejemplo el buscador) al no tener la url como https, probocará que nuestro blog muestre el mensaje "Esta pagina no es segura".


Search console

Por ultimo nos vamos a dirigir a las herramientas para webmaster de google y vamos a agregar nuestro sitio pero esta vez con https, enviando el respectivo sitemap y listo, ya tenemos configurado https en Blogger.


Otros proveedores

Como existen un montón de empresas que proporcionan nombres de dominio no puedo hacer una guia explicando la forma de cambiar el administrador de dns en cada uno, por ello si logras hacer los cambios, agradecería mucho que dejaras en los comentarios como lo lograste con tu proveedor de dominios


Si te ha servido este aporte no olvides compartirlo, eso me ayudaría mucho. Si tienes alguna duda, déjala en los comentarios, respondo a todos.