WordPress

CDN gratuita de Cloudflare en WordPress: cómo usarla

Jefferson Maldonado
Por Jefferson Maldonado 30 Ago 2022 6 min de lectura 4 comentarios

En este videotutorial prémium te enseñaremos a usar la CDN gratuita de Cloudflare en WordPress y como aplicarlo para Divi. Cloudflare es un servicio de CDN (Content Delivery Network) que se integra de una forma sencilla con nuestro sitio web, y permite crear una capa de seguridad en nuestro sitio, además de que también aumenta la velocidad del mismo.

Una de las recomendaciones que dimos en nuestro curso de Optimización de Velocidad en Divi fue implementar un sistema de CDN para nuestro sitio en WordPress, pues esta tecnología optimiza la entrega de los archivos de nuestro sitio web a los visitantes, lo que hace que nuestro sitio web cargue más rápido.

En este tutorial exploraremos:

✅ Que es una CDN Cloudflare

✅ Configuraciones iniciales

✅ Integrar la CDN en nuestro dominio

✅ Cambio de las DNS

✅ Comprobación de cambios y estadísticas

Ejemplos de CDN integrada en el ejemplo:

¿Qué hace Cloudflare por tu sitio WordPress?

Cloudflare es la única CDN gratuita real que existe a nivel global, y a la vez funciona como proxy inverso: todo el tráfico de tus visitantes pasa primero por la red de Cloudflare antes de llegar a tu servidor. Eso te da tres cosas en una sola integración:

  • CDN: tus archivos estáticos (CSS, JS, imágenes) se sirven desde el datacenter más cercano al visitante, no desde tu servidor.
  • Firewall y seguridad: Cloudflare bloquea bots, ataques y tráfico sospechoso antes de que toquen tu hosting — eso reduce consumo de recursos.
  • SSL gratuito: certificado válido en minutos, incluso si tu hosting no incluye uno propio.

Para que tengas una idea del impacto real: en un sitio de tráfico medio, Cloudflare suele servir entre el 70% y el 80% del ancho de banda total sin que toque tu servidor. Eso significa hosting más estable, menos saturación y mejores tiempos de carga.

Pasos para conectar Cloudflare con WordPress

El proceso de alta es sencillo si lo haces en el orden correcto. Acá los pasos resumidos para que puedas seguir el video sin perderte:

  1. Crea tu cuenta gratuita en Cloudflare en cloudflare.com y agrega tu dominio. Cloudflare escanea automáticamente todos los registros DNS existentes.
  2. Verifica los registros DNS detectados. Asegúrate de que estén el A (apuntando a la IP de tu hosting), el CNAME de www, los MX de email y cualquier subdominio (como FTP o webmail). Activa el ícono de la nube naranja en los registros que quieres que pasen por la CDN.
  3. Cambia los nameservers en tu registrador de dominio. Cloudflare te entrega 2 nameservers nuevos. Tienes que actualizar los DNS en el panel donde compraste tu dominio (Hostinger, Namecheap, GoDaddy, etc.). La propagación tarda entre 5 minutos y 24 horas.
  4. Configura el modo SSL. En "SSL/TLS" elige Full (Strict) si tu hosting ya tiene un certificado SSL propio (lo más recomendado), o Flexible si tu hosting no incluye SSL. Nunca dejes Off en producción.
  5. Activa "Always Use HTTPS". En "SSL/TLS → Edge Certificates" fuerzas que cualquier visita HTTP redirija automáticamente a HTTPS.
  6. Verifica que todo carga bien. Abre tu sitio en una ventana incógnito, revisa el candado de SSL y haz un test en GTmetrix para confirmar que la CDN está sirviendo los assets.

Si algo se rompe (sitio no carga, error de SSL, redirect loop), activa el Modo Desarrollo en Cloudflare — desactiva la caché temporalmente por 3 horas mientras diagnosticas.

Configuraciones que SÍ debes activar (y las que NO)

Cloudflare tiene cientos de opciones y la mayoría no las necesitas. Estas son las que mueven la aguja en un sitio WordPress estándar:

  • SSL/TLS Full (Strict) — cifra ambos tramos (visitante↔Cloudflare y Cloudflare↔hosting) y exige que el certificado del servidor sea válido. Es el modo más seguro.
  • Always Use HTTPS — fuerza el redirect 301 de HTTP a HTTPS sin tener que tocar el .htaccess.
  • Auto Minify (CSS y JS) — minifica los archivos al servirlos. No toques HTML para evitar conflictos con Divi.
  • Browser Cache TTL — ponlo en 4 horas o más para que los visitantes recurrentes reusen los assets cacheados.
  • Brotli — compresión moderna, mejor que gzip. Activado por defecto en cuentas gratuitas, verifícalo.
  • Rocket Loader — promete cargar JS asíncrono pero rompe muchos plugins de WordPress. Déjalo desactivado y maneja la optimización JS desde un plugin específico.
  • Apps marketplace — no instales analytics o herramientas vía Cloudflare Apps. Si quieres desactivar la CDN algún día, pierdes esa configuración.

