El Widget Inmuebles en Arriendo permite mostrar un listado de propiedades disponibles en arriendo en formato de tarjetas. Cada inmueble se representa visualmente mediante el Componente Card, lo cual asegura uniformidad en el diseño y consistencia en la presentación de la información.
📝 Descripción #
Este widget se utiliza para renderizar de forma ordenada y adaptable la lista de inmuebles disponibles en arriendo.
Cada propiedad se mostrará dentro de una tarjeta (Card) con su respectiva información: precio, ubicación, metros cuadrados, número de habitaciones, entre otros.
👉 En caso de que no existan inmuebles disponibles, el componente mostrará un mensaje de “Sin Resultados”.
⚙️ Funcionamiento #
<div class="row">
<?php if (count($inmuebles) > 0) : ?>
<?php foreach ($inmuebles as $cont => $inmueble) : ?>
<div class="col-xs-12 col-md-4 card-space">
<?php visualinmu_load_template("inmuebles/componentes/card.php", get_defined_vars()); ?>
</div>
<?php endforeach; ?>
<?php else : ?>
<label> Sin Resultados </label>
<?php endif; ?>
</div>El widget utiliza un ciclo foreach para recorrer el listado de inmuebles.
- Si existen inmuebles (
count($inmuebles) > 0), se genera una grilla de 3 columnas (col-md-4) en pantallas medianas o mayores, y en pantallas pequeñas (col-xs-12) se muestran en una sola columna. - Cada tarjeta se carga dinámicamente mediante la función:
<?php visualinmu_load_template("inmuebles/componentes/card.php", get_defined_vars()); ?>
- Si no hay resultados, se muestra el mensaje:
<label> Sin Resultados </label>
🎨 Personalización #
Este widget se puede personalizar en los siguientes aspectos:
🔹 Diseño de columnas #
Por defecto, los inmuebles se muestran en 3 columnas en pantallas medianas (col-md-4) y en una sola columna en móviles (col-xs-12).
👉 Puedes modificar estas clases de Bootstrap para ajustar el número de columnas según tus necesidades.
🔹 Mensaje de “Sin Resultados” #
Se puede cambiar el texto mostrado cuando no existen inmuebles disponibles.
🔹 Integración con el Componente Card #
Toda la información de cada inmueble se renderiza mediante el componente Card.
👉 Si deseas cambiar el diseño o los datos que se muestran en cada inmueble, la personalización debe hacerse directamente en el Componente Card.
🔗 Referencias #
📄 Documentación del Componente Card:
👉 Personalización del Componente Card
