Crea una bonita experiencia visual en el sitio móvil al perfeccionar las imágenes transferidas desde la versión de escritorio, así como al personalizar las imágenes que agregues desde el editor móvil.
La personalización de las imágenes transferidas desde la computadora es limitada: puedes ajustar las opciones de la imagen, recortarla y agregarle animaciones divertidas. En cambio, tienes un control total sobre la personalización de las imágenes agregadas desde el editor móvil: puedes agregales filtros y marcos, personalizar lo que sucede cuando se selecciona una imagen e incluso agregar enlaces.
Más información sobre las imágenes:
Imágenes transferidas desde el escritorio
Las imágenes que agregas a la versión de escritorio del sitio se transfieren automáticamente al sitio móvil. Puedes personalizar las opciones de la imagen, recortarla y agregarle una animación para que sea diferente a la de la versión de escritorio.
Para personalizar las imágenes transferidas desde la computadora:
- Selecciona la imagen en el editor móvil.
- Según lo que quieras personalizar, haz lo siguiente:
Cambiar las opciones de la imagen
Personaliza la forma en la que los visitantes interactúan con las imágenes, así como lo que sucede cuando se cambia el tamaño de las mismas en diferentes dispositivos móviles.
Para cambiar las opciones de la imagen:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Opciones
. - Personaliza lo siguiente:
- Comportamientos de las imágenes: decide cómo interactúan los visitantes con las imágenes.
- Al hacer clic en la imagen:
- No pasa nada: no se puede seleccionar la imagen, no pasa nada cuando se hace clic en ella.
- Se abre un enlace: la imagen actúa como un botón y se puede vincular a una página, anclar en el sitio, una URL externa y más.
- Se abre en un pop-up: la imagen se abre en una ventana emergente.
- Puede agrandarse: decide qué sucede cuando se cambia el tamaño de las imágenes.
- Mantener proporciones: la imagen y forma permanecen en las proporciones originales cuando se redimensionan.
- Llenado automático: la imagen se ajusta automáticamente para llenar el espacio en el dispositivo del visitante.
Presenta una nueva versión de la imagen en la vista móvil al recortarla manualmente o con un recorte de forma.
Para recortar una imagen manualmente:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Recortar
. - Arrastra el control deslizante para acercar y alejar la imagen.
- Mueve la imagen para mostrar la parte que deseas.
- Selecciona Aplicar.
Para recortar una imagen con formas:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Recortar .
- Arrastra el control deslizante para acercar y alejar la imagen.
- Selecciona el icono Cortar forma
y elige una forma. - Selecciona Aplicar.
Agregar una animación de imagen
Agrega una animación divertida a la imagen en el móvil para darle vida al sitio.
Para agregar una animación:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Animación
. - Selecciona la animación que deseas aplicar.
- Selecciona Personalizar para ajustar la animación.
Imágenes agregadas desde el Editor móvil
Elige entre una variedad de tipos de imágenes para agregar al sitio directamente desde el editor móvil. Las imágenes agregadas dentro del editor móvil son totalmente personalizables. Ajusta las opciones y el diseño de la imagen, agrega filtros, recórtala e incluso agrega animaciones.
¿Qué tipos de imágenes están disponibles?
- Mis cargas: sube los propios archivos de imagen para usar en el sitio.
- Categorías: elige entre cientos de imágenes e ilustraciones de archivo disponibles en Wix, Shutterstock y Unsplash.
- En las redes sociales: conecta las cuentas de redes sociales para mostrar imágenes de plataformas como Facebook e Instagram.
Para agregar y personalizar imágenes solo para dispositivos móviles:
- Selecciona el icono Agregar al móvil
a la izquierda. - Selecciona Imágenes.
- Selecciona el tipo de imagen que deseas agregar.
- Selecciona la imagen que deseas cargar y selecciona Agregar a la página.
- Según lo que quieras personalizar, haz lo siguiente:
Cambiar las opciones de la imagen
Perfecciona lo que sucede cuando se selecciona la imagen, agrega un texto flotante o un texto alternativo para ayudar a Google a reconocerla. También puedes elegir lo que sucede con las imágenes cuando se cambian de tamaño.
Para configurar lo que sucede cuando se selecciona una imagen:
- Selecciona la imagen.
- Selecciona el icono Opciones .
- Selecciona el menú desplegable Al hacer clic en la imagen y elige una opción:
- No pasa nada: no pasa nada cuando se selecciona la imagen.
- Se abre un enlace: la imagen actúa como un botón y puede estar vinculada a una página, posición o ancla en el sitio, en una URL externa, un documento o en un email.
- Se abre en un pop-up: la imagen se abre en una ventana emergente.
- Puede agrandarse: el cursor se convierte en una lupa cuando un visitante lo pasa sobre la imagen. Al seleccionar la imagen, se amplía.
Para agregar texto alternativo a la imagen:
- Selecciona la imagen.
- Selecciona el icono Opciones .
- Ingresa el texto en el campo Cuéntale a Google que hay....
Para agregar un tooltip (texto flotante) a una imagen:
- Selecciona la imagen.
- Selecciona el icono Opciones .
- Ingresa el texto en el campo Texto flotante (tooltip).
Para cambiar el tamaño de las imágenes:
- Selecciona la imagen.
- Selecciona el icono Opciones .
- Desliza la palanca correspondiente para elegir qué sucede con las imágenes cuando se redimensionan.
- Mantener proporciones: la imagen y la forma permanecen con las proporciones originales cuando se redimensionan.
- Llenado automático: la imagen se ajusta automáticamente para rellenar el espacio.
Nota: El llenado automático solo puede funcionar después de habilitar la opción Mantener proporciones.
Agregar un diseño de marco de imagen
Cambia el diseño de la imagen y personaliza cómo se ve el marco de la misma en el sitio móvil.
Para personalizar el diseño del marco de la imagen:
- Selecciona la imagen.
- Selecciona el icono Diseño
. - Selecciona un diseño preestablecido o la opción Personalizar.
- Personaliza la imagen:
- Opacidad y color de relleno: selecciona los colores y la opacidad de la imagen.
- Borde: diseña los bordes de la imagen.
- Esquinas: redondea las esquinas de la imagen.
- Sombreado: diseña una sombra para la imagen.
Presenta una nueva versión de la imagen en la vista móvil al recortarla manualmente o con un recorte de forma.
Para recortar una imagen:
- Selecciona la imagen.
- Selecciona el icono Recortar .
- Arrastra el control deslizante para acercar y alejar la imagen.
- Mueve la imagen para mostrar la parte que deseas.
- Selecciona Aplicar.
Para recortar una imagen con formas:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Recortar .
- Arrastra el control deslizante para acercar y alejar la imagen.
- Selecciona el icono Cortar forma
y elige una forma. - Selecciona Aplicar.
Agrega filtros y animaciones
Transforma la imagen con uno de nuestros filtros y agrega una animación genial para darle vida al sitio móvil.
Para agregar un filtro:
- Selecciona la imagen.
- Selecciona el icono Filtros
. - Selecciona cualquier filtro para agregarlo a la imagen.
Para agregar una animación:
- En la vista móvil, selecciona la imagen.
- Selecciona el icono Animación .
- Selecciona la animación que deseas aplicar.
- Selecciona Personalizar para ajustar la animación.
Agregar un enlace a la imagen
Agrega enlaces a las imágenes para fomentar la interacción de los visitantes en el sitio.
Para agregar un enlace a una imagen:
- Selecciona el icono Enlace
. - Selecciona el tipo de enlace e ingresa los detalles.
- Selecciona Hecho.
Más información sobre los tipos de enlaces que puedes agregar a una imagen.
cuando se seleccionan.
