Volver a la página principal

Cómo personalizar imágenes y fondos de pantalla en Ventas en línea Square

Las imágenes son un elemento fundamental en cualquier página web. Pueden servir para aportar un toque personal, vender más artículos y, en general, para ofrecer una mejor presencia online. En el editor de Ventas en línea Square, la mayoría de las secciones incluyen una opción de imagen para personalizarla, que permite hacer lo siguiente:

  • Subir varias imágenes con la sección Galería de imágenes y elegir diferentes estilos de diseño, como galerías estáticas, diapositivas y más.

  • Conectar tu cuenta de Instagram con la sección Feed de Instagram para que puedas sincronizar y mostrar online tus imágenes de redes sociales.

  • Mostrar tus mejores artículos y categorías con una sección de artículos destacados para que los clientes puedan hacer pedidos o comprar rápidamente.

  • Desde las secciones generales de mensaje e imágenes, también puedes añadir distintos tipos de contenido, así como aprovechar otras opciones de personalización.

  • La mayoría de las otras secciones te permiten añadir una imagen de fondo.

Nota: También puedes añadir imágenes de artículo y categoría a Ventas en línea Square directamente en el editor.

Consulta más recomendaciones para la gestión de imágenes tanto de fondo como de otro tipo en tu página de Ventas en línea Square.

Imágenes que no se utilizan como fondo de la página e imágenes de fondo

Square-Online-Non-Background-vs-Background-Images-ES

Cuando trabajes con imágenes en el editor, te encontrarás con estos dos tipos principalmente:

  • Imágenes que no se utilizan como fondo de la página: Son las que forman parte del contenido añadido que se muestra en tu página, junto con el texto. Normalmente, pueden abrirse con el botón derecho del ratón y copiarse o abrirse en una nueva pestaña. Son como imágenes de primer plano.

  • Imágenes de fondo: No son parte del contenido principal que aparece en tu página, sino que están detrás de los textos y de las imágenes que no se usan como fondos. Son parte del diseño o estilo de la página y no se pueden abrir con el botón derecho. Tampoco pueden copiarse ni abrirse en una nueva pestaña.

Cómo añadir una sección con opción de imagen a tu página

Square-Online-Add-Section-with-Image-Option-ES

Para añadir una imagen a tu página, el primer paso es abrir el editor de Ventas en línea Square y elegir o crear una página a la que quieras añadir imágenes. A continuación, selecciona + > Sección para abrir el menú secciones.

La mayoría de las secciones de la categoría Organizar incluyen una imagen que no se usa de fondo. Selecciona cualquier sección para comprobar cómo queda en la página. También puedes añadir cualquier sección y editar la imagen de fondo. Cuando encuentres la que te guste, selecciona Añadir para incluirla en tu página.

Cómo añadir una imagen a una sección

Square-Online-Image-Asset-Manager-in-Editor-ES

Para añadir imágenes a tu sección:

  • Imágenes que no se utilizan como fondo de la página: En el panel de edición, en la opción de imagen, selecciona Añadir imagen.

  • Imágenes de fondo: En el panel de edición, en Personalizar > Imágenes de fondo, elige Imagen en el menú desplegable y selecciona Añadir imagen.

Cualquiera de estas opciones abre la ventana emergente del gestor de recursos para que puedas seleccionar y subir tus imágenes.

Cómo utilizar el gestor de recursos

Nota: Para usar opciones de fotos prémium, debes pasarte a un plan superior de Ventas en línea Square.

Hay varias formas de añadir una imagen desde la ventana emergente del gestor de recursos:

  • Ve a Mis imágenes para acceder a todas las que se han subido a la página web de tu cuenta de Square que tienes seleccionada. Si tienes más de una, usa el menú desplegable Página web para elegir la que quieras.
  • Ve a Mis logotipos para acceder a todos los que se han subido a la página web de tu cuenta de Square que tienes seleccionada. Si tienes más de una, usa el menú desplegable Página web para elegir la que quieras.
  • Selecciona Fotos prémium para acceder a más de 100 millones de fotos de calidad superior y libres de derechos (tras cambiar al plan superior).
  • Selecciona Instagram para conectar tu cuenta de la red social y usar las fotos de tu perfil en la página web.

Tipos de archivos de imagen compatibles

Para subir una nueva imagen, dirígete a Mis imágenes o a Mis logotipos en el gestor de recursos y selecciona el enlace para elegir un archivo de tu dispositivo. Puedes subir estos tipos de archivos de imagen:

  • JPG
  • PNG
  • GIF

Recomendaciones de imágenes

Si quieres descubrir algunos consejos sobre las imágenes que se muestran en tu página de Ventas en línea Square, lee las siguientes recomendaciones generales:

