Esta receta muestra cómo usar Contenido Flexible para dar a los gestores de contenido el poder de construir páginas de aterrizaje personalizadas eligiendo, ordenando y completando secciones pre-diseñadas.
Paso 1: Crear el Grupo de Campos de Contenido Flexible
- Ve a Field Forge > Nuevo Grupo de Campos
- Titúlalo Constructor de Páginas de Aterrizaje
- Añade un campo de Contenido Flexible (PRO) etiquetado como Secciones de Página con nombre
page_sections
- Establece la Etiqueta del Botón en Añadir Sección (esto personaliza el texto del botón que ven los editores)
Paso 2: Definir los Diseños
Añade los siguientes diseños al campo de Contenido Flexible:
Diseño 1: Sección Hero
| Subcampo | Tipo | Configuración |
|---|
| Título | Texto | Requerido: Sí, Marcador de posición: “Tu título principal aquí” |
| Subtítulo | Área de texto | Filas: 2 |
| Imagen de Fondo | Imagen | Requerido: Sí, Instrucciones: “Usar 1920×1080 mínimo” |
| Texto del Botón | Texto | Predeterminado: “Comenzar” |
| URL del Botón | URL | Requerido: Sí |
| Estilo del Botón | Grupo de Botones | Opciones: Primario, Secundario, Contorno |
| Subcampo | Tipo | Configuración |
|---|
| Título de Sección | Texto | Marcador de posición: “Por qué elegirnos” |
| Subtítulo de Sección | Área de texto | Filas: 2 |
| Características | Repetidor | Subcampos: Icono (Imagen), Título (Texto, Requerido), Descripción (Área de texto) |
| Columnas | Grupo de Botones | Opciones: 2 Columnas, 3 Columnas, 4 Columnas |
| Subcampo | Tipo | Configuración |
|---|
| Título de Sección | Texto | Predeterminado: “Lo que dicen nuestros clientes” |
| Testimonios | Repetidor | Subcampos: Cita (Área de texto, Requerido), Nombre del Autor (Texto), Foto del Autor (Imagen), Empresa (Texto), Calificación (Número, Mín: 1, Máx: 5) |
| Estilo de Visualización | Grupo de Botones | Opciones: Carrusel, Cuadrícula, Apilado |
| Subcampo | Tipo | Configuración |
|---|
| Título | Texto | Requerido: Sí |
| Descripción | Área de texto | Filas: 3 |
| Texto del Botón | Texto | Predeterminado: “Comenzar ahora” |
| URL del Botón | URL | Requerido: Sí |
| Color de Fondo | Selector de Color | Predeterminado: #1a73e8 |
| Color del Texto | Selector de Color | Predeterminado: #ffffff |
| Subcampo | Tipo | Configuración |
|---|
| Título de Sección | Texto | Predeterminado: “Preguntas Frecuentes” |
| Preguntas | Repetidor | Subcampos: Pregunta (Texto, Requerido), Respuesta (Área de texto, Requerido) |
| Estilo de Visualización | Grupo de Botones | Opciones: Acordeón, Dos Columnas, Apilado |
| Subcampo | Tipo | Configuración |
|---|
| Título de Sección | Texto | Predeterminado: “Elige tu plan” |
| Planes | Repetidor | Subcampos: Nombre del Plan (Texto, Requerido), Precio (Texto), Periodo de Facturación (Seleccionar: Mensual/Anual), Características (Área de texto), Texto del Botón (Texto), URL del Botón (URL), Destacado (Verdadero/Falso) |
| Mostrar Alternar | Verdadero/Falso | Etiqueta: “Mostrar alternar mensual/anual” |
Paso 3: Establecer Reglas de Ubicación
- Establecer: La Plantilla de Página es igual a Página de Aterrizaje (necesitas una plantilla de Página de Aterrizaje en tu tema)
- Alternativamente, dirige a una página o tipo de publicación específico
- Guarda el grupo de campos
Paso 4: Cómo los Gestores de Contenido Construyen una Página de Aterrizaje
- Crea una nueva Página y selecciona la plantilla “Página de Aterrizaje”
- Desplázate hasta el metabox “Constructor de Páginas de Aterrizaje”
- Haz clic en Añadir Sección y elige Sección Hero
- Introduce el título, subtítulo, sube una imagen de fondo y establece el texto y enlace del botón
- Haz clic en Añadir Sección de nuevo, elige Cuadrícula de Características
- Añade un título de sección y crea elementos de características con iconos, títulos y descripciones
- Elige el número de columnas (3 es el más común)
- Continúa añadiendo secciones: Testimonios, Tabla de Precios, Sección de Preguntas Frecuentes, Llamada a la Acción
- Arrastra secciones para reordenar — típicamente: Hero en la parte superior, CTA en la parte inferior, contenido de apoyo en medio
- Haz clic en Publicar o Actualizar
Consejos para Páginas de Aterrizaje Efectivas
- Comienza con un Hero: Cada página de aterrizaje debe comenzar con un título claro y un fuerte botón de llamada a la acción
- Limita a 4-6 secciones: Demasiadas secciones crean una página larga y poco enfocada. Cada sección debe tener un propósito
- Prueba social temprano: Coloca Testimonios o una sección de estadísticas cerca de la parte superior para generar confianza antes de pedir una acción
- Una CTA principal: La página debe guiar a los visitantes hacia una única acción principal. Usa la misma URL de botón en las secciones Hero y CTA
- Termina con una CTA: Siempre cierra la página con una sección de Llamada a la Acción para que los visitantes que han desplazado toda la página tengan un siguiente paso claro
- Prueba en móvil: Pide a tu desarrollador que verifique que el diseño se vea bien en teléfonos. La mayoría del tráfico de páginas de aterrizaje proviene de dispositivos móviles
—