Ir al contenido

Divi 5: Crear plantillas de archivo e individuales

Esta guía le muestra cómo crear en Divi 5 una plantilla de archivo para la vista de lista de inmuebles y una plantilla individual para la vista de detalle del inmueble. Ambas plantillas utilizan los módulos nativos de WP-ImmoMakler de 1 clic, que en el Divi 5 Visual Builder muestran una vista previa en vivo con datos reales de inmuebles.

La plantilla de archivo controla cómo se muestra la página de resumen de inmuebles, es decir, la página en la que todos los inmuebles aparecen como lista o mosaico.

  1. Abrir el Theme Builder

    Navegue en el backend de su sitio web (wp-admin) a Divi → Theme Builder.

    Divi 5 Theme Builder – Resumen con el botón 'Anadir nueva plantilla'
  2. Crear una nueva plantilla

    Haga clic en + Anadir nueva plantilla y seleccione en el desplegable Crear nueva plantilla.

    Divi 5 Theme Builder – Desplegable con las opciones 'Crear nueva plantilla' y 'Anadir desde la biblioteca'
  3. Configurar la asignación

    El cuadro de diálogo Ajustes de plantilla se abre en la pestaña Usar para. Active las siguientes casillas:

    • En la sección Páginas de archivo: los 7 archivos de taxonomía de inmuebles — Todas las páginas de Equipamiento de inmuebles, Todas las páginas de País de inmuebles, Todas las páginas de Tipo de uso de inmuebles, Todas las páginas de Tipo de inmueble, Todas las páginas de Localidad de inmuebles, Todas las páginas de Estado de inmuebles y Todas las páginas de Tipo de comercialización de inmuebles
    • En la sección Inmuebles: Página de archivo de inmuebles
    Divi 5 Ajustes de plantilla – Seccion 'Paginas de archivo' con los 7 archivos de taxonomia de inmuebles activados Divi 5 Ajustes de plantilla – Seccion 'Inmuebles' con la casilla 'Pagina de archivo de inmuebles' activada

    A continuación, haga clic en Crear plantilla.

  4. Añadir el contenido principal

    La nueva plantilla aparece en el Theme Builder con la etiqueta Página de archivo de inmuebles. Mueva el ratón sobre el área central de la plantilla y haga clic en Anadir cuerpo personalizado. Seleccione en el desplegable Crear cuerpo personalizado.

    Divi 5 Theme Builder – Nueva plantilla 'Pagina de archivo de inmuebles' con el area para el contenido principal Divi 5 – Desplegable con 'Crear cuerpo personalizado' y 'Anadir desde la biblioteca'
  5. Añadir una fila

    El Visual Builder se abre. Haga clic en Anadir fila y seleccione el diseño de una columna.

    Divi 5 Visual Builder – Lienzo vacio con el boton 'Anadir fila' Divi 5 – Seleccion de diseno al anadir una nueva fila
  6. Insertar el módulo

    En la nueva fila, haga clic en Anadir modulo. En el cuadro de diálogo Insertar modulo o fila busque Vista de lista y haga clic en WP-ImmoMakler 1-Click: Vista de lista.

    Divi 5 Dialogo de modulos – Resultado de busqueda con el modulo 'WP-ImmoMakler 1 clic: Vista de lista'

    El módulo se inserta y muestra de inmediato una vista previa en vivo con sus inmuebles en el Visual Builder.

    Divi 5 Visual Builder – El modulo de vista de lista con una vista previa en vivo de los inmuebles
  7. Guardar

    Haga clic arriba a la derecha en Guardar. La plantilla de archivo ya está activa.

La plantilla individual controla cómo se muestra la página de detalle de un inmueble concreto.

  1. Abrir el Theme Builder

    Navegue en el backend de su sitio web (wp-admin) a Divi → Theme Builder.

  2. Crear una nueva plantilla

    Haga clic en + Anadir nueva plantilla y seleccione Crear nueva plantilla.

  3. Configurar la asignación

    En el cuadro de diálogo Ajustes de plantilla, en la pestaña Usar para, desplácese hasta la sección Inmuebles y marque Todos los inmuebles. Haga clic en Crear plantilla.

    Divi 5 Ajustes de plantilla – Seccion 'Inmuebles' con la casilla 'Todos los inmuebles' activada
  4. Añadir el contenido principal

    En la nueva plantilla, haga clic en Anadir cuerpo personalizado y seleccione Crear cuerpo personalizado.

  5. Añadir una fila

    En el Visual Builder, haga clic en Anadir fila y seleccione el diseño de una columna.

  6. Insertar el módulo

    Haga clic en Anadir modulo, busque Vista de detalle y seleccione WP-ImmoMakler 1-Click: Vista detallada.

    Divi 5 Dialogo de modulos – Resultado de busqueda con el modulo 'WP-ImmoMakler 1 clic: Vista de detalle'
  7. Guardar

    Haga clic en Guardar. La plantilla individual ya está activa.

En el Divi 5 Visual Builder, los módulos de WP-ImmoMakler muestran una vista previa en vivo con datos reales de inmuebles. Puede definir un inmueble de vista previa propio para cada plantilla — por ejemplo, una casa para la plantilla de casas y un inmueble comercial para la plantilla comercial.

  1. Abrir los ajustes de página

    En el Visual Builder, haga clic arriba en la barra de herramientas en el icono de engranaje (ajustes de página).

  2. Elegir la pestaña Contenido y seleccionar el inmueble de vista previa

    En la ventana de ajustes de página, cambie a la pestaña Contenido. Introduzca en el campo Inmueble de vista previa un término de búsqueda (n.º de inmueble o título) y seleccione el inmueble deseado de la lista.

    La vista previa de todos los módulos de WP-ImmoMakler en el lienzo se actualiza de inmediato — sin guardar.

  3. Guardar

    Haga clic en Guardar. La selección queda asignada a esta plantilla a partir de ahora.

Ambos módulos de 1 clic muestran la consolidada presentación HTML de WP-ImmoMakler. Para personalizaciones más avanzadas:

  • WP-ImmoMakler Customizer: ajuste colores, fuentes y espaciados en Apariencia → Customizer → WP-ImmoMakler
  • Ajustes del módulo: abra el módulo en el Visual Builder para mostrar u ocultar áreas concretas, como la galería de imágenes o el encabezado
  • CSS: introduzca sus propios estilos en la pestaña Avanzado del módulo o mediante un plugin Child Skin

Para la vista de detalle, Divi 5 ofrece además del módulo de 1 clic módulos individuales especializados — galería de imágenes, datos del inmueble, listas de superficies y de precios, mapa de ubicación, datos de contacto y más. Qué módulos ofrece su versión de Divi se indica en el resumen del Divi Theme Builder. Un diseño individual se construye tal como muestra paso a paso Divi 4: Crear plantilla individual — aunque en Divi 5 algunos módulos tienen nombres distintos, por ejemplo Datos del inmueble en lugar de Tabla de datos.