Introducción #
El componente Tags se utiliza para mostrar etiquetas visuales sobre los inmuebles, como por ejemplo si una propiedad ha sido destacada por su relevancia, visibilidad o interés comercial. Estas etiquetas permiten resaltar ciertas características especiales del inmueble directamente en la página de detalle o en listados.
En el siguiente ejemplo visual, se muestra cómo se presenta la etiqueta “Propiedad destacada”:
Código del Componente #
A continuación, se incluye el código fuente del componente tags, el cual puedes modificar según tus necesidades visuales o lógicas:
<?php foreach ($tags as $tag) { ?>
<?php if ($tag->key() === "VISUALINMU_DESTACADO" || $tag->key() === "DESTACADO") { ?>
<a href="/inmuebles/?tags=DESTACADO" target="_blank"
class="badge bg-light text-dark badgePropiedadDestacada">Propiedad destacada</a>
<?php } ?>
<?php if ($tag->key() === "VISUALINMU_DELUJO") { ?>
<a href="/inmuebles/?tags=VISUALINMU_DELUJO" target="_blank"
class="badge bg-light text-dark badgePropiedadDeLujo">Propiedad de lujo</a>
<?php } ?>
<?php if ($tag->key() === "VISUALINMU_VERIFICADO") { ?>
<a href="/inmuebles/?tags=VISUALINMU_VERIFICADO" target="_blank" class="badge bg-light text-dark badgePropiedadDeLujo" data-bs-toggle="tooltip" data-bs-placement="top" title="Este inmueble y sus propietarios fueron previamente verificados a través de nuestro software de análisis jurídico y se encuentra CALIFICADA para ser comercializada; encuentra la información legal de esta propiedad descargando gratis la ficha técnica."><i class="icon icon-uniE9AF"></i> Propiedad verificada</a>
<?php } ?>
<?php } ?>Conclusión #
Este componente se encuentra en la ruta:componentes/detalleinmueble/tags.php
Para personalizarlo sin perder tus cambios tras futuras actualizaciones del plugin, copia el archivo a tu tema siguiendo esta estructura:
visualinmueble/
├── templates/
│ └── inmuebles/
│ └── componentes/
│ └── detalleInmueble/
│ └── tags.php
Desde allí puedes:
- Traducir o modificar los textos de las etiquetas (por ejemplo, “Propiedad destacada”, “Propiedad verificada”)
- Cambiar estilos visuales: colores, bordes, tipografías, íconos, etc.
- Añadir nuevas etiquetas basadas en condiciones personalizadas (por ejemplo, tipo de inmueble, precio, disponibilidad)
- Incluir tooltips, enlaces personalizados o íconos adicionales
- Gestionar el orden y visibilidad de las etiquetas según criterios dinámicos
🎯 Consejo: Utiliza clases CSS específicas para mantener la coherencia visual y facilitar futuras actualizaciones de estilo.
✅ Las modificaciones hechas en tu tema permanecerán intactas incluso después de actualizar el plugin, siempre que no edites directamente los archivos originales.