Imágenes que no son de fondo:

  • La mejor opción para las imágenes que añadas a tu página y que no sean de fondo es utilizar JPEG que no superen los 1000 píxeles en el lado más largo.
  • Para obtener imágenes de alta calidad, te recomendamos que utilices un depósito de fotos profesionales (por ejemplo, Flickr.com) y que insertes desde allí las imágenes en tu página. Los diseños de Square no están pensados para imágenes de gran tamaño, sin comprimir y de alta calidad, porque tenemos que alojar millones de imágenes de millones de negocios y creadores. Por lo tanto, si quieres garantizar que la calidad de tus imágenes no disminuya, te recomendamos que recurras a un servicio web de alojamiento de imágenes externo.

Imágenes de fondo:

  • Para las imágenes que forman parte del diseño de la página (p. ej., las de los encabezados, los banners y los fondos), te recomendamos usar un archivo que tenga, como mínimo, 2000 x 1000 píxeles. Esta resolución será suficiente para conseguir una imagen nítida que ocupe el ancho de cualquier pantalla.

Cómo editar la sección de grupos

Algunos diseños permiten copiar partes de la sección Grupos para añadir más contenido e imágenes sin necesidad de añadir secciones nuevas a la página. En el panel de edición, ve al menú Grupo para consultar la lista de los que hay disponibles en la sección.

Para insertar un nuevo grupo de texto e imagen con el texto predeterminado, selecciona Añadir grupo. Para copiar un grupo existente, selecciona ••• > Duplicar. Los grupos nuevos o duplicados aparecerán en la lista del panel de edición. Para reordenar los grupos en la página, haz clic en uno y arrástralo a un nuevo lugar en la lista.

Cómo editar las imágenes que no se utilizan como fondo

Square-Online-Edit-Non-Background-Image-ES

Editar las imágenes que no se utilizan como fondo

Para editar una imagen que no se utiliza como fondo en tu página de Ventas en línea Square:

  1. Desde el editor de Ventas en línea Square, accede a la página que contiene la imagen que quieres modificar.
  2. Selecciona la sección con la imagen y selecciona la propia imagen para ver las opciones que aparecen en el panel de edición.
  3. Selecciona Editar para ajustar las opciones disponibles según sea necesario. Si no te gustan los cambios, selecciona Volver al original.
  4. Pulsa Guardar para actualizar tus modificaciones y Publicar para ver los cambios en tu página.

Nota: Según el diseño de la sección, podrás ver más o menos opciones de edición de imagen.

Reemplazar y eliminar las imágenes que no se utilizan como fondo

Para subir una foto distinta, selecciona Reemplazar en el panel de edición. Si quieres eliminar la imagen, selecciona el icono de la papelera. Si cambias de opinión, puedes usar la flecha hacia atrás para deshacer la acción.

Añade enlaces y texto alternativo a las imágenes que no se utilizan como fondo

Puedes añadir un enlace a la imagen o texto alternativo en el panel de edición para mejorar la accesibilidad de la web o el SEO. Descubre cómo añadir un enlace a tu página y cómo optimizar tus páginas web para el SEO.

Nota: la accesibilidad web es un aspecto importante a la hora de diseñar una página web que sea accesible para la mayoría de personas, sobre todo para las personas con discapacidad. Descubre más información sobre accesibilidad web para páginas de Ventas en línea Square para ver consejos de accesibilidad en imágenes.

Añade protección con el botón derecho a las imágenes que no se utilizan como fondo

Con tantos métodos por ahí, puede ser prácticamente imposible proteger completamente una imagen en Internet. Tienes la opción de usar páginas protegidas con contraseña en tu página de Ventas en línea Square para proteger tu contenido.

También puedes desactivar el botón derecho del ratón en tu sitio en algunos navegadores para evitar que la gente copie fácilmente tus imágenes. Ten en cuenta que esto no ofrece una protección total, pero ayuda a frenar algunos intentos. Para desactivar el botón derecho del ratón en tu página web:

  1. En la Vista general de Ventas en línea Square, ve a Ajustes > Herramientas de seguimiento.
  2. Selecciona Añadir un código nuevo.
  3. En la ventana emergente, escribe el nombre del código y el código en sí en los campos correspondientes (consulta el código más abajo).
  4. Introduce el código a pie de página seleccionando Fin del contenido.
  5. Selecciona Guardar.
  6. Publica tu página desde el editor de Ventas en línea Square para ver los cambios al instante.

Código: <body oncontextmenu=”return false;”>

En lugar de proteger las imágenes de esta manera, muchas personas con imágenes en línea (por ejemplo, fotógrafos) optan por utilizar programas gráficos para añadir una marca de agua en la versión en línea de sus fotos. Aunque esto no impide que la foto sea robada, sí la protege de un uso malintencionado, ya que, en la mayoría de los casos, la marca de agua inutiliza la foto.

