Iconos para los datos de los inmuebles

WP-ImmoMakler incluye su propio conjunto de iconos de línea para los datos de los inmuebles, por ejemplo un calendario para el año de construcción, un plano para las habitaciones o un marcador de ubicación para la dirección. Los iconos están incrustados directamente en la página como SVG: no cargan archivos ni fuentes adicionales y adoptan el color de texto de su entorno.

Dónde aparecen los iconos

En las cajas de datos clave de Elementor, Bricks, WPBakery, Divi 4 y Divi 5, así como en el bloque «Cajas de datos básicos» del editor del sitio.
En la lista de iconos de datos clave de Divi 5 y en el bloque «Lista de iconos de datos clave» del editor del sitio.
En la lista de iconos de datos clave de Elementor. En cada entrada, en Fuente de icono, elige entre la Biblioteca estándar con los iconos de WP-ImmoMakler y Elementor para un icono de la biblioteca de Elementor. Un widget recién insertado utiliza la biblioteca estándar; los widgets existentes conservan los iconos elegidos hasta ahora.
En la presentación estándar sin Page Builder, en la indicación de ubicación bajo el título, por ejemplo «22391 Hamburgo, Casa adosada»: en la vista de detalle y en la vista de lista con el diseño «Compacto».

Ajustar el grosor de trazo y la forma

En el backend de su sitio web (wp-admin), en WP-ImmoMakler → Ajustes → Presentación, define en la sección Iconos cómo se dibujan todos los iconos:

Grosor de trazo de los iconos: «Fein» (fino), «Leicht» (ligero), «Normal» o «Kräftig» (grueso). «Fein», «Normal» y «Kräftig» se corresponden con los estilos Thin, Light y Regular de Font Awesome; «Leicht» se sitúa entre «Fein» y «Normal». Si su tema o Page Builder utiliza Font Awesome, elija el mismo grosor para que ambos tipos de iconos tengan la misma intensidad. El valor predeterminado es «Normal».
Forma de los iconos: «Circular» dibuja los extremos de línea y las esquinas redondeados, «Cuadrado» con extremos de línea rectos y esquinas en ángulo. En el estilo cuadrado, también los marcos de los iconos de calendario y de plaza de aparcamiento reciben esquinas en ángulo.

Los ajustes se aplican a todos los Page Builder y a la presentación estándar al mismo tiempo. El color y el tamaño de los iconos los sigue ajustando, como hasta ahora, en el elemento correspondiente de su Page Builder.

Además, puede fijar el grosor de trazo de forma distinta para un elemento concreto: en las casillas de datos clave de Elementor, Bricks, WPBakery y Divi 5, en la lista de iconos de datos clave de Elementor y Divi 5, y en los bloques «Cajas de datos básicos» y «Lista de iconos de datos básicos» existe para ello el campo Grosor de trazo de los iconos. El valor predeterminado es Como en los ajustes. La forma se aplica siempre a todo el sitio web.

Selección automática de iconos

Si un elemento está en «Automático (según campo)», WP-ImmoMakler elige el icono adecuado al campo de datos:

Campo de datos	Icono
Año de construcción, Disponible desde, Última modernización	Calendario
Superficie habitable, superficie útil y otras superficies	Cuadrado con flecha diagonal
Superficie de la parcela	Árbol en una parcela
Superficie del jardín	Árbol
Número de habitaciones	Plano
Plazas de aparcamiento	P en un cuadrado
Precio de compra, alquileres y otros campos de precio	Cartera
Tipo de inmueble	Casa
Dirección	Marcador de ubicación

Para los campos sin icono propio, como dormitorios, cuartos de baño, planta o certificado energético, WP-ImmoMakler sigue utilizando iconos al estilo de Lucide. Estos siguen el mismo grosor de trazo y la misma forma.

Para desarrolladores: iconos propios y adaptaciones

Con el filtro immomakler_property_field_icons añade o sustituye iconos. Indique solo las rutas sin el elemento <svg>, dibujadas como líneas en una cuadrícula de 24 × 24. No se admiten rellenos ni colores fijos, porque el color y el trazo proceden del elemento <svg> circundante.

add_filter( 'immomakler_property_field_icons', function ( $icons ) {
  $icons['pool'] = [
    'label' => __( 'Pool', 'my-theme' ),
    'svg'   => '<path d="M2 17h20M2 21h20"/>',
  ];
  return $icons;
} );

Con immomakler_property_field_icon_map asigna un icono a un campo de datos para la selección automática, por ejemplo $map['hat_pool'] = 'pool';.

Con immomakler_property_field_icon_style establece el grosor de trazo y la forma mediante código, independientemente del ajuste del backend. Se admiten grosores de trazo mayores que 0 y de hasta 4:

add_filter( 'immomakler_property_field_icon_style', function ( $style ) {
  $style['stroke'] = '2';
  $style['form']   = 'sharp';
  return $style;
} );

Cada icono lleva la clase CSS immomakler-icon. El grosor de trazo y la forma se establecen como atributos en el elemento <svg>, de modo que también puede sobrescribirlos para áreas concretas mediante CSS, por ejemplo con stroke-width: 2.25;.

Iconos para los datos de los inmuebles

Dónde aparecen los iconos

Ajustar el grosor de trazo y la forma

Selección automática de iconos

Para desarrolladores: iconos propios y adaptaciones

También puede interesarle