Ir al contenido principal

¿Cómo puedo agregar componentes de la integración de nuby en WordPress?

ConectaAprende todoa elgestionar podery visualizar las funcionalidades de nubytu coninmobiliaria en tu sitio web en WordPress.web. Esta guía te explicará cómo implementarusar laslos funcionalidades"Componentes Web" (plugins) de tunuby CRMpara inmobiliariomostrar (buscador detus inmuebles, áreacaptar declientes clientes,y destacados,recibir etc.)solicitudes directamente en tu páginaCRM.

web

Tip: medianteSi usas editores visuales como Elementor o Divi, busca el usobloque o widget de "shortcodes"Shortcode" (códigoso cortos)."Código HTML" y pega allí el texto.


📋🧩 Introducción¿Qué son los Componentes Web?

ElSon ecosistemapequeñas deaplicaciones nubyo para"bloques" sitiosfuncionales que conectan tu página web se(WordPress) componecon detu 3sistema pluginsnuby. esenciales que trabajan en conjunto. Para que todo funcione correctamente, es necesarioPermiten que los tresvisitantes esténvean instaladostu y activosinventario en tiempo real o te envíen datos que llegarán automáticamente a tu WordPress.software.

Los

Para 3usarlos, Componentesutilizamos delShortcodes Sistema:

(códigos
cortos).
    Piensa
  1. en

    Arrendasoftellos Login:

    como
      "etiquetas
    • ¿Qué hace?mágicas": Esal lapegar llaveun depequeño acceso. Gestiona la seguridad y la conexióntexto entre tucorchetes WordPress y la base de datos de nuby.

    • Importancia: Fundamental. Los otros dos plugins dependen de este para funcionar.

  2. Arrendasoft Web Components API:

    • ¿Qué hace?: Es la "caja de herramientas" visual. Contiene todos los elementos públicos que ven tus visitantes: buscadores, listados de propiedades, mapas y formularios de contacto.

    • Uso: Se implementa pegando códigos simples[...] en tusuna páginas.página, el sistema mostrará automáticamente un buscador completo, un mapa o un formulario.

  3. Arrendasoft Customer Area:

    • ¿Qué hace?: Crea una zona privada para tus clientes (propietarios e inquilinos).

    • Funcionalidades: Permite ver estados de cuenta, descargar facturas, consultar historiales de pago y actualizar datos personales.


🛠️ Instrucciones de Implementación

Para mostrar cualquier funcionalidad de nuby en tu web, utilizamos un sistema de Shortcodes. Un shortcode es una pequeña línea de código entre corchetes [...] que le dice a WordPress: "¡Aquí va el buscador de propiedades!".

Pasos generales:

  1. Ingresa al panel de administración de tu WordPress.

  2. CreaVe a la sección Páginas y crea una Nueva Página o edita una existente (ej. "Inmuebles", "Contacto", "Zona Clientes").

  3. Pega el código corto correspondiente enEn el editor de texto.texto, pega el Shortcode del componente que necesitas (ver lista abajo).

  4. Guarda y publica la página.

💡 Tip: Si usas editores visuales como Elementor o Divi, busca el bloque o widget de "Shortcode" o "Código HTML" y pega allí el texto.


 


📚 Catálogo de Componentes (Shortcodes)

A continuación, encontrarás los códigos listos para copiar y pegar según la funcionalidad que necesites.

1. Zona Privada de Clientes

Ideal para fidelizar a propietarios e inquilinos ofreciéndoles autogestión.

  • Código a insertar:


    [customer_area]

2. Buscadores de Inmuebles

Facilita a tus visitantes encontrar la propiedad de sus sueños.

  • Buscador Simple (Filtros básicos):

    Barra de búsqueda con filtros por código, tipo de inmueble, ubicación y precio.

    image.png

    <div class="arrendasoft">[arrendasoft_web_components_api component="simple-search"]</div>
    • Opción avanzada (Solo un tipo de servicio, ej. solo Ventas):


      <div class="arrendasoft">[arrendasoft_web_components_api component="simple-search" servicio="1"]</div>

 

  • Buscador con Mapa Interactivo:

    PermiteMapa buscarinteractivo propiedadesdonde navegandolos geográficamente.usuarios pueden ver la ubicación de tus inmuebles y filtrar resultados.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="map-of-properties"]</div>
    • Con filtros activados:


      <div class="arrendasoft">[arrendasoft_web_components_api component="map-of-properties" filters="true"]</div>

3. Visualización de Propiedades

Muestra los resultados y detalles de tus inmuebles.

  • Resultados de Búsqueda:

    Página donde aterrizan los usuarios después de usar el buscador.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="search-results"]</div>
    • Cambiar diseño:


      <div class="arrendasoft">[arrendasoft_web_components_api component="map-of-properties" filters="true"]</div>
  • Propiedades Destacadas:

    Muestra un carrusel o grilla con tus mejores inmuebles (ideal para el Inicio). Nota: Asegúrate de marcar los inmuebles como "Destacados" en tu CRM nuby para que aparezcan aquí.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="featured-properties"]</div>
    • Ejemplo personalizado (Mostrar 3 inmuebles de un servicio específico con diseño alternativo):


      <div class="arrendasoft">[arrendasoft_web_components_api component="featured-properties" items="3" servicio="1" template="template1"]</div>
  • Detalle de Propiedad:

    LaEs la ficha técnicacompleta completadel inmueble. Muestra fotos, características, precios y botones de unacción inmueble(compartir, específico.pedir cita).


    <div class="arrendasoft">[arrendasoft_web_components_api component="detalle-propiedad"]</div>
    • Cambiar diseño:


      <div class="arrendasoft">[arrendasoft_web_components_api component="detalle-propiedad" template="template1"]</div>

4. Formularios de Captación y Contacto

Convierte visitantes en clientes potenciales.

  • Consignar/Registrar Propiedad:

    FormularioPermite a propietarios registrar los datos de un inmueble que desean vender o arrendar contigo. La información llega a nuby para que lostus propietariosasesores ofrezcanla susgestionen inmuebles.desde el módulo Propiedades > Propiedades Pendientes.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="property-register"]</div>
  • Contactar Asesor:

    Formulario de contacto general.directo para consultas generales. Envía notificaciones a los correos electrónicos de los asesores configurados en el sistema.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="contact-adviser"]</div>
  • Requerimientos:

    Para clientes que buscan algo específico quey no encontraron.lo encuentran en el momento. Crea automáticamente un registro en el módulo Propiedades > Requerimientos de nuby y notifica al correo configurado.

    image.png


    <div class="arrendasoft">[arrendasoft_web_components_api component="requirements"]</div>

⚙️ Personalización Avanzada (Parámetros)

Puedes modificar el comportamiento de los componentes agregando parámetros adicionales dentro del shortcode. Aquí explicamos qué hace cada uno:

Parámetro Descripción Ejemplo de uso
items="X" Define la cantidad de inmuebles a mostrar. Útil para la sección de destacados. items="3" (Muestra 3 inmuebles)
servicio="ID" Filtra por Tipo de Servicio. El número corresponde al ID en tu configuración de nuby (Servicio 1 Arriendo - Servicio 2 Venta). servicio="1"
template="X" Cambia la apariencia visual del componente si hay múltiples diseños disponibles.
Catálogo de Plantillas
template="template1"
filters="true" Habilita o deshabilita los filtros de búsqueda dentro del mapa. filters="true" (Muestra filtros)