miércoles, 27 de julio de 2016

Convertir nuestro blog de Blogger bajo HTTP en HTTPS y eliminar advertencias de contenido mixto

Este día me ha dado a la tarea de actualizar el sitio luego de algún tiempo de negligencia y hasta ahora me di cuenta que Blogger ofrece la posibilidad de hacer un upgrade de la conexión a HTTPS, lo que me puede traer muchos beneficios ante Google y otros sitios web.

Todos puede hacer este proceso, pero el problema llega cuando al hacer la conversión aparece una advertencia de que la conexión no es segura.

Si tratas de modificar la plantilla, aparecerá la siguiente advertencia:

La edición de la plantilla de manera que combine HTTP y HTTPS puede afectar la seguridad y la experiencia del usuario en tu blog cuando este se ve a través de una conexión HTTPS. 

Antes de ver el problema vamos a ver como hacemos la conversión.

Como convertir un blog HTTP a HTTPS
1. Vamos a Configuración - Básica:
2. En HTTPS cambiamos la casilla de No a Sí.
No sé cuanto tiempo tardará la redirección en los buscadores de Google, no debería existir un cambio perceptible de forma negativa en el cambio a HTTPS.

El resultado del cambio
Para el caso de Firefox, habrá tres íconos para advertir de una conexión insegura en la barra de direcciones, si no usamos HTTPS aparecerá un candado gris y una raya roja, el candado gris y verde con una advertencia dependiendo de la seguridad de tu web, el candado verde es de un sitio verificado, pero la advertencia anuncia contenido inseguro de clase HTTP, por ejemplo: Un script o una imagen con una dirección que empieza en HTTPS, si es gris el candado, hay un elemento dentro de la página inseguro, además de que no es una conexión segura.
El objetivo es que aparezca un candado verde sin ninguna advertencia:
Para lograrlo tenemos que seguir los siguientes pasos:

1. Vamos a Plantilla - Editar HTML:
2. Damos clic dentro de la caja de código y pulsamos las teclas CTRL+F para abrir la casilla de búsqueda de código (Esto lo hago desde Firefox), dentro de la casilla escribimos "http:" sin las comillas y pulsamos Entrar:
3. Cada que pulsemos la tecla Entrar nos llevará a un elemento de texto con un fragmento "HTTP:", así que primero deberemos reemplazar los elementos HTTP:  por HTTPS cuando sean imágenes y vínculos a páginas alojadas en Blogger y/o Google, porque automáticamente se transformaran en HTTPS, por ejemplo, el caso de fuentes:
Y lo cambiamos a:
Para una imagen almacenada en Blogger/Picasa/Google Photos:
Y lo cambiamos a:
Así lo hacemos con cualquier dirección dentro de la plantilla que apunte a un servidor de Google.
Advertencia, no use esto dentro de <!DOCTYPE> o las direcciones dentro de la etiqueta <html>.

Archivos de Javascripts
La parte más complicada es que no todos los scripts en nuestras plantillas estarán almacenadas en un servidor con soporte HTTPS, la manera de comprobar esto es por ejemplo; En la dirección http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js si la copiamos y pegamos en la barra de direcciones veremos que funcionará tanto en https como en http. Así que cambiarla a https://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js no dará ningún problema.

Sin embargo, si no es posible obtener un archivo Javascript en un servidor HTTPS (Usa Google Drive) tendrán que retirar el script o insertarlo en el código fuente.

La manera de insertar javascript dentro de cualquier sección entre <head> y </head> es usar CDATA para que la API de Blogger no detecte la ejecución en plantilla:
<script type='text/javascript'>
  //<![CDATA[
Contenido del script.
  //]]>
</script>
Si utiliza el script de ShareThis, debe ir a la página web de Sharethis y tomar nuevamente el complemento que tiene la opción de HTTPS remover el viejo, insertar //<![CDATA[ y //]]>.
Una vez actualicemos todos estas direcciones pulsamo en Guardad Plantilla:
Actualizar Gadgets
Los Gadgets contienen Scripts, enlaces e imágenes que están fuera de la plantilla, si bien no es necesario actualizar los enlaces o vínculos, por fuerza deben modificar, actualizar o remover cualquier Script o imagen que no estén almacenados en una dirección https.

1. Vamos a Diseño y vamos a modificar todos los complementos con scripts e imágenes bajo https, si no hay alternativa y son de terceros, es mejor eliminar cualquier Script que no esté almacenado en una dirección HTTPS:
2. Pulsamos en Editar en el Gadget que sea de HTML/Javascript y de Texto, que son donde podemos meter contenido propio:
3. Como vemos aquí, el cambio no toma mucho y podemos fácilmente hacer que nuestro sitio sea seguro, una vez terminamos pulsamos en Guardar.
Si ustedes tienen servicios de contadores de visitas como Statcounter, les recomiendo sacar una versión actualizada del Script, si no, deberán eliminar el contador o la advertencia de seguridad seguirá activa.

Recuerden que en los Gadgets no es necesario usar CDATA para envolver el Script.

El resultado
Deberemos ver el candado verde sin advertencias en la barra de direcciones y esto debe comprobarse en los tres navegadores (Edge, Chrome y Firefox).
Al navegar por el sitio no deberán aparecer más advertencias, en ese momento su sitio será un sitio HTTPS seguro y certificado por Google Inc.

Comentarios y Consultas

Los mensajes serán revisados a veces. No te olvides que soy una persona, no se trata de faltar al respeto, todos tenemos opiniones, no hay que enojarse.

Puedes marcar Notificarme para recibir la notificación de la respuesta.

El ascenso de Skywalker(2019)

Joker 2019Una película que ha roto a divido a los fans muchos culparán a sus director por querer reparar Los últimos Jedi, no es su culpa al final.

[Leer artículo...]

La Espada del Inmortal (2019

Blade of The Immortal (2019)La historia de Manji, un guerrero samurái sin señor que ha sido condenado con la inmortalidad...

[Leer artículo...]

Kemono Michi: Rise Up (2019)

Kemono Michi: Rise Up (2019)Del autor de Konosuba, Genzo Shibata es un luchador japonés que es transportado a un mundo de fantasía, quien está obsesionado con los seres peludos.

[Leer artículo...]

ELI (2019)de Netflix

ELI (2019)de Netflix Reseña y criticaPelícula lanzada directo a video que nos cuenta una historia que parecería sacada de la Dimensión desconocida.

[Leer artículo...]

  © Cgnauta | CGsign blog | [Ver Licencia de uso] | Matius Lenin, Creative Commons, algunos derechos reservados

Regresar ARRIBA  

Vistas desde Mayo 2009

▼/▲ Archivo del Blog

Visitas totales

Información

IBSN: Internet Blog Serial Number 01-77-94-2008

Esta plantilla es creada y diseñada por Matius Lenin para CGnauta blog. Con Scripts de JQuery bajo licencia GNU/GPL. CGnauta es una marca registrada propiedad de Matius Lenin.