Cómo Trabajar con Páginas en WordPress y Divi: Una Guía Completa Paso a Paso

WordPress impulsa más del 43% de todos los sitios web en internet — y por una buena razón. Su interfaz intuitiva, su vasto ecosistema de plugins y sus flexibles capacidades de gestión de contenido lo convierten en el CMS preferido para todos, desde bloggers independientes hasta empresas de nivel empresarial. Cuando combinas WordPress con el tema Divi de Elegant Themes, desbloqueas un constructor visual de arrastrar y soltar que te permite diseñar páginas impresionantes y profesionales sin escribir una sola línea de código.

En esta guía completa, aprenderás exactamente cómo crear, personalizar, organizar y publicar páginas en WordPress usando Divi Builder. Ya sea que estés construyendo tu primer sitio web o refinando uno existente, este tutorial cubre todo lo que necesitas saber.

¿Qué son las páginas en WordPress? (Y cómo difieren de los posts)

Antes de profundizar en los pasos técnicos, es importante entender qué es realmente una página de WordPress — y cómo difiere de una publicación de blog.

Las páginas son la columna vertebral estructural de tu sitio web. Contienen contenido que no cambia frecuentemente y no necesita ser categorizado o etiquetado. Piensa en tu Acerca de nosotros, Contacto, Servicios, o Página de inicio — estos son todos ejemplos clásicos de páginas de WordPress.

Entender esta distinción te ayuda a tomar decisiones más inteligentes sobre cómo organizar y presentar tu contenido.

Requisitos previos: Lo que necesitas antes de comenzar

Para seguir esta guía, asegúrate de tener lo siguiente en su lugar:

• Una instalación de WordPress en vivo en un entorno de alojamiento confiable
• El tema Divi instalado y activado (disponible en Elegant Themes)
• Acceso de administrador a tu panel de control de WordPress
• Una comprensión básica de la estructura y los objetivos de tu sitio web

Si aún estás configurando tu entorno de alojamiento, considera Alojamiento VPS de AlexHost — una solución de alto rendimiento y escalable que te proporciona acceso root completo, recursos dedicados y la flexibilidad para ejecutar WordPress a velocidad óptima. Para proyectos más pequeños o sitios personales, Alojamiento Web Compartido es una alternativa asequible y fácil para principiantes que es totalmente compatible con WordPress.

Paso 1: Inicia sesión en tu panel de WordPress

Comienza abriendo tu navegador web preferido y navegando a tu panel de administración de WordPress. La URL predeterminada es:

http://yourdomain.com/wp-admin

Ingresa tu nombre de usuario y contraseña, luego haz clic en Iniciar sesión. Llegarás al Panel de WordPress — el panel de control central de todo tu sitio web.

> Consejo profesional: Si estás administrando múltiples sitios de WordPress o necesitas una experiencia de administración más simplificada, considera usar un VPS con cPanel para la gestión centralizada del servidor y del sitio desde una única interfaz intuitiva.

Paso 2: Crear una Nueva Página de WordPress

Una vez que estés dentro del panel de control, sigue estos pasos para crear una nueva página:

1. En el menú de navegación de la izquierda, localiza y haz clic en Páginas
2. Haz clic en Añadir nueva en la parte superior de la lista de Páginas (o usa el atajo + Nueva > Página en la barra de administración superior)
3. Serás llevado al editor de bloques de WordPress (Gutenberg)

Añadir un Título y Contenido Básico

• Haz clic en el campo "Añadir título" en la parte superior y escribe el nombre de tu página (p. ej., *Acerca de Nosotros*, *Contacto*, *Servicios*)
• En el área de contenido de abajo, puedes añadir bloques de texto, imágenes, encabezados, botones y otros elementos usando el editor de bloques Gutenberg
• Usa el atajo "/" en el editor para buscar rápidamente e insertar cualquier tipo de bloque

En esta etapa, estás trabajando con el editor estándar de WordPress. Sin embargo, si deseas personalización visual avanzada — y estás usando Divi — querrás activar el Divi Builder en el siguiente paso.

Paso 3: Activar y usar el Divi Builder

El Divi Builder transforma el editor estándar de WordPress en un potente entorno de diseño visual de arrastrar y soltar. Así es como habilitarlo y usarlo:

Habilitación del Divi Builder

Después de abrir tu página en el editor, verás un botón prominente cerca de la parte superior del área de contenido:

“Enable Divi Builder” — haz clic en él.

WordPress te mostrará tres opciones de inicio:

Selecciona la opción que mejor se adapte a tu proyecto y haz clic en Start Building.

Entender la estructura del Divi Builder

Antes de agregar contenido, es útil entender cómo Divi organiza su jerarquía de diseño:

Section
  └── Row
        └── Column
              └── Module

• Sections son los contenedores más grandes — abarcan el ancho completo de la página
• Rows se encuentran dentro de las secciones y definen la estructura de columnas (1, 2, 3 columnas, etc.)
• Columns son las divisiones verticales individuales dentro de una fila
• Modules son los elementos de contenido reales (texto, imágenes, botones, formularios, etc.)

