Usa widgets básicos para construir la base de tu sitio. Estas herramientas te permiten añadir elementos esenciales como texto, botones y elementos de navegación para ayudar a los visitantes a encontrar información y actuar.
Usa el widget de Texto o Título para crear titulares, compartir información y contarles a los visitantes sobre tu sitio. Hay tres widgets de texto disponibles: Texto, Título grande (H1) y Título pequeño (H3).
Haz clic en el widget para abrir la barra en línea y aplicar estilo al texto de la siguiente manera:
- Utiliza el Asistente de IA para generar o editar contenido.
- Aplicar una familia de fuentes y estilos de fuente, como negrita, cursiva o subrayado a tu texto.
- Agregar o cambiar hipervínculos.
- Crear listas numeradas o con viñetas.
- Conectar datos.
Alternativamente, asigna estilos especiales en el tema del sitio para administrar tu diseño globalmente.
Impulsa la acción del visitante añadiendo botones. Los enlaces pueden dirigir a páginas, artículos de la tienda, ventanas emergentes, anclas o archivos descargables.
Haz clic en el widget y selecciona la pestaña Contenido para realizar las siguientes acciones:
- En "Texto del botón", ingresa el texto relevante para el botón.
- Selecciona el destino del enlace.
- Utiliza la "Herramienta de auditoría de enlaces" para garantizar que tu botón se vincule a la ubicación esperada.
Haga clic en el widget y seleccione la pestaña Diseño.
Nota:
Los cambios realizados en el editor de Diseño anulan los estilos establecidos en el botón del tema. Para volver al estilo del botón del tema, haga clic en Restablecer estilo del tema.
- Elija entre estilos de tema primarios o secundarios y estilice según corresponda.
-
Active la opción Flotante para mantener un botón visible cuando los visitantes se desplazan.
Utilice botones flotantes para mantener las llamadas a la acción importantes fijas, visibles y clicables en todas las páginas del sitio. Los casos de uso ideales incluyen:
- Contáctenos
- Suscribir
- Obtenga una cotización
Active Mostrar en esta página sólo si es necesario.
- En dispositivos móviles, sugerimos colocar el botón flotante en la esquina inferior de la pantalla para que los visitantes puedan hacer clic en él fácilmente con una mano.
- Puede mostrar un ícono en lugar de texto en el móvil eligiendo el diseño que presenta un ícono en el móvil.
- Si un botón flotante no se muestra en el móvil, es posible que esté usando un diseño antiguo. Para actualizarlo, vaya al Editor de Diseño y haga clic en Diseño del Sitio.
Utilice el widget Espaciador para crear un diseño profesional y organizado, y para mejorar la legibilidad agregando espacios en blanco verticales entre los widgets.
Haga clic en el widget para cambiar la altura del mismo.
Ofrece folletos, libros electrónicos o documentos para descargar. Los visitantes del sitio pueden compartir tus enlaces de descarga a través de otras fuentes, como correo electrónico y redes sociales.
Antes de empezar
- No puedes cargar archivos a tu carpeta raíz.
- Los archivos subidos son públicos. Sube solo archivos de tu propiedad o que tengas permiso para usar. No compartas información confidencial.
- Los formatos admitidos incluyen
.pdf, .xls, .xlsx, .doc, .docx, .zip, .ppt, .pptx, .psd, .txt, .xml, .mp3, .ttf, .otf, .woff, .eot, .svg, .odt, .ott, .js, .css, .png, .jpg, .gif, .jpeg, .rar - Puedes añadir hasta 15 k archivos por sitio. El límite de tamaño de archivo es de 200 MB.
- No se admiten espacios dentro de los nombres de archivos.
- Haz clic en el widget y selecciona la pestaña Contenido.
- En "Texto del botón", ingresa el texto del botón en el campo provisto.
- Haz clic en + Archivo para agregar un archivo.
-
Para agregar nuevos archivos, haz clic en + Cargar archivos.
Arrastra tus archivos o haz clic en "Seleccionar archivos" para agregar archivos o carpetas. También puedes descargar archivos desde Dropbox, Google Drive, un enlace o Gmail. Puedes agregar varios archivos para subirlos simultáneamente.
- Selecciona los archivos relevantes y haz clic en "Subir". Recibirás una notificación cuando se complete la carga.
- Selecciona el archivo relevante.
- Opcional: marca la casilla Establecer archivo sin índice para evitar que los motores de búsqueda muestren el archivo en los resultados de búsqueda.
- Haz clic en Listo.
Organice la información utilizando diseños de listas preformateados.
Para listas más complejas, considere utilizar el widget del menú del restaurante.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Elija incluir un elemento de imagen y el elemento de enlace asociado con cada elemento de su lista.
- Haga clic en Crear su lista para agregar contenido.
- Haga clic en un elemento de la lista para abrir los "ajustes de la lista". Tiene las siguientes opciones:
- Haga clic en + Imagen para agregar una imagen.
- En "Etiqueta del artículo", introduzca el texto de la etiqueta. Para ocultar la etiqueta, haga clic en
. - En "Descripción", introduzca el texto de descripción requerido. Para ocultar la descripción, haga clic en .
- Haga clic en Agregar enlace para seleccionar el tipo de enlace que desea agregar al elemento.
- En "Texto del enlace", introduzca el texto del enlace. Para ocultar el enlace, haga clic en .
- Haga clic en + Agregar elemento para agregar elementos adicionales a la lista.
- En "Título de la lista principal", ingrese el título de la lista en el campo provisto.
- Haga clic y arrastre un elemento para reordenarlo.
Haga clic en el widget y seleccione la pestaña Diseño para diseñar el widget, incluyendo el diseño, los estilos de fuente, los bordes redondeados de la imagen y los estilos del divisor.
Utilice el widget Columna para organizar y ordenar el contenido dentro de una fila.
Importante:
Cree una copia de seguridad de su sitio antes de editar las columnas para garantizar que pueda restaurar una versión anterior si es necesario.
- Haga clic derecho en el widget para abrir el menú del editor de columnas.
- Si la columna no tiene relleno, haga clic derecho en el widget dentro de la columna
- Haga clic en Seleccionar contenedor .
- Seleccione columna.
- Verifique que el encabezado del menú muestre "Columna".
- Edite cada columna individualmente de la siguiente manera:
-
Posición
Para cambiar la posición de la columna, haga clic en las flechas hacia la derecha o hacia la izquierda.
Las flechas están deshabilitadas si la fila contiene solo una columna.
-
Agregar
Haga clic en + Agregar y seleccione una de las siguientes opciones:
- Columna . Agrega una nueva columna a la fila actual. Se pueden añadir un máximo de 4 columnas por fila.
- Fila interna. Agrega una fila dentro de la columna actual.
- Widget Abajo . Añade un nuevo widget directamente debajo del actual. Puedes elegir entre: Texto , Imagen , Botón , Icono o seleccionar Más widgets para abrir la biblioteca completa.
-
Relleno
Para eliminar el espaciado interno, haga clic en Borrar relleno
-
Revertir
Para volver a los ajustes del tema, haga clic en Restablecer espaciado predeterminado.
-
Animación
Haga clic en Animación y seleccione un estilo de animación, como un desvanecimiento o zoom, para aplicar a la columna.
-
Esconder
Para ocultar la columna en las vistas de escritorio, tableta o dispositivo móvil, haga clic en Ocultar de y seleccione la opción correspondiente.
-
Copiar
Para copiar la columna, haga clic en Copiar.
- Ancla
- Para anclar la columna a la página, haga clic en Establecer como ancla e introduzca un nombre. Marque la casilla para añadir el ancla a la navegación de su sitio.
- Para editar el nombre de un ancla existente, haga clic en "Editar ancla". Ingrese el nombre y haga clic en "Actualizar".
- Para eliminar un ancla existente, haga clic en Editar ancla. Haga clic en Eliminar ancla.
- Conectar datos
- Para conectar datos, haga clic en "Conectar datos". En la pestaña "Conectar", seleccione la opción correspondiente y haga clic en "Conectar".
- Para cambiar los datos conectados, haga clic en "Conectar datos". Seleccione "Cambiar conexión". Realice los cambios necesarios y haga clic en "Conectar".
- Para editar los datos conectados, haga clic en "Conectar datos". Seleccione "Editar contenido". Realice los cambios necesarios y haga clic en "Guardar".
-
- Para eliminar la columna, selecciónela y haga clic en Eliminar.
Para editar el estilo de fondo o el espaciado de una columna:
- Haga clic en el widget.
- En el editor de diseño, elija un tipo de fondo:
- Color :
- Seleccione un color sólido o degradado. Los colores degradados prevalecen sobre las imágenes y viceversa.
- Diseñe el color, el ancho y el radio del borde.
- Active Sombra y seleccione un color, un tipo y una posición.
- Imagen :
- Para agregar una imagen al fondo, haga clic en + para abrir el selector de imágenes.
- Seleccione la imagen relevante.
- Para crear un control deslizante de imágenes de fondo, seleccione varias imágenes del selector de imágenes.
- Haga clic en Listo.
- Elija la visualización de su imagen: Portada, Imagen completa, Mosaico o Sin repetición.
- Configure la posición, la superposición de fondo, el borde y la sombra de la imagen.
- Para agregar una imagen al fondo, haga clic en + para abrir el selector de imágenes.
- Video :
- Haga clic en Seleccionar video para seleccionar un archivo cargado o pegue una URL de YouTube, Vimeo o Dailymotion.
- Para obtener más información sobre los fondos de vídeo, consulte Fondos de vídeo.
- Color :
Visualiza los datos en filas y columnas. Puedes escribir los datos directamente, pegar una tabla existente o cargar un archivo CSV.
Antes de empezar
- Sube un archivo CSV que hayas exportado y copiado desde Google Sheets o Excel (solo idiomas que no sean RTL).
- Las tablas solo pueden incluir texto y enlaces. Utiliza filas y columnas o los widgets de lista para crear una tabla con imágenes, botones u otros widgets.
- El editor de tablas no es compatible con la versión 17 de Edge.
- La tabla puede incluir hasta 30 filas y columnas.
- Cuando se conecta a los datos, el límite de filas es el límite del tipo de colección:
En la pestaña Contenido, escribe directamente en el editor o haz clic en Cargar un CSV para agregar datos a la tabla.
Utilice Borrar todo para eliminar todos los datos de su tabla.
Haga clic en el widget y seleccione la pestaña Diseño para ajustar los colores de las filas y el ancho de las columnas.
En dispositivos móviles, elija entre Aplastar , Desplazar o Contraer pantallas.
El widget Tabla sincroniza datos de fuentes internas o externas, como Hojas de Cálculo de Google y Airtable, que permite gestionar el contenido fuera del editor. Vincula automáticamente las filas a cualquier página dinámica existente en la misma colección para facilitar la navegación.
Las tablas conectadas admiten los siguientes tipos de campos:
- Texto enriquecido
- Texto sin formato
- Imagen
- Enlace
- Número
- Fecha y hora
- Correo electrónico
- Selección múltiple
- Teléfono
Conectar el widget de tabla a una colección
- Haga clic con el botón derecho en el widget Tabla y haga clic en Conectar a datos .
- En la pestaña "Conectar", seleccione una colección del menú desplegable.
- Seleccione los campos obligatorios en las opciones de Campos a mostrar . Las columnas se ordenarán en el mismo orden en que se seleccionen.
- Haga clic en Conectar .
- Una conexión de datos exitosa se marca con
cuando pasa el cursor sobre el widget Tabla.
Lista de ingredientes
Lista de precios
Lista de ubicaciones
Lista de sabores
Ayuda a los visitantes a navegar por la jerarquía de tu sitio. Las rutas de navegación muestran la ruta a la página actual, lo que mejora la experiencia del usuario y el SEO.
- Haz clic en el widget y selecciona la pestaña Contenido.
- Activa o desactiva los elementos que quieres que estén visibles en las migas de pan. Tienes las siguientes opciones:
- Página de inicio. Mostrar siempre la página de inicio en las rutas de navegación.
- Página actual. Muestra la página actual en la ruta de navegación.
- Ocultar las rutas de navegación cuando no hay una página principal. Habilita las rutas de navegación para todas las páginas, excepto la página principal o las páginas del primer nivel de navegación.
Haz clic en el widget y selecciona la pestaña Diseño para diseñar la fuente y selecciona un estilo de divisor para separar los nombres de página.
Organice el contenido en secciones expandibles, como preguntas frecuentes o productos destacados. Esto reduce el desplazamiento y ayuda a los visitantes a encontrar la información rápidamente.
El widget Acordeón puede mostrar páginas dinámicas, así como información específica de colección o productos mediante enlace en línea.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Agregar o modificar los campos:
- Elementos:
- Haga clic en un elemento para editar su contenido
- Para duplicar un elemento, haga clic en
para duplicar un artículo - Para agregar un nuevo artículo, haga clic en + Agregar artículo.
- Reglas de visualización:
- Active Mostrar un elemento expandido a la vez para permitir que se abran varios elementos a la vez.
- Active Mostrar el primer elemento expandido para expandir el primer elemento de la lista.
- SEO: active la opción Habilitar esquema de preguntas frecuentes para ayudar a los motores de búsqueda a obtener una vista previa de su contenido.
- Elementos:
Haga clic en el widget y seleccione la pestaña Diseño para darle estilo al widget.
Utilice etiquetas H3 para SEO y optimice el espaciado para dispositivos móviles.
Muestra contenido relacionado, como servicios o planes, en secciones compactas. Los visitantes pueden navegar entre pestañas para ver información diversa sin salir del área.
Nota:
Puede tener una cantidad ilimitada de pestañas, sin embargo, las etiquetas de las pestañas se reducen a medida que se agregan más para proporcionar espacio para las nuevas pestañas.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Haga clic en una pestaña para editarla. Puede editar la imagen, el texto alternativo de la imagen, la etiqueta de la pestaña, el tipo de encabezado de la etiqueta, el título, la descripción, el botón y el enlace del botón.
- Para agregar una nueva pestaña, haga clic en + Agregar pestaña.
- Para mostrar la imagen, active Mostrar imagen.
- Haga clic en el widget y seleccione la pestaña Diseño.
- Haga clic en la miniatura del diseño para seleccionar un diseño.
- Haga clic en Todas las pestañas para personalizar el estilo de las pestañas.
- Haga clic en la pestaña seleccionada y pase el cursor para personalizar el estilo del texto y el fondo. Esto no afecta el diseño de "Todas las pestañas".
- Aplique estilo adicional a lo siguiente:
- Estilo de Descripción
- Estilo de botón
- Estilo de imagen
- Estilo de marco
Incorpore un widget de búsqueda que permita a los huéspedes seleccionar las fechas de estancia. Una vez que el huésped elige las fechas deseadas, se le redirige a su Motor de reservas Guesty para elegir una propiedad.
El filtro de destino extrae automáticamente los datos del campo "dirección de ciudad" de tus anuncios. Puedes personalizar estos valores para mostrar barrios o regiones en lugar de ciudades. Sin embargo, esto puede afectar las conexiones de canal con plataformas como Airbnb, Booking.com y Vrbo debido a sus requisitos de dirección.
De forma predeterminada, el widget Motor de reservas se integra en su página de inicio cuando comienza a crear su sitio web Guesty.
- Haga clic en el widget y seleccione el editor de contenido.
- Opcional: seleccione la ubicación de las propiedades que desea mostrar en el menú desplegable.
- Opcional: Seleccione sus fechas de check-in y salida
Haga clic en el widget y seleccione el editor de diseño para darle estilo al botón.
Agrega una exención de responsabilidad de derechos de autor que se actualice automáticamente al año actual. Esto muestra a los visitantes que tu sitio está activo y en uso.
- Haz clic en el widget y selecciona la pestaña Contenido.
- En "Descripción", introduce el texto de tu descargo de responsabilidad en el campo de texto proporcionado.
-
Activa la posición inversa del ícono/año si es necesario.
El widget de derechos de autor se muestra en todas las páginas de tu sitio.
Haz clic en el widget y selecciona la pestaña Diseño para editar la fuente, el color y la alineación del texto.
Consejo:
Arrastra el widget a la posición deseada. La ubicación estándar es en la parte inferior del sitio.
Muestra propiedades específicas según criterios como la ubicación o los servicios. Usa este widget en tus landing pages para mejorar tu posicionamiento en Google.
Añade títulos atractivos como "Apartamentos con piscina en Ámsterdam" y ofrece opciones de filtrado y clasificación para ayudar a los visitantes a encontrar la propiedad ideal. Cuando los huéspedes buscan apartamentos con piscina en Ámsterdam en línea, es más probable que lleguen a tu página y reserven a través de tu sitio web. Crea tantas páginas de destino específicas como necesites para que tus propiedades sean fáciles de encontrar.
Cuando un visitante hace clic en una propiedad en el widget, se le redirige a su Motor de reservas Guesty para iniciar la reserva. Al filtrar u ordenar los resultados, solo ve los anuncios que coinciden con su selección.
Para obtener la página de destino más efectiva, combina los siguientes widgets:
- Widget de búsqueda de Reserva : añade una barra de búsqueda en la parte superior para que los huéspedes puedan reservar fácilmente. Rellena la ubicación y otros campos para que coincidan con el tema principal de la página (p. ej., establece "Ámsterdam" en la página de tus apartamentos con piscina).
- Widget de Propiedades Destacadas : Colócalo debajo de la barra de búsqueda para destacar tus mejores propiedades. Descubre cómo.
- Widget de resultados de búsqueda SEO : agrega tu título principal (como “Apartamentos junto a la piscina en Ámsterdam”) y muestra tu selección completa de anuncios con opciones de búsqueda y filtro.
Añade el widget de resultados de búsqueda SEO a una página de destino específica con una URL clara o a tu página de inicio. También puedes añadirlo a cualquier página sin combinarlo con otros widgets. Simplemente arrastra y suelta el widget donde quieras.
- Haga clic en el widget y seleccione la pestaña Contenido.
- En "Propiedades para mostrar a los huéspedes cuando acceden por primera vez a esta página", seleccione la ubicación correspondiente en el menú desplegable.
- En "Etiquetas de listados (categorías)", seleccione las etiquetas de categoría relevantes.
- Seleccione el número de dormitorios y baños e ingrese la tarifa por noche del anuncio.
- Seleccione una de las siguientes opciones de visualización:
- Precio - de menor a mayor
- De nuevo a viejo
- De viejo a nuevo
- En "Permitir que los huéspedes filtren y ordenen", active las opciones de filtro requeridas:
- Habilitar filtros para huéspedes
- Habilitar la clasificación para huéspedes
- Haga clic en Aplicar.
Haga clic en el widget y seleccione la pestaña Diseño para agregar animación y espaciado al widget.
Marque el botón Mostrar "ver más" para permitir que los visitantes vean más propiedades.
Resalte los anuncios de lujo o de mayor rendimiento con el widget Propiedades. Es ideal para páginas de destino donde desea que propiedades específicas destaquen. Puede arrastrar y soltar el widget en cualquier lugar de su sitio web o en una página de destino específica.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Busque y seleccione las propiedades que desea mostrar.
- Puede elegir hasta 30 propiedades por widget.
- El estado de los listados debe ser "Propiedad anunciada".
- Haga clic en + Agregar filtro para refinar los resultados por comodidades, tipo de propiedad y/o ubicación.
- En la pestaña "Seleccionado", puede arrastrar las propiedades para cambiar el orden de visualización.
-
Haga clic en Guardar.
Consejo:
Puede agregar múltiples widgets de propiedades y configurar diferentes grupos de propiedades destacadas para presentar en cada uno.
Añada imágenes con texto ajustado. El texto se adapta automáticamente a la imagen según su ubicación.
Nota:
Haga clic derecho y seleccione Conectar a datos para utilizar contenido dinámico.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Seleccione la posición de la imagen: izquierda o derecha.
- Haga clic en la miniatura de la imagen para seleccionar una imagen.
- Para agregar un enlace, haga clic en Vincular imagen y seleccione la ubicación del enlace correspondiente.
- En "Texto alternativo", ingrese el texto requerido si el campo lo proporciona.
- En “Párrafo”, ingrese el texto deseado.
Haga clic en el widget y seleccione la pestaña Diseño para ajustar las propiedades de fuente e imagen.
Agregue una cuenta regresiva en tiempo real a su sitio para aumentar la participación y crear urgencia, resaltando el tiempo limitado restante para ventas, eventos y promociones.
- Haga clic en el widget y seleccione la pestaña Contenido.
- Establezca la fecha en que finaliza la cuenta regresiva en el campo provisto.
- Establezca la hora de finalización de la cuenta regresiva en el campo correspondiente. Introduzca una hora específica, por ejemplo, las 23:45, si es necesario.
- Seleccione una zona horaria en el menú desplegable.
- En " mensaje de fin de tiempo", ingrese el mensaje que aparecerá cuando finalize la cuenta regresiva en el campo de texto.
- Seleccione Mostrar contador en 0000 y mensaje debajo de él o Quitar contador y mostrar solo mensaje.
- En "Título", introduzca el texto necesario para la cuenta regresiva en el campo correspondiente. Para ocultar el título, haga clic en .