Personalización de Componente “cards”

🧩 Introducción #

El componente “cards" es responsable de renderizar visualmente un conjunto de inmuebles en formato de grilla, utilizado en páginas como resultados de búsqueda, secciones de propiedades similares y listados destacados.

Cada inmueble se presenta como una tarjeta independiente, cargada desde un subcomponente reutilizable (card.php). Este componente también puede incluir bloques publicitarios de captura de leads cuando se habilita dicha opción.

---

👁️ Vista del Componente #

Muestra tarjetas de inmuebles similares o relacionados, con información como precio, tipo, ubicación, área, número de habitaciones y baños.

---

🧱 Código del Componente #

<div class="row d-flex align-items-stretch flex-wrap">
    <?php foreach ($inmuebles as $index => $inmueble): ?>
        <?php $cont = $index + 1; ?>
        <div class="col-xl-3 col-lg-4 col-md-6 col-xs-12 mb-2">
            <?php visualinmu_load_template("inmuebles/componentes/card.php", get_defined_vars()); ?>
        </div>

        <?php
        if (visualinmu_configuracion_checkConfiguracion('filtros', 'mostrarAdwordsEnResultadoBusqueda')) {
            if ($cont == 5 || $cont == 11 || $cont == 43) { ?>
                <div class="col-xl-3 col-lg-4 col-md-6 col-sm-6 col-xs-12 mb-2">
                    <div class="card-inmueble flex-fill">
                        <div class="card card-space" style="width: 100%;">
                            <div class="card-body">
                                <?php
                                $version = rand(0, 1) == 0 ? 'A' : 'B';
                                $path = ($version == 'A') ? "leads/buscarinmueble" : "leads/buscarinmueblestep";
                                echo do_shortcode('[visualinmu_lead_shortcode height="600" path="' . $path . '"]');
                                ?>
                            </div>
                        </div>
                    </div>
                </div>
            <?php }
        } ?>
    <?php endforeach; ?>
</div>

---

🛠️ ¿Qué se puede personalizar? #

1. Diseño de columnas
   • Puedes cambiar el número de columnas por dispositivo ajustando las clases Bootstrap: col-xl-3 col-lg-4 col-md-6
2. Plantilla individual de tarjeta
   • El componente carga cada tarjeta mediante: visualinmu_load_template("inmuebles/componentes/card.php", get_defined_vars()); Puedes editar la vista interna del inmueble modificando card.php.
3. Bloques de captación (Ads/Leads)
   • Se insertan luego de ciertas posiciones: if ($cont == 5 || $cont == 11 || $cont == 43) Puedes cambiar esas posiciones, añadir más o eliminarlos.
   • También puedes modificar el shortcode incluido: [visualinmu_lead_shortcode height="600" path="..."] Para apuntar a otros formularios, cambiar altura u otros atributos.
4. Control de activación
   • Los bloques de lead solo aparecen si está habilitada esta configuración: visualinmu_configuracion_checkConfiguracion('filtros', 'mostrarAdwordsEnResultadoBusqueda') Puedes forzarlos o condicionar su aparición según otras reglas.

---

📁 Ruta del Componente #

Ubicación original en el plugin:

componentes/search/cards.php

Ruta para sobrescribirlo en tu tema hijo:

visualinmueble/
└── templates/
    └── inmuebles/
        └── componentes/
            └── search/
                └── cards.php

📌 Puedes clonar el archivo cards.php en la ruta de tu tema hijo y modificar libremente sin perder compatibilidad con futuras actualizaciones del plugin.