Personaliza imágenes y fondos en Ventas en línea Square
Las imágenes son un elemento crucial de cualquier sitio web. Pueden agregar un toque personal, vender más artículos y mejorar la experiencia completa de tu presencia en línea. En el editor del sitio de Ventas en línea Square, la mayoría de las acciones incluyen una opción de imágenes para que personalices, incluido lo siguiente:
Cargar varias imágenes con una sección Galería de imágenes y elegir entre diferentes estilos de diseño, como galerías estáticas, presentación de diapositivas y mucho más.
Conectar la cuenta de Instagram con una sección Canal de Instagram para que puedas sincronizar y mostrar las imágenes de las redes sociales en línea.
Mostrar los artículos y las categorías principales con una sección de artículos destacados para que los clientes puedan hacer el pedido o comprar rápidamente.
Las secciones de imagen y texto generales te permiten agregar distintas formas de contenido, con opciones de personalización adicionales.
La mayoría de las otras secciones te permiten agregar una imagen de fondo.
Nota: También puedes agregar imágenes de artículo y categoría a Ventas en línea Square directamente en el editor.
Obtén más consejos para administrar todas las imágenes (las de fondo y las que no lo son) para tu sitio de Ventas en línea Square.
Imágenes que no son de fondo vs. imágenes de fondo
Al trabajar con imágenes en el editor del sitio, verás estos dos tipos principales:
Imágenes que no son de fondo: estas imágenes forman parte del contenido añadido que aparece en el sitio junto con el texto. Suele ser posible hacer clic con el botón derecho y copiarlas o abrirlas en una nueva pestaña del navegador. También puedes considerarlas imágenes de frente.
Imágenes de fondo: estas imágenes no forman parte del contenido principal que aparece en el sitio, sino que están en el fondo (o detrás) del texto y las imágenes que no son de fondo. Se pueden considerar parte del diseño o estilo del sitio y no se puede hacer clic con el botón derecho sobre ellas para copiarlas o abrirlas en una nueva pestaña del navegador.
Agrega una sección con una opción de imagen en tu sitio
Para agregar una imagen a tu sitio, el primer paso es abrir el Editor del sitio de Ventas en línea Square y elegir o crear una página a la que quieras agregar las imágenes. Luego, selecciona +Agregar> Sección para abrir el menú de secciones.
La mayoría de las secciones en la categoría Organizar incluyen una imagen que no es de fondo. Selecciona cualquier sección para ver cómo luce en tu página. También puedes agregar otras secciones y editar la imagen de fondo. Cuando encuentres una que te gusta, selecciona Agregar para agregarla a tu página.
Agregar una imagen a tu sección
Para agregar imágenes a tu sección, sigue estos pasos:
Imagen que no es de fondo: debajo de la opción de la imagen en el panel de edición, selecciona Agregar imagen.
Imagen de fondo: en Personalizar > Imagen de fondo en el panel de edición, elige Imagen en el menú desplegable y selecciona Agregar imagen.
Cualquiera de estas opciones abrirá la ventana emergente del administrador de recursos, que te permitirá seleccionar o cargar tus imágenes.
Nota: Accede a opciones de fotos premium al cambiar el plan de tu sitio de Ventas en línea Square.
Existen varias opciones para agregar una imagen desde la ventana emergente del administrador de activos:
- Selecciona Mis imágenes para ver todas las imágenes generales cargadas en los sitios web de tu cuenta de Square. Si tienes más de un sitio, usa el menú desplegable Sitio para moverte de uno a otro.
- Selecciona Mis logotipos para ver todas las imágenes de logotipos cargadas en los sitios web de tu cuenta de Square. Si tienes más de un sitio, usa el menú desplegable Sitio para moverte de uno a otro.
- Selecciona Fotos premium para acceder a más de 100 millones de fotos de calidad premium y sin regalías (se requiere un cambio de plan).
- Selecciona Instagram para conectar tu cuenta de Instagram y usar las fotos de tu perfil en el sitio.
Para cargar una nueva imagen, ve a Mis imágenes o Mis logotipos en el administrador de activos y selecciona el enlace para elegir un archivo de tu dispositivo. Puedes cargar los siguientes tipos de archivos de imagen:
- JPG
- PNG
- GIF
Para obtener recomendaciones para las imágenes que aparecen en tu sitio de Ventas en línea Square, consulta las pautas generales que se indican a continuación.
Imágenes que no son de fondo:
- La mejor forma de agregar imágenes que no son de fondo a cualquier página de tu sitio es usando imágenes en formato JPEG que no tengan más de 1,000 píxeles en su lado más largo.
- Para obtener imágenes de alta calidad, te sugerimos utilizar un sitio de hosting de fotos creado para fotógrafos (como Flickr.com) e insertar las imágenes en tu sitio desde allí. No diseñamos imágenes más grandes, sin comprimir y de alta calidad porque necesitamos alojar millones de imágenes para millones de usuarios. Como resultado, el servicio de hosting de imágenes de terceros puede ser una mejor manera de asegurarte de que no se pierda la calidad de tu imagen.
Imágenes de fondo:
- Para imágenes que forman parte del diseño de tu sitio (p. ej., imágenes de encabezado, cartel y fondo), recomendamos usar una imagen que sea de al menos 2,000x1,000 píxeles. Esto hace que la imagen sea lo suficientemente grande como para que se vea bien en tamaño completo en prácticamente cualquier tamaño de pantalla.
Edita los grupos de la sección
Algunos diseños de sección te permiten copiar partes de la sección denominadas Grupos para que puedas agregar más contenido e imágenes sin tener que agregar otra sección a la página. En Grupo, en el panel de edición, verás una lista de los grupos actuales de la sección.
Para insertar un nuevo grupo de imagen y texto con el texto predeterminado, selecciona Agregar grupo. Para copiar un grupo existente, selecciona "..." > Duplicar. Los grupos nuevos o duplicados aparecerán en la lista en el panel de edición. Puedes reorganizar los grupos de la página si arrastras el grupo a un nuevo lugar de la lista.
Edita imágenes que no son de fondo
Para editar una imagen que no es de fondo en el sitio de Ventas en línea Square, sigue estos pasos:
- En el editor de sitios de Ventas en línea Square, ve a la página que tenga la imagen que deseas editar.
- Selecciona la sección con la imagen y, luego, selecciona la imagen para ver las opciones que aparecen en el panel de edición.
- Selecciona Editar para configurar las opciones disponibles según sea necesario. Si no te satisfacen tus cambios, selecciona Revertir a la imagen original.
- Haz clic en Guardar para guardar tus cambios y, luego, en Publicar para que se apliquen al sitio.
Nota: Según el diseño de la sección, verás más o menos opciones de edición de imagen.
Para cargar una imagen diferente, selecciona Reemplazar en el panel de edición. Puedes seleccionar el ícono de la papelera si quieres eliminar la imagen. Si cambias de opinión, usa la flecha deshacer para regresar un paso atrás.
En el panel de edición, puedes además agregar un enlace o texto alternativo a la imagen para mejorar la SEO y la accesibilidad web. Obtén más información sobre cómo agregar un enlace a tu sitio y cómo optimizar las páginas de tu sitio web para la SEO.
Nota: La accesibilidad web es un aspecto importante en el diseño de un sitio web que es accesible para la mayor cantidad de personas posible, sobre todo para aquellas que tengan una discapacidad o disfunción. Obtén más información sobre la accesibilidad web para sitios de Ventas en línea Square para conocer más consejos sobre la accesibilidad de las imágenes.
Con tantas soluciones alternativas, puede resultar prácticamente imposible proteger al máximo una imagen en Internet. Sin embargo, sí tienes la opción de usar páginas protegidas por contraseña en tu sitio de Ventas en línea Square para proteger tu contenido.
También puedes desactivar el clic derecho en tu sitio en algunos navegadores para evitar que las personas copien tus fotos fácilmente. Ten en cuenta que esto no brinda una protección total, pero ayuda a disuadir algunos esfuerzos. Para desactivar el clic derecho en tu sitio, sigue estos pasos:
- En la Vista general de Ventas en línea Square, ve a Ajustes > Herramientas de seguimiento.
- Selecciona Agregar nuevo código.
- En la ventana emergente, ingresa el nombre del código y el código mismo en los campos correspondientes (ve el código a continuación).
- Coloca el código en el pie de página al seleccionar Final del cuerpo.
- Selecciona Guardar.
- Haz clic en Publicar en el editor de sitios de Ventas en línea Square para que se apliquen los cambios.
Código: <body oncontextmenu=”return false;”>
En lugar de proteger las imágenes de esta manera, muchas personas con imágenes en línea (p. ej., fotógrafos) optan por utilizar programas de gráficos para agregar una marca de agua o sello en la versión en línea de sus fotos. Aunque esto no evita el robo de las fotos, sí las protege de un uso malintencionado, ya que, en la mayoría de los casos, la marca de agua inutiliza la foto.
Edita imágenes de fondo
Puedes mejorar la legibilidad de una sección en Ventas en línea Square si ajustas la oscuridad o el brillo de la imagen de fondo. Las imágenes claras pueden verse más claras si se usa un color más oscuro para el texto, y las imágenes oscuras pueden verse más oscuras si se usa un color más claro para el texto. Para ajustar la legibilidad de una sección en el sitio de Ventas en línea Square, sigue estos pasos:
- En el editor de sitios de Ventas en línea Square, dirígete a la página que tenga la imagen de fondo que desees ajustar.
- Selecciona la sección con la imagen y dirígete a Personalizar > Fondo en el panel de edición.
- Selecciona Editar y mueve el deslizador para ajustar la legibilidad de la imagen.
- Haz clic en Guardar para guardar tus cambios y, luego, en Publicar para que se apliquen al sitio.
También puedes acercar y enderezar la imagen de fondo.
Para cargar una imagen diferente, selecciona “…” > Reemplazar en el panel de edición. Puedes seleccionar el ícono de la papelera si quieres eliminar la imagen. Si cambias de opinión, usa la flecha de deshacer para regresar un paso atrás.
Para cambiar la imagen de fondo de una sección a un color en Ventas en línea Square, haz lo siguiente:
- En el editor de sitios de Ventas en línea Square, dirígete a la página que tenga la imagen de fondo que desees ajustar.
- Selecciona la sección con la imagen y dirígete a Personalizar > Fondo en el panel de edición.
- En el menú desplegable, elige Tu color seleccionado para cambiarlo al color del sitio elegido o Color personalizado para cambiarlo a un color diferente.
Obtén más información sobre cómo elegir colores para tu sitio de Ventas en línea Square.
Opciones de imágenes del sitio para móviles
Aunque la versión móvil de tu sitio web se puede editar por separado de la versión de escritorio, tienes opciones de imágenes específicas para el sitio web móvil para lograr que tus imágenes se sigan viendo bien en todos los tamaños de pantalla. Tus opciones incluyen lo siguiente:
Puedes ajustar el punto focal de la imagen de fondo de una sección a fin de que el objeto de la imagen esté centrado en tu sitio de Ventas en línea Square para dispositivos móviles. Para comenzar, haz lo siguiente:
- En el editor de sitios de Ventas en línea Square, dirígete a la página que tenga la imagen de fondo que desees configurar para dispositivos móviles.
- Selecciona la sección con la imagen y dirígete a Personalizar > Fondo en el panel de edición.
- Selecciona “…” > Establecer objeto de la imagen.
- Coloca el punto indicador en el objeto principal de tu imagen de fondo. Esto te ayudará a asegurarte de que el objeto de tu foto esté siempre centrado en tu sitio para dispositivos móviles.
- Cuando termines, selecciona Guardar. Puedes cambiar a la vista para dispositivos móviles para comprobar los cambios. Ajusta el objeto nuevamente en la vista de escritorio según sea necesario.
- Haz clic en Publicar para que se apliquen los cambios.
Solución de problemas
Si cargaste varias imágenes a tu sitio de Ventas en línea Square con el mismo nombre de archivo, es posible que esas imágenes muestren varios comportamientos no deseados en tu sitio web. Por ejemplo, las imágenes pueden aparecer de repente en la página equivocada o saltearse espacios, o incluso no aparecer. Por eso, asegúrate de que cada imagen tenga su propio nombre de archivo antes de cargarla al editor del sitio. Esto ayudará a evitar este comportamiento en el futuro.
Si tienes este problema, puedes intentar los pasos siguientes para solucionarlo:
En el Editor del sitio de Ventas en línea Square, elimina todas las imágenes que se muestran mal.
En tu computadora o dispositivo, administra tus archivos de imagen y asegúrate de que todos los archivos tengan nombres diferentes.
En el editor del sitio, vuelve a cargar las imágenes a tu sitio web.
Haz clic en Publicar para que se apliquen los cambios.