--- title: Cómo preparar imágenes para una visualización óptima en la app para huéspedes description: Este artículo recopila las especificaciones técnicas recomendadas para las imágenes en las distintas secciones del CMS, a fin de garantizar una visualización uniforme y de alta calidad. --- 1. [Centro de ayuda](https://help.stay-app.com/es/knowledge) 2. [ Ajustes generales ](https://help.stay-app.com/es/knowledge/ajustes-generales) 3. [ Imágenes ](https://help.stay-app.com/es/knowledge/ajustes-generales#imágenes) 19 de junio de 2026 # Cómo preparar imágenes para una visualización óptima en la app para huéspedes ### **Descripción general** Las imágenes desempeñan un papel clave en la experiencia del huésped. Cada sección del CMS puede mostrar las imágenes de forma diferente según su diseño y su finalidad en la app para huéspedes o guest app. Este artículo recopila las **especificaciones técnicas recomendadas** para las imágenes en las distintas secciones del CMS, a fin de garantizar una visualización uniforme y de alta calidad. En cada sección encontrarás: - Las especificaciones técnicas recomendadas - Los pasos para acceder al componente y configurarlo - Una referencia visual que incluye tanto la configuración en el CMS como la visualización de la imagen en la app para huéspedes Seguir estas directrices ayuda a evitar recortes, deformaciones e incoherencias visuales en toda la app. ### **Antes de empezar** Antes de subir imágenes al CMS, ten en cuenta lo siguiente: - **Estas especificaciones son orientativas.** Las imágenes pueden adaptarse automáticamente en función de dónde se muestren, pero seguir estas recomendaciones ayuda a evitar recortes o deformaciones inesperadas. - Si un componente te permite elegir entre **usar la imagen del servicio** o subir una **imagen personalizada**, ten en cuenta que la imagen original del servicio puede no mostrarse como esperas debido a diferencias de proporción o diseño. - Cuando subas varias versiones de una misma imagen (por ejemplo, 4:3 y 1:1), utiliza siempre **nombres de archivo distintos**. Si prefieres subir las imágenes desde la sección **Imágenes** (en lugar de subirlas individualmente en cada sección), es especialmente importante usar **convenciones de nomenclatura claras y estructuradas**. Incluir la sección de destino en el nombre del archivo (por ejemplo, restaurant_widget_3-1.jpg) puede ayudarte a identificar y reutilizar rápidamente la versión correcta más adelante. Dedicar unos minutos a preparar y nombrar correctamente las imágenes te ahorrará tiempo y evitará problemas de visualización en la app. **Importante:** Las imágenes que no coincidan con la proporción recomendada pueden recortarse o redimensionarse automáticamente según el componente.   ### **Requisitos de imagen por sección del CMS** #### 1. Sección Mi app Esta sección recoge todos los requisitos de imagen de los elementos configurados en la sección **Mi app** del CMS, incluidos la cabecera y los widgets de la página de inicio. #### 1.1. Ajustes generales: Logotipo El logotipo puede utilizarse tanto en la **Cabecera** como en el **Menú lateral**. El logotipo debe subirse en **formato horizontal**, ya que la altura del componente es fija. Los logotipos verticales no se ajustan correctamente y pueden verse recortados o demasiado pequeños. Para garantizar una visualización óptima, evita añadir márgenes o relleno alrededor del logotipo. El espacio adicional hará que se vea más pequeño dentro del componente. **Especificaciones recomendadas:** - **Formato:** PNG - **Tamaño de imagen:** 400 x 200 px - **Relación de aspecto:** 4:2 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB - **Fondo:** transparente **Para acceder y configurar este componente** en **Cabecera:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve a **Cabecera** dentro de **Ajustes generales**. 3. Selecciona un tipo de cabecera. 4. Define el estilo de fondo. 5. Sube un **logotipo**. 6. Define los colores. 7. Haz clic en **Guardar cambios**. **Para acceder y configurar este componente** en **Menú lateral:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve a **Menú lateral** dentro de **Ajustes generales**. 3. Sube un **logotipo**. 4. Define los colores del menú. 5. Edita los grupos y secciones del menú. 6. Haz clic en **Guardar cambios**.   ![Homepage_Header_Color](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Header_Color.jpg?width=670&height=460&name=Homepage_Header_Color.jpg)   #### 1.2. Ajustes generales: Cabecera ##### **Cabecera estándar** Se utiliza como imagen principal en la parte superior de la pantalla de inicio. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 450 x 225 px - **Relación de aspecto:** 2:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve a **Cabecera** dentro de **Ajustes generales**. 3. Selecciona **Estándar** como tipo de cabecera. 4. Selecciona **Imagen** como estilo de fondo. 5. Sube una **imagen de fondo**. 6. Sube un logotipo. 7. Define los colores. 8. Haz clic en **Guardar cambios**.   ![Homepage_Header_Image](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Header_Image.jpg?width=670&height=460&name=Homepage_Header_Image.jpg)   ##### **Cabecera upsell** Se utiliza para promocionar servicios o productos mediante un carrusel que se muestra en la parte superior de la app. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 380 x 220 px - **Relación de aspecto:** 4:3 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve a **Cabecera** dentro de **Ajustes generales**. 3. Selecciona **Upsell** como tipo de cabecera. 4. Define la configuración de la cabecera (color de fondo, logotipo y colores). 5. Haz clic en **Añadir** para crear un nuevo elemento en el carrusel (puedes añadir varios elementos). 6. Selecciona una **fuente de contenido** y un **elemento de contenido**. 7. Sube una **nueva imagen** (recomendado) o usa la imagen ya asociada al elemento seleccionado.   ![Homepage_Header_Upsell](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Header_Upsell.jpg?width=670&height=460&name=Homepage_Header_Upsell.jpg) #### 1.3. Widgets de la página de inicio ##### **Widget Contenido** Permite subir imágenes personalizadas para las tarjetas de contenido (opción **Manual** dentro de **Tipo de contenido**) en lugar de usar imágenes vinculadas a servicios. Esto ayuda a que el contenido del carrusel sea visualmente distintivo y esté adaptado a promociones o destacados específicos. **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app** > **Personalizar app > Editar app**. 2. Ve al menú de widgets de la parte izquierda. 3. Haz clic en **+** y selecciona **Contenido** dentro de **Contenido del hotel**. 4. Selecciona **Manual** como tipo de contenido y haz clic en **Añadir**. 5. Selecciona una **fuente de contenido** y un **elemento de contenido**. 6. Sube una imagen. 7. Define el título y el texto destacado. 8. En la sección **Diseño**, selecciona **Slider** como orientación de la tarjeta. 9. Elige **Blanco** o **Imagen** como estilo de tarjeta. 10. Selecciona el **estilo de imagen** deseado (4:3, 9:16, 1:1 o Redonda). 11. Define la **visibilidad del widget**. 12. Haz clic en **Guardar cambios**.   **Especificaciones recomendadas según las opciones de diseño seleccionadas:** **Slider - Blanco - 4:3** - **Formato:** JPG - **Tamaño de imagen:** 400 x 300 px - **Relación de aspecto:** 4:3 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB   ![Homepage_Grid_01](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_01.jpg?width=670&height=460&name=Homepage_Grid_01.jpg)   **Slider - Blanco - 1:1** - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_02](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_02.jpg?width=670&height=460&name=Homepage_Grid_02.jpg)   **Slider - Blanco - Redonda** - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_03](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_03.jpg?width=670&height=461&name=Homepage_Grid_03.jpg)   **Slider - Imagen - 4:3** - **Formato:** JPG - **Tamaño de imagen:** 400 x 300 px - **Relación de aspecto:** 4:3 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_04](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_04.jpg?width=670&height=461&name=Homepage_Grid_04.jpg)   **Slider - Imagen - 9:16** - **Formato:** JPG - **Tamaño de imagen:** 400 x 800 px - **Relación de aspecto:** 9:16 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_05](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_05.jpg?width=670&height=459&name=Homepage_Grid_05.jpg)   **Slider - Imagen - 1:1** - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_06](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_06.jpg?width=670&height=460&name=Homepage_Grid_06.jpg) ##### **Widget Rejilla** Muestra contenido con un diseño mixto que emplea distintos formatos de imagen. **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve al menú de widgets de la parte izquierda. 3. Haz clic en **+** y selecciona **Rejilla** dentro de **Contenido del hotel**. 4. Introduce un **título** y un **texto de acción** y haz clic en **Añadir**. 5. Selecciona una **fuente de contenido** y un **elemento de contenido**. 6. Sube una imagen. 7. Define un **título** y un **texto destacado**. 8. Define la **visibilidad del widget**. 9. Haz clic en **Guardar cambios**. Al añadir varios elementos al widget Rejilla, algunos pueden mostrarse a ancho completo y otros a medio ancho.   **Especificaciones recomendadas según el ancho:** **Tarjeta superior** (ancho completo) - **Formato:** JPG - **Tamaño de imagen:** 600 x 300 px - **Relación de aspecto:** 3:2 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Tarjeta inferior** (medio ancho) - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Grid_07](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Grid_07.jpg?width=670&height=459&name=Homepage_Grid_07.jpg) ##### **Widget Destacados** Muestra contenido destacado en un carrusel horizontal con imagen, título, subtítulo y un botón de llamada a la acción. **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve al menú de widgets de la parte izquierda. 3. Haz clic en **+** y selecciona **Destacados** dentro de **Contenido del hotel**. 4. Haz clic en **Añadir**. 5. Selecciona una **fuente de contenido** y un **elemento de contenido**. 6. Sube una imagen. 7. Define un **título,** un **subtítulo** y un **texto para el botón**. 8. Añade otro elemento, si es necesario, y sigue las mismas instrucciones. 9. Define la **visibilidad del widget**. 10. Haz clic en **Guardar cambios**. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 400 x 200 px - **Relación de aspecto:** 3:2 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Highlights](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Highlights.jpg?width=670&height=459&name=Homepage_Highlights.jpg)   ##### **Widget Información del huésped** Muestra a los huéspedes un widget con su nombre y las fechas de su estancia, junto con un acceso directo para completar el check-in del hotel. Este widget solo aparece cuando el usuario ha iniciado sesión. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 310 x 80 px - **Relación de aspecto:** 3:2 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve al menú de widgets de la parte izquierda. 3. Haz clic en **+** y selecciona **Información del huésped** dentro de **Interacciones**. 4. Define los **colores del texto y del fondo**. 5. Activa el botón **Mostrar imagen**. 6. Sube una imagen. 7. Si es necesario, habilita el botón **Mostrar botón de check-in** y define su configuración. 8. Define la **visibilidad del widget**. 9. Haz clic en **Guardar cambios**. ![Homepage_GuestInformation](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_GuestInformation.jpg?width=670&height=460&name=Homepage_GuestInformation.jpg)   ##### **Widget Banner** Muestra una tarjeta en formato banner con imagen, título, subtítulo y enlace. Puedes personalizar el estilo del banner y sus colores. **Para acceder y configurar este componente:** 1. En el CMS, ve a **Mi app > Personalizar app > Editar app**. 2. Ve al menú de widgets de la parte izquierda. 3. Haz clic en **+** y selecciona **Banner** dentro de **Enlaces directos**. 4. Selecciona una **fuente de contenido** y un **elemento de contenido**. 5. Selecciona **Blanco** o **Imagen** como estilo de banner. 6. Selecciona un color de fondo (solo si has seleccionado **Blanco**). 7. **Sube una imagen**. 8. Define la altura y la anchura del banner (solo si has seleccionado **Imagen**). 9. Define un **título** y una texto para el **botón**. 10. Define la **visibilidad del widget**. 11. Haz clic en **Guardar cambios**.   **Especificaciones recomendadas según el estilo del banner:** **Banner Blanco** - **Formato:** JPG - **Tamaño de imagen:** 200 x 200 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB ![Homepage_Banner_White](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Banner_White.jpg?width=670&height=434&name=Homepage_Banner_White.jpg)   **Banner Imagen** - **Formato:** JPG - **Tamaño de imagen:** flexible (depende del contenido) - **Relación de aspecto:** flexible (depende del contenido) - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB La altura del banner es dinámica y depende de su configuración: - La altura puede variar según el **tamaño del título** y si se incluye un **subtítulo** - También puedes definir manualmente la altura en píxeles Como resultado, tanto el tamaño de imagen como la relación de aspecto pueden variar según cómo se configure el banner. ![Homepage_Banner_Image](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Homepage_Banner_Image.jpg?width=670&height=435&name=Homepage_Banner_Image.jpg) #### 2. Sección Contenido Esta sección incluye las especificaciones de imagen para el contenido creado en la sección **Contenido** del CMS, como los detalles de servicio, catálogos, pop-ups de upsell, actividades del calendario e iconos de agrupaciones de contenido. #### 2.1. Instalaciones, Servicios, Ocio y Mensaje de bienvenida Las siguientes especificaciones se aplican a todos los servicios creados en Instalaciones, Servicios y Ocio (excepto Calendario de actividades), así como a Mensaje de bienvenida. ##### **Pestaña Información** **Imagen de portada:** imagen principal que se muestra en la parte superior de la página de detalle del servicio. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 640 x 360 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Instalaciones/Servicios/Ocio/Mensaje de bienvenida**. 2. Haz clic en el **tipo de servicio** correspondiente (por ejemplo, Restaurantes). 3. Selecciona un servicio de la lista y haz clic en **Editar.** 4. En la sección **Imagen** de la pestaña **Información**, haz clic en el icono de imagen para añadir una imagen. 5. Selecciona una y haz clic en **Insertar**. 6. Haz clic en **Guardar cambios**. ![Service](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Service.jpg?width=670&height=459&name=Service.jpg) ##### **Catálogos** **Encabezado del catálogo:** se muestra en la parte superior de la página del catálogo del servicio. **Especificaciones recomendadas** - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Instalaciones/Servicios/Ocio/Mensaje de bienvenida**. 2. Haz clic en el **tipo de servicio** correspondiente (por ejemplo, Restaurants). 3. Selecciona un servicio de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Catálogo avanzado**. 5. Desplázate hasta la pestaña **Diseño** del catálogo (debes haber creado uno previamente). 6. Selecciona **Mostrar imagen de fondo** en **Encabezado del catálogo**. 7. Haz clic en el icono de imagen para añadir una imagen. 8. Haz clic en **Guardar cambios**. ![Catalog](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Catalog.jpg?width=670&height=459&name=Catalog.jpg)   **Imagen de producto**: imagen principal que se muestra en la parte superior de la página de detalle del producto. **Especificaciones recomendadas:** - **Formato:** JPG - **Tamaño de imagen:** 400 x 400 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Instalaciones/Servicios/Ocio/Mensaje de bienvenida**. 2. Haz clic en el **tipo de servicio** correspondiente (por ejemplo, Restaurants). 3. Selecciona un servicio de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Catálogo avanzado**. 5. Desplázate hasta la pestaña **Productos** del catálogo (debes haber creado uno previamente). 6. Selecciona un producto y haz clic en **Editar** (icono de lápiz). 7. Haz clic en el icono de imagen de la pantalla **Información del producto** para añadir una imagen. 8. Haz clic en **Guardar cambios**. ![Product](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Product.jpg?width=670&height=434&name=Product.jpg) ##### **Pestaña Upsell** El pop-up de upsell se muestra al promocionar una oferta especial al huésped. **Especificaciones recomendadas** para la **imagen del pop-up de upsell:** - **Formato:** JPG - **Tamaño de imagen:** 325 x 225 px - **Relación de aspecto:** 3:2 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Especificaciones recomendadas para la descripción del pop-up de upsell:** - **Título:** 25-35 caracteres - **Subtítulo**: 40-60 caracteres - **Texto:** 150-200 caracteres para evitar el desplazamiento interno **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Instalaciones/Servicios/Ocio.** 2. Haz clic en el **tipo de servicio** correspondiente (por ejemplo, Restaurants). 3. Selecciona un servicio de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Upsell**. 5. Activa el botón **Activato**. 6. Haz clic en el icono de imagen para añadir una imagen. 7. Define el **nombre**, el **subtítulo** y la **descripción**. 8. Haz clic en **Guardar cambios**. ![Popup_Upsell](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Popup_Upsell.jpg?width=670&height=459&name=Popup_Upsell.jpg)   #### 2.2. Leisure: Activities calendar Esta sección detalla los requisitos de imagen para las actividades que se muestran en el **Calendario de actividades**. Las actividades se agrupan dentro del calendario y se muestran individualmente en la app, cada una en su propia pantalla. La imagen de cada actividad aparece en la parte superior. **Especificaciones recomendadas para la imagen de una actividad:** - **Formato:** JPG - **Tamaño de imagen:** 720 x 400 px - **Relación de aspecto:** 9:5 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Ocio**. 2. Haz clic en **Calendario de actividades**. 3. Selecciona un calendario de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Lista de actividades**. 5. Selecciona una actividad y haz clic en **Editar** (icono de lápiz). 6. En la sección **Imagen** de la pestaña **Información**, haz clic en el icono de imagen para añadir una imagen. 7. Selecciona una y haz clic en **Insertar**. 8. Haz clic en **Guardar**. ![Activity](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Activity.jpg?width=670&height=459&name=Activity.jpg)   #### 2.3. Otros: Agrupaciones de contenido Esta sección recoge las especificaciones de imagen para los iconos de agrupaciones de contenido que se muestran en la app para huéspedes. ##### **Iconos de pestaña** Iconos visibles en la parte superior de la pantalla de la app para representar grupos de contenido. **Especificaciones recomendadas para los iconos:** - **Formato:** JPG - **Tamaño de imagen:** 200 x 200 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Otros**. 2. Haz clic en **Agrupaciones de contenido**. 3. Selecciona un grupo de contenido de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Grupos**. 5. Selecciona o crea un grupo. 6. Haz clic en el icono de imagen cuadrado para añadir un tab icon. 7. Haz clic en **Guardar cambios**. **Nota**: Estas recomendaciones también se aplican a los **Iconos de pestaña **configurados en la pestaña **Grupos** de la funcionalidad **Nuevo mapa**. ![Grouping (1)](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/Grouping%20(1).jpg?width=670&height=459&name=Grouping%20(1).jpg)   ##### **Iconos de marcador en el mapa** Iconos visibles en el mapa del hotel para representar grupos de contenido. - **Formato:** PNG - **Tamaño de imagen**: 200 x 200 px - **Relación de aspecto:** 1:1 - **Espacio de color:** sRGB - **Tamaño de archivo:** máximo 1 MB - **Fondo:** transparente **Para acceder y configurar este componente:** 1. En el CMS, ve a **Contenido > Otros**. 2. Haz clic en **Agrupaciones de contenido**. 3. Selecciona un grupo de contenido de la lista y haz clic en **Editar**. 4. Ve a la pestaña **Grupos**. 5. Selecciona o crea un grupo. 6. Haz clic en el icono de imagen redondo para añadir un icono de marcador en el mapa. 7. Haz clic en **Guardar cambios**. **Nota**: Estas recomendaciones también se aplican a los **Iconos de marcador en el mapa** configurados en la pestaña **Grupos** de la funcionalidad **Nuevo mapa**, como se muestra en la siguiente imagen. ### **![mapmarker](https://help.stay-app.com/hs-fs/hubfs/Help%20center%202025/Gu%C3%ADa%20im%C3%A1genes/mapmarker.jpg?width=670&height=434&name=mapmarker.jpg)** ### **Próximos pasos** Ahora que ya conoces las especificaciones de imagen recomendadas: - **Revisa las imágenes que ya tienes** en el CMS y actualiza las que no cumplan con los formatos recomendados. - **Prepara varias versiones de una misma imagen **(por ejemplo, 4:3 y 1:1) para los contenidos clave, de modo que tengas más flexibilidad en los distintos componentes. - Utiliza **convenciones de nomenclatura claras y coherentes** para simplificar la gestión de imágenes. - **Comprueba cómo se muestran las imágenes **en la app para huéspedes después de publicar para asegurarte de que se visualicen correctamente.   ### **¿Necesitas más ayuda?** Si tienes más preguntas o necesitas asistencia adicional: - Contáctanos a través del chat - Envía un ticket a nuestro equipo de Soporte - Visita [STAY Academy](https://education.stay-app.com/courses)