Guía Completa: Cloudflare Tunnel para WordPress Local

¿Qué es Cloudflare Tunnel?

Permite exponer tu sitio local (localhost) a internet de forma segura sin abrir puertos en tu router. Totalmente GRATIS y sin límites.

Requisitos Previos

WordPress funcionando en local (LocalWP, XAMPP, MAMP, etc.)
Cuenta gratuita en Cloudflare
Tu propio dominio (opcional, pero recomendado para aspecto profesional)

Método 1: Cloudflare Tunnel con CLI (Recomendado)

Paso 1: Instalar cloudflared

Windows:

# Descarga desde: https://github.com/cloudflare/cloudflared/releases
# O usa winget:
winget install cloudflare.cloudflared

macOS:

brew install cloudflared

Linux:

wget https://github.com/cloudflare/cloudflared/releases/latest/download/cloudflared-linux-amd64.deb
sudo dpkg -i cloudflared-linux-amd64.deb

Paso 2: Autenticarse en Cloudflare

cloudflared tunnel login

Esto abrirá tu navegador para autorizar. Selecciona el dominio que quieres usar.

Paso 3: Crear un Tunnel

cloudflared tunnel create mi-wordpress-demo

Guarda el Tunnel ID que te devuelve.

Paso 4: Configurar el Tunnel

Crea un archivo de configuración en:

Windows: C:\Users\TuUsuario\.cloudflared\config.yml
macOS/Linux: ~/.cloudflared/config.yml

tunnel: TU-TUNNEL-ID
credentials-file: /ruta/a/.cloudflared/TU-TUNNEL-ID.json

ingress:
  - hostname: demo.tudominio.com
    service: http://localhost:8080
  - service: http_status:404

Importante: Cambia:

TU-TUNNEL-ID por el ID que obtuviste
demo.tudominio.com por tu subdominio
localhost:8080 por el puerto de tu WordPress local

Paso 5: Configurar DNS en Cloudflare

cloudflared tunnel route dns mi-wordpress-demo demo.tudominio.com

Paso 6: Ejecutar el Tunnel

cloudflared tunnel run mi-wordpress-demo

¡Listo! Tu sitio local ahora es accesible en https://demo.tudominio.com

Método 2: Cloudflare Tunnel sin dominio propio (Más rápido)

Si no tienes dominio, puedes usar un subdominio temporal de Cloudflare:

cloudflared tunnel --url http://localhost:8080

Esto te dará una URL temporal como:

https://random-words-123.trycloudflare.com

Ventajas:

No necesitas dominio
Instantáneo

Desventajas:

URL aleatoria cada vez
Menos profesional

Método 3: Cloudflare Zero Trust Dashboard (Interfaz gráfica)

Paso 1: Acceder al Dashboard

Ve a https://one.dash.cloudflare.com
Registra tu cuenta gratuita
Ve a Access → Tunnels

Paso 2: Crear Tunnel desde la Web

Click en "Create a tunnel"
Dale un nombre: wordpress-demos
Sigue las instrucciones para instalar el conector

Paso 3: Configurar la Ruta Pública

En Public Hostname, añade:
- Subdomain: demo
- Domain: tudominio.com
- Service Type: HTTP
- URL: localhost:8080
Guarda

Encontrar el Puerto de tu WordPress Local

LocalWP:

Click derecho en tu sitio → Open Site Shell
El puerto suele ser visible en la URL del sitio

XAMPP:

Puerto por defecto: 80 o 8080
URL: http://localhost o http://localhost:8080

MAMP:

Preferencias → Ports
Normalmente: 8888

Configurar WordPress para la Nueva URL

Opción 1: Desde wp-config.php

Añade estas líneas en wp-config.php (antes de "¡Eso es todo, deja de editar!"):

define('WP_HOME', 'https://demo.tudominio.com');
define('WP_SITEURL', 'https://demo.tudominio.com');

Opción 2: Desde la base de datos

Usando phpMyAdmin o Adminer:

UPDATE wp_options 
SET option_value = 'https://demo.tudominio.com' 
WHERE option_name IN ('siteurl', 'home');

Opción 3: Plugin (más fácil)

Instala el plugin "Better Search Replace":

Busca: http://localhost:8080
Reemplaza: https://demo.tudominio.com
Selecciona todas las tablas
Ejecuta

Comandos Útiles

Ver tunnels activos:

cloudflared tunnel list

Eliminar un tunnel:

cloudflared tunnel delete mi-wordpress-demo

Ver información de un tunnel:

cloudflared tunnel info mi-wordpress-demo

Ejecutar en background (Linux/Mac):

cloudflared tunnel run mi-wordpress-demo &

Flujo de Trabajo con Clientes

Para cada nuevo cliente:

Crea el sitio en LocalWP Sitio: cliente-acme URL local: http://localhost:10005
Inicia el tunnel temporal cloudflared tunnel --url http://localhost:10005
Envía la URL al cliente https://abc-def-123.trycloudflare.com
Cuando termine la demo, cierra el tunnel Ctrl + C en la terminal

Para demos profesionales con dominio:

Configura subdominios permanentes:

cliente1.demos.tudominio.com
cliente2.demos.tudominio.com
cliente3.demos.tudominio.com

Cambia el puerto en config.yml según el sitio que quieras mostrar.

Ventajas de Cloudflare Tunnel

✅ Completamente gratuito
✅ HTTPS automático
✅ No necesitas abrir puertos
✅ Funciona detrás de cualquier firewall
✅ Sin límite de ancho de banda
✅ Protección DDoS incluida
✅ Puedes usar tu propio dominio

Solución de Problemas

El sitio se ve sin estilos:

Verifica que WordPress tenga la URL correcta configurada
Usa Better Search Replace para actualizar todas las URLs

Error "Too many redirects":

Desactiva plugins de SSL/HTTPS
Añade en wp-config.php:

$_SERVER['HTTPS'] = 'on';

El tunnel se desconecta:

Ejecuta como servicio en background
En Windows, usa NSSM para crear un servicio

Puerto incorrecto:

Verifica el puerto exacto de tu WordPress local
En LocalWP: Click derecho → Site Info

Alternativa: Ejecutar como Servicio

Windows (usando NSSM):

nssm install cloudflared-tunnel cloudflared tunnel run mi-wordpress-demo
nssm start cloudflared-tunnel

Linux (systemd):

sudo cloudflared service install
sudo systemctl start cloudflared
sudo systemctl enable cloudflared

Recursos

Documentación oficial: https://developers.cloudflare.com/cloudflare-one/connections/connect-apps/
Descargas: https://github.com/cloudflare/cloudflared/releases
Dashboard: https://one.dash.cloudflare.com

Resumen Rápido

Para pruebas rápidas:

cloudflared tunnel --url http://localhost:PUERTO

Para configuración profesional:

Instala cloudflared
cloudflared tunnel login
cloudflared tunnel create nombre
Configura config.yml
cloudflared tunnel run nombre

¡Así de fácil! Tu WordPress local ahora es accesible desde cualquier parte del mundo.

Buscador