Ya sabemos que Cloudfare ofrece el certificado gratuito Flexible SSL, y vamos a ver cómo instalarlo en un sitio WordPress.


 
Importante recordar lo que comentamos siempre: Realiza una backup de tu sitio web antes de realizar cambios.

 

 

 

Primero hemos de instalar en nuestro sitio WordPress, el plugin  CloudFlare Flexible SSL :

cloudfare-flexible-ssl-plugin

   

 

PASOS A REALIZAR PARA CONSEGUIR ACTIVAR CLOUDFARE FLEXIBLE SSL EN WORDPRESS

Hemos de realizar estos pasos en orden:

 
 
  • no cambiar la url del sitio en WordPress en ningún momento (opción disponible en el menú / Ajustes / Generales)

cambiar-url-sitio-wordpress

 

 

  • Entramos en Cloudfare y añadimos una regla de página al estilo: *midominio.com* .
    Con la configuración: Usar HTTPS  Siempre   ON (Always use HTTPS y Enforce HTTPS for this URL)

regla-de-pagina-cloudfare-page-rule-https-on

 

 

  • Posteriormente activamos Flexible SSL en Cloudfare (Disponible en la sección “Crypto“)

 

activar-flexible-ssl-cloudfare

 

 

COMPROBACIÓN DE LA ACTIVACIÓN DE CLOUDFARE FLEXIBLE SSL WORDPRESS

 

  • Ahora hemos de comprobar primero que la web WordPress sigue funcionando de forma correcta, y que se ha activado el protocolo https (antes accedíamos por http, y ahora debe ser https).

 

  • Accedemos entonces a nuestro sitio web y comprobamos si aparece el candado verde que indica que la página utiliza un certificado de seguridad y está correctamente instalado. Pero puede ser que ocurra lo siguiente, y es que la navegación funcione por https pero no aparezca el candado (eso quiere decir que el certificado no está correctamente instalado):

 

flexible-ssl-cloudfare-candado-verde-certificado-https-mixed-content

 

 

¿POR QUÉ NO APARECE EL CANDADO VERDE QUE INDICA QUE LA WEB TIENE INSTALADO CERTIFICADO SSL?


 
** Si no aparece el candado verde es porque tenemos mixed content (contenido mixto), es decir, algunos elementos de la página son HTTP, y otros HTTPS, y TODOS los elementos deberían mostrarse a través de HTTPS ahora que hemos activado el certificado Flexible SSL de Cloudfare.
 

 

SOLUCIÓN AL ERROR: NO SE MUESTRA CANDADO VERDE CERTIFICADO SSL

 

Utilizaremos el inspector de código de Google Chrome o Firefox, y podremos comprobar si tenemos Mixed Content (algunos contenidos son servidos por http y otros contenidos son servidos por https). En el Inspector de código de Chrome , en la pestaña Security, veremos si tenemos todavía contenido mixto:
 

el-sitio-incluye-recursos-http-mixed-content
 

 
Como vemos en la anterior captura de pantalla, veremos el error:

Mixed Content

The site includes HTTP resources

View requests in Network Panel

 

Y si investigamos más a fondo en la pestaña “Console“, veremos todos los errores referentes a contenido mixto.

error-certificado-ssl-mixed-content-inspector-google-chrome

 

 

SOLUCIÓN AL PROBLEMA DE CONTENIDO MIXTO O MIXED CONTENT (Contenidos HTTP y HTTPS)

–> La solución a los contenidos servidos por HTTP es, simplemente, corregirlos.
–> Han de servirse todos a través de HTTPS.

Algunos de esos contenidos servidos por HTTP los corregiremos de forma manual:

  • Algunos elementos de Mixed content podemos modificarlos en bruto desde la base de datos.
    • Realizamos una búsqueda en la base de datos buscando http:// y cambiamos los resultados obtenidos por https.

     

  • O desde /wp-admin/options.php.
    • Lo mismo, buscamos referencias a HTTP:// y las cambiamos por HTTPS://

 

 

CASOS ESPECIALES Y PROBLEMAS CONOCIDOS AL INSTALAR FLEXIBLE SSL EN WORDPRESS


 
**** CUIDADO CON el plugin SHAREAHOLIC para wordpress: En la SECCIÓN ANALYTICS, hemos de DESACTIVAR COOKIES DE TERCEROS (Shareaholic):

(SI NO LAS DESACTIVAMOS, SE INYECTA UN IFRAME HTTP QUE GENERA CONTENIDO MIXTO).

Podemos desactivar las Cookies de terceros en Shareaholic en la sección: My Sites/ Site Tools /Analytics /

flexible-ssl-shareaholics-analytics-third-party-data-services

 

 

AYUDA EXTRA Y TRUCOS PARA RETOCAR .HTACCESS Y WP-CONFIG.PHP (si fuera necesario) PARA ADAPTAR EL SITIO A FLEXIBLE SSL DE CLOUDFARE

También puede ser necesario añadir reglas en el archivo .htaccess y en el archivo wp-config.php:
 

RETOQUES EN .HTACCESS PARA EL USO DE SSL:

 

 

RETOQUES EN WP-CONFIG.PHP PARA EL USO DE SSL:

 

 

Y si has realizado todos los pasos correctamente, ya podrás disfrutar de tu certificado Cloudfare Flexible SSL en WordPress


 
cloudfare-flexible-ssl-wordpress-certificado-activado

 


Etiquetas del articulo: , , , ,


Centro de preferencias de privacidad

Cookies imprescindibles

Se usan para saber si ya aceptaste nuestras políticas y para servir más rápidos los contenidos.

gpdr,wpSGCacheBypass

Cookies de terceros

Usamos cookies de terceros en las que se almacenan externamente para conocer tus usos de navegación, si ya estás suscrito al boletín y los elementos compartidos en redes sociales.

1P_JAR, AID, DSID, IDE, NID, JCS_INENREF, JCS_INENTIM, __cfduid, _ga, _gat, _gat_gtag_UA_16843793_11, _gid,_wpss_h_, _wpss_p_, gadwp_wg_default_dimension, gadwp_wg_default_metric, gadwp_wg_default_swmetric