Paso 3a: Agregar secciones y filas

1. Haz clic en el icono azul “+” en la parte inferior del lienzo para agregar una nueva Section
2. Elige un tipo de sección: Regular, Fullwidth o Specialty
3. Dentro de la sección, haz clic en el icono “+” para agregar una Row
4. Selecciona tu diseño de columnas preferido (por ejemplo, 1/2 + 1/2 para un diseño de dos columnas)

Paso 3b: Agregar módulos

Los módulos son los bloques de construcción de contenido de cada página Divi. Para agregar uno:

1. Haz clic en el icono gris “+” dentro de una columna
2. Aparecerá una biblioteca de módulos — explora o busca el módulo que necesitas
3. Haz clic en el módulo para insertarlo en tu diseño

Los módulos Divi más utilizados incluyen:

• Text Module — para párrafos, encabezados y texto formateado
• Image Module — para fotos, gráficos e ilustraciones
• Button Module — para CTAs y enlaces de navegación
• Slider Module — para carruseles de imágenes hero
• Contact Form Module — para captura de leads e inquietudes
• Blurb Module — para cuadros de características con icono + texto
• Video Module — para contenido de video incrustado
• Testimonial Module — para prueba social y reseñas
• Code Module — para fragmentos personalizados de HTML, CSS o JavaScript

Paso 3c: Personalizar módulos

Haz clic en el icono de lápiz (editar) en cualquier módulo para abrir su panel de configuración. La configuración se organiza en tres pestañas:

1. Pestaña Content

Configura el contenido real del módulo — texto, imágenes, enlaces, etiquetas de botones, campos de formulario, etc.

2. Pestaña Design

Controla la apariencia visual del módulo:

• Typography — familia de fuente, tamaño, peso, altura de línea, espaciado de letras
• Colors — colores de fondo, texto, borde e icono
• Spacing — controles de relleno y margen (con puntos de ruptura responsivos)
• Borders & Shadows — esquinas redondeadas, sombras de caja, estilos de borde
• Sizing — restricciones de ancho, alto y ancho máximo

3. Pestaña Advanced

Accede a configuraciones de nivel de desarrollador:

• CSS Classes and IDs — para ganchos de estilo personalizados
• Custom CSS — escribe CSS específico del módulo directamente
• Visibility — muestra/oculta el módulo en vistas de escritorio, tablet o móvil
• Animations — efectos de animación de entrada y temporización

> Consejo de diseño: Los controles responsivos de Divi te permiten establecer diferentes valores para vistas de escritorio, tablet y móvil. Siempre obtén una vista previa de tu página en los tres puntos de ruptura antes de publicar.

Paso 4: Organiza tus páginas con jerarquías

A medida que tu sitio web crece, mantener las páginas organizadas se vuelve crítico tanto para la experiencia del usuario como para SEO. WordPress admite jerarquías de páginas padre-hijo, que te permiten anidar páginas relacionadas bajo una página padre común.

Crear una relación de página padre-hijo

1. Mientras editas una página, busca la barra lateral derecha en el editor de bloques
2. Haz clic en Página para expandir el panel de configuración de la página
3. Encuentra la sección Atributos de página
4. En Página padre, haz clic en el menú desplegable y selecciona la página que deseas asignar como padre

Ejemplo de jerarquía:

Services (parent)
  ├── Web Design (child)
  ├── SEO Consulting (child)
  └── Content Marketing (child)

Esta estructura crea URLs más limpias (por ejemplo, yoursite.com/services/web-design/) y ayuda a los motores de búsqueda a comprender mejor la arquitectura de contenido de tu sitio.

Paso 5: Agregar Páginas a Tu Menú de Navegación

Crear una página no la agrega automáticamente a la navegación de tu sitio web. Necesitas agregarla manualmente a un menú.

1. En el panel de WordPress, ve a Apariencia > Menús
2. Selecciona un menú existente o haz clic en Crear un Menú Nuevo
3. En el panel Páginas a la izquierda, marca la casilla junto a las páginas que deseas agregar
4. Haz clic en Agregar al Menú
5. Arrastra y suelta elementos del menú para reordenarlos o crear submenús desplegables
6. Haz clic en Guardar Menú cuando termines

> Buena Práctica: Mantén tu menú de navegación principal enfocado en tus páginas más importantes. Apunta a un máximo de 5–7 elementos de nivel superior para evitar abrumar a los visitantes.

Paso 6: Configurar los ajustes de página para SEO y rendimiento

Antes de publicar, dedica un momento a configurar los ajustes clave de la página que afectan tanto la visibilidad en los motores de búsqueda como la experiencia del usuario.

Enlace permanente (URL Slug)