Si quieres ir más allá con reglas de caché y exclusiones (por ejemplo, evitar que /wp-admin se cachee), usa Page Rules. La cuenta gratuita te da 3 reglas — para WordPress te conviene gastar las tres en: forzar HTTPS, omitir caché en wp-admin/wp-login, y omitir caché en el carrito de WooCommerce si tienes tienda.

Cuándo Cloudflare NO es la mejor opción

La CDN gratuita de Cloudflare cubre el 95% de los casos de WordPress, pero hay escenarios donde conviene mirar otras alternativas:

  • Subes archivos pesados (videos, ZIPs > 100 MB): la cuenta gratuita limita el tamaño de upload a 100 MB. Para alojamiento de video propio, Bunny.net es mucho mejor opción, y para video como tal puedes usar Bunny Stream como alternativa a Vimeo.
  • Tu hosting ya incluye una CDN integrada (algunos planes managed de WordPress sí lo hacen). En ese caso, sumar Cloudflare encima puede generar conflictos de caché.
  • Tienes un sitio multi-región con DNS custom muy elaborado: Cloudflare gratuito permite gestionar DNS pero las reglas avanzadas (load balancing, geo-routing) están en planes pagos.

Preguntas frecuentes

¿Cloudflare gratuito tiene algún límite real para WordPress?

Para sitios WordPress típicos (blog, portfolio, tienda chica) el plan gratuito no tiene límites prácticos. Las restricciones reales aparecen si necesitas reglas avanzadas (más de 3 page rules), uploads > 100 MB, o features pro como Image Resizing y Argo.

¿Puedo usar Cloudflare con un sitio de Divi sin que se rompa nada?

Sí, pero sigue dos reglas: (1) no actives Rocket Loader porque rompe el constructor visual de Divi, y (2) cuando estés editando el sitio activa el Modo Desarrollo de Cloudflare para que los cambios se vean al instante sin lidiar con caché. Si vas a actualizar a Divi 5, primero revisa nuestra guía para migrar de Divi 4 a Divi 5.

¿Necesito desinstalar mi plugin de caché si pongo Cloudflare?

No. Cloudflare cachea a nivel de red (entre el visitante y tu sitio); tu plugin de caché (WP Rocket, LiteSpeed Cache, etc.) cachea a nivel de servidor. Trabajan en capas distintas y se complementan. La mayoría de plugins serios traen integración nativa con Cloudflare para purgar caché automáticamente.

¿Cómo verifico si Cloudflare realmente está sirviendo mi sitio?

Abre las DevTools del navegador (F12), pestaña Network, recarga la página y mira el header cf-cache-status en cualquier respuesta. Si dice HIT está cacheado por Cloudflare, si dice DYNAMIC pasó al origen sin cachear, y si dice MISS es la primera carga.

¿Cloudflare protege contra ataques DDoS también en el plan gratuito?

Sí. La protección DDoS básica está incluida en todos los planes — incluido el gratuito. Para ataques sofisticados o sitios de alto tráfico conviene mirar el plan Pro o Business, pero para WordPress común el gratuito ya filtra el ruido habitual.

¿Listo para acelerar tu sitio?

Cloudflare es uno de los pasos esenciales en cualquier optimización seria de WordPress, pero no es el único. Si quieres llevar la velocidad de tu sitio al siguiente nivel — combinando CDN, plugin de caché, optimización de imágenes y configuración de hosting — mira nuestro curso de Optimización de Velocidad con Divi: te enseña a dejar tu sitio en GTmetrix Grade A sin que se rompa nada. Y para llevar el SEO de tu sitio al siguiente nivel después de optimizar velocidad, complementa con el curso de SEO profesional para WordPress.

Y si todavía no sos prémium en UXDivi, debajo te espera el video tutorial avanzado donde se ven todas las configuraciones detalladas de Cloudflare paso a paso. Hacete prémium acá y desbloqueá el tutorial completo + cientos de recursos descargables.

Video de configuración avanzada de Cloudflare 👇 (Logueate para verlo)

// ¿Te sirvió este tutorial?

Imagina lo que aprenderás
con los cursos completos

En UXDivi llevamos los tutoriales del blog al siguiente nivel: proyectos reales de principio a fin, recursos descargables y soporte directo conmigo. Todo por menos del costo de un curso individual en otra plataforma.

+50 cursos +1116 alumnos 4.7 en Trustpilot Garantía 7 días
Jefferson Maldonado
// Escrito por

Jefferson Maldonado

UX Director · Founder UXDivi, MUX Studio y UXDivi Templates

UX Director | fundador de UXDivi y MUX Studio

Comentarios

4 comentarios

Para dejar un comentario, accede a tu cuenta de UXDivi.

Acceder a mi cuenta
Miriam J Ortega Miembro Hace 3 años

¿Dónde encuentro el enlace para ver la configuración más a detalle de Cloudflare?
Gracias

Jefferson M Autor Hace 3 años

Que tal Miriam, esto aún no se ha grabado, está pendiente para publicación hasta el 2024. Saludos.

Miriam J Ortega Miembro Hace 3 años

Es que comentaste que dejarías la liga de un video de YouTube, y es esa liga la que no encuentro en la descripción

Jefferson M Autor Hace 3 años

Tienes razón Miriam, este es el video: https://www.youtube.com/watch?v=aGvFmqvogn0