Cómo editar las imágenes de fondo

Square-Online-Edit-Background-Image-ES

Editar las imágenes de fondo

Para que las secciones de Ventas en línea Square se vean mejor, puedes ajustar la iluminación de la imagen de fondo. Las imágenes claras se verán más claras cuando el texto predeterminado sea de color más oscuro, y las imágenes oscuras se verán más oscuras si el texto es de color más claro. Para ajustar la legibilidad, haz lo siguiente:

  1. En el editor de Ventas en línea Square, ve a la página con la imagen de fondo que quieras modificar.
  2. Selecciona la sección que tenga la imagen y accede a Personalizar > Fondo en el panel de edición.
  3. Selecciona Editar y ajusta la legibilidad de la imagen moviendo el control deslizante.
  4. Pulsa Guardar para actualizar tus modificaciones y Publicar para ver los cambios en tu página.

También puedes ampliar y cuadrar la imagen de fondo según sea necesario.

Reemplazar y eliminar las imágenes de fondo

Para subir una foto distinta, selecciona «…» > Reemplazar en el panel de edición. Si lo que quieres es eliminar una imagen, selecciona el icono de la papelera. Si cambias de opinión, puedes usar la flecha hacia atrás para deshacer la acción.

Cambiar la imagen de fondo por un color

Para cambiar la imagen de fondo por un color en Ventas en línea Square, haz lo siguiente:

  1. En el editor de Ventas en línea Square, ve a la página con la imagen de fondo que quieras modificar.
  2. Selecciona la sección que tenga la imagen y accede a Personalizar > Fondo en el panel de edición.
  3. En el menú desplegable, elige Color seleccionado para usar el que tú has elegido o Color personalizado para cambiar a otro.

Consulta más información sobre cómo elegir colores para tu página de Ventas en línea Square.

Cómo editar los vídeos de fondo

Nota: Pásate a un plan superior de Ventas en línea Square para poder utilizar un vídeo como fondo.

Además de GIF de alta calidad, también puedes subir tus propios vídeos como fondo para añadir animaciones al contenido. Para empezar, selecciona la sección de imagen de cabecera en tu página web y elige Vídeo como opción de fondo en el panel de edición. Desde aquí, podrás reemplazar o eliminar el archivo de vídeo en cualquier momento. También puedes modificar el momento en que se inicia y finaliza la reproducción, así como su velocidad.

Nota: El almacenamiento máximo para archivos de vídeo es de 20 GB.

También puedes añadir a tu página web vídeos con sonido y otras funciones, que no sean vídeos de fondo. Puedes hacerlo con YouTube u otros sistemas para alojar vídeos, o bien usar tus propios archivos. Obtén más información sobre cómo incluir vídeos en tu página web.

Opciones de imagen en la página del móvil

Aunque la versión móvil de tu página web no se puede editar de manera separada de la versión de ordenador, tienes opciones específicas para la primera que harán que todas las imágenes queden bien en cualquier pantalla. Estas son las opciones:

Ajustar el punto focal de la imagen para páginas web de Ventas en línea Square para dispositivos móviles

Para que el tema de la imagen esté centrado en la página del móvil de Ventas en línea Square puedes ajustar el punto focal en la sección del fondo de una imagen. Para empezar:

  1. En el editor de Ventas en línea Square, ve a la página con la imagen de fondo que quieras modificar.
  2. Selecciona la sección con la imagen y ve a Personalizar > Fondo en el panel de edición.
  3. Selecciona “…” > Definir el tema de la imagen.
  4. Coloca el punto indicador en el sujeto principal de tu imagen de fondo. Así te asegurarás de que el sujeto de tu foto esté siempre centrado en tu sitio móvil.
  5. Selecciona Guardar cuando hayas terminado. Puedes comprobar el sitio móvil con este cambio accediendo a la vista móvil. Vuelve a ajustarlo en la vista de escritorio si es necesario.
  6. Publica tu página para que se apliquen los cambios.

Solucionar problemas

Si has subido varias imágenes con el mismo nombre de archivo a tu sitio de Ventas en línea Square, es posible que surjan diversos problemas en tu sitio web. Por ejemplo, las imágenes podrían aparecer de repente en otra página o cambiar de lugar, o incluso desaparecer. Por ello, debes asegurarte de que cada una tenga su propio nombre de archivo antes de subirla al editor para evitar que esto suceda en el futuro.

Si tienes este problema, prueba los pasos siguientes para solucionarlo:

  1. En el editor de Ventas en línea Square, borra todas las imágenes que se muestran incorrectamente.

  2. En tu ordenador o dispositivo, comprueba que todos los archivos de imagen tengan nombres únicos.

  3. En el editor, vuelve a subir las imágenes a tu sitio web.

  4. Selecciona Publicar para que se apliquen los cambios en tu página.