• En la barra lateral del editor de bloques, encuentra la sección Enlace permanente
• Edita el slug de URL para que sea corto, descriptivo y rico en palabras clave
• Evita slugs generados automáticamente con números (p. ej., /?p=123)
• Buen ejemplo: yoursite.com/about-us/
• Mal ejemplo: yoursite.com/?page_id=47

Imagen destacada

• Asigna una imagen destacada relevante para mejorar la apariencia del compartir en redes sociales y la consistencia visual

Plantilla de página

• Algunos temas (incluyendo Divi) ofrecen múltiples plantillas de página (p. ej., ancho completo, sin barra lateral)
• Selecciona la plantilla apropiada en Atributos de página > Plantilla

Metadatos SEO

• Si estás usando un plugin SEO como Yoast SEO o Rank Math, completa:
• Título meta — incluye tu palabra clave principal
• Meta descripción — escribe un resumen convincente de 150–160 caracteres
• Palabra clave de enfoque — establece tu término de búsqueda objetivo

Paso 7: Guarda, Previsualiza y Publica tu Página

Una vez que estés satisfecho con el diseño y la configuración de tu página, es hora de ponerla en vivo.

Opciones de Guardado en Divi Builder

En la esquina superior derecha de la interfaz de Divi Builder, encontrarás:

• Save Draft — guarda tu trabajo sin hacerlo visible públicamente
• Preview — abre una previsualización en vivo de tu página en una pestaña nueva
• Publish/Update — pone la página en vivo en tu sitio web

Publicación desde el Block Editor

Si sales de Divi Builder y vuelves al editor de bloques estándar:

1. Haz clic en Save Draft para guardar sin publicar
2. Haz clic en Preview para revisar cómo se ve la página en el front end
3. Haz clic en Publish cuando estés listo para ponerla en vivo
4. Confirma haciendo clic en Publish nuevamente en el panel de confirmación

> Importante: Siempre previsualiza tu página tanto en escritorio como en dispositivos móviles antes de publicar. Las herramientas de diseño responsivo de Divi son poderosas, pero la revisión manual detecta problemas que las herramientas automatizadas pierden.

Consejos Avanzados: Aprovechar al Máximo WordPress y Divi

Usa el Divi Theme Builder para Plantillas Globales

El Divi Theme Builder (disponible en Divi 4.0+) te permite crear plantillas globales para encabezados, pies de página y tipos de publicaciones/páginas específicas. Esto garantiza consistencia de diseño en todo tu sitio sin necesidad de editar manualmente cada página.

Guarda Diseños en la Divi Library

Si has diseñado una sección o diseño que te encanta, guárdalo en la Divi Library para reutilizarlo en otras páginas. Esto acelera dramáticamente tu flujo de trabajo.

Habilita las Pruebas A/B de Divi (Split Testing)

Divi incluye una herramienta de pruebas divididas integrada que te permite probar diferentes versiones de un módulo, sección o página entre sí para ver cuál funciona mejor — invaluable para la optimización de la tasa de conversión.

Asegura tu Sitio con SSL

Si aún no lo has hecho, asegúrate de que tu sitio WordPress se ejecute en HTTPS. Un certificado SSL es esencial para la confianza del usuario, la seguridad de datos y el posicionamiento en Google. AlexHost ofrece Certificados SSL que son fáciles de instalar y compatibles con todos los entornos de alojamiento WordPress.

Usa un Dominio Personalizado

Un nombre de dominio profesional refuerza tu marca y mejora las tasas de clics en los resultados de búsqueda. Puedes registrar y gestionar tu dominio directamente a través del servicio Registro de Dominios de AlexHost, con soporte para cientos de extensiones TLD.

Solución de problemas comunes

Conclusión

Trabajar con páginas en WordPress usando el tema Divi te proporciona un conjunto de herramientas excepcionalmente potente y flexible para construir sitios web profesionales — sin necesidad de codificación. Siguiendo los pasos de esta guía, puedes:

• Crear páginas de WordPress bien estructuradas con títulos y contenido claros
• Diseñar diseños visualmente atractivos usando el constructor de arrastrar y soltar de Divi
• Organizar tus páginas en jerarquías lógicas para mejor UX y SEO
• Configurar ajustes clave como enlaces permanentes, metadatos y plantillas
• Publicar con confianza después de previsualizar en todos los tipos de dispositivos

La combinación del poder de gestión de contenidos de WordPress y las capacidades de diseño visual de Divi es difícil de superar. Y con la infraestructura de alojamiento adecuada debajo de todo, tu sitio será rápido, seguro y listo para escalar.

Para proyectos de WordPress que requieren muchos recursos, sitios de alto tráfico o aplicaciones que necesitan poder de computación dedicado, explora los Servidores Dedicados de AlexHost — ofreciendo hardware de nivel empresarial, personalización completa del servidor y rendimiento máximo para cargas de trabajo exigentes.

*¿Listo para construir tu próximo proyecto de WordPress? Comienza con una base sólida — elige el alojamiento correcto, instala Divi y sigue esta guía para crear páginas que se vean excelentes y se posicionen aún mejor.*