Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Funciones especiales de la Página de Productos

Todos los sitios de Squarespace admiten páginas de productos (llamadas páginas de tienda en la versión 7.1) donde puedes mostrar y vender productos. Algunos sitios tienen funciones adicionales, como vista rápida, zoom de imagen y efectos de desplazamiento, que se muestran cuando los compradores colocan el cursor sobre las imágenes de los productos. Esta guía explica estas funciones y dónde están disponibles.

Funciones por versión

Las funciones disponibles dependen de la versión de Squarespace en la que se encuentre tu sitio.

Para la versión 7.0, estas opciones están disponibles en las familias de plantillas de Brine, Farro, Galapagos, Skye, Tremont y York. Para obtener información sobre todas las plantillas, visita Tipos de página de productos.

  Versión 7.1
Versión 7.0
Vista rápida
  • Bloques de Producto
  • Bloques de resumen
  • Página de la tienda
  • Bloques de Producto
  • Página de Productos
  • Bloques de resumen
Ampliar imagen
  • Páginas de detalles del producto
  • Lightbox de vista rápida
  • Páginas de detalles del producto
  • Lightbox de vista rápida
Efectos al posicionar el cursor sobre el elemento
  • Imagen alternativa en las páginas de la tienda
Listas de espera
  • Sí 
  • Sí (no disponible en Galapagos)

Ampliar imagen

Con Zoom de imagen, los clientes pueden ampliar las imágenes de los productos para ver más de cerca el material, la textura y los detalles más finos. Puedes configurar el zoom para activarlo al desplazar el cursor o al hacer clic en la imagen.

Zoom de imagen está disponible en:

image-zoom.gif

Activar la Ampliación de imagen

La forma de habilitar Zoom de imagen depende de la versión del sitio.

Para permitir la ampliación de imágenes: 

  1. En la página de detalles del producto, haz clic en Editar diseño en la esquina superior izquierda. 
  2. Haz clic en el menú desplegable de acción de desplazamiento
  3. Selecciona Zoom.

Para habilitar Zoom de imagen:

  1. En una página de detalles del producto, ve al menú de inicio, haz clic en Diseño y, a continuación, haz clic en Estilos del sitio.
  2. Desplázate hacia abajo hasta la sección Productos: Ampliar imagen. (En Galapagos, desplázate hasta la sección Productos).
  3. Marca Habilitar Ampliar imagen.
  4. Para seleccionar el nivel de ampliación, configura el control deslizante del Factor de ampliación entre 1 y 5. (En Galapagos, es el Factor de ampliación de imagen).
  5. Para elegir que la imagen tenga zoom tan pronto como el cursor se mueva sobre ella, establece Zoom se activa en: al hacer clic o desplazar el cursor (en Galapagos, el zoom siempre se activa al desplazar el cursor).

Más ayuda con Ampliar imagen

  • Ampliar imagen muestra una versión más grande de la imagen. Técnicamente no amplía un archivo de imagen.
  • Zoom de imagen no está disponible en dispositivos móviles.
  • Para obtener los mejores resultados, da formato a la imagen del producto para que se muestre en la web antes de subirla.
  • Las imágenes con fondos transparentes (.png) mostrarán las imagen original detrás de la versión ampliada.
  • En la versión 7.1, no está disponible la función de Ampliar imagen para las galerías de productos con diseño de carrusel.

Vista rápida

Con la vista rápida, los clientes pueden presionar un botón para ver los detalles del producto en una lightbox sin salir de la página actual. La Vista rápida alienta a los clientes a interactuar con tu tienda y a examinar más productos.

El Botón de Vista rápida puede aparecer en estos lugares:

  • Bloques de resumen
  • Bloques de Producto
  • Páginas de productos (llamadas páginas de tienda en la versión 7.1)

El botón aparece cuando se posiciona el cursor sobre el producto. La lightbox de Vista rápida incluye los detalles del producto, las imágenes y un vínculo a Ver el artículo completo que dirige a la página de ese artículo.

Product_Block_with_Quick_View.png

Añadir botones de Vista rápida

Puedes habilitar la Vista rápida por Página de Productos y por bloque. Si tienes varias Páginas de Productos o bloques, añade botones a cada uno de ellos.

Para añadir una Vista rápida a un Bloque de productos:

  1. En el Editor de bloque de productos, elige un producto que desees mostrar.
  2. Marca Habilitar Vista rápida.
  3. Haz clic en Apply (Aplicar) para guardar tus cambios.
  4. Guarda tus cambios en la página. 

Para añadir una Vista rápida a un Bloque de sumario:

  1. En el editor de bloque de sumario, comprueba que se haya seleccionado una página de productos en la pestaña Contenido.
  2. Haz clic en la pestaña Mostrar.
  3. Marca Habilitar Vista rápida.
  4. Haz clic en Aplicar para guardar tus cambios. El botón Vista rápida aparecerá sobre todas las miniaturas de los productos que estén en el bloque.
  5. Guarda tus cambios en la página.

Para añadir una Vista rápida a una Página de Productos:

  1. Abre la configuración de la página.
  2. Haz clic en Avanzadas y en Vista rápida y, a continuación, activa la opción Habilitar vista rápida.
  3. Si tienes varias Páginas de productos, repite estos pasos para cada una de ellas.

Modificar el estilo de botones y lightbox (solo versión 7.0)

Después de habilitar la Vista rápida, aparecen nuevas secciones en el Panel de estilos del sitio. Las configuraciones de Estilo se aplican a todo el sitio para crear un aspecto uniforme.

  1. En el Menú de Inicio, haz clic en Diseño y, luego, en Estilos del sitio.
  2. En la sección Productos: Botón de vista rápida, personaliza el estilo, el color, la fuente, el relleno, la posición y el tamaño del botón de Vista rápida. 
  3. En la sección Productos: Lightbox de Vista rápida, personaliza el aspecto de la lightbox. 
Consejo: si el texto de la vista rápida tiene problemas de formato, prueba agregando los detalles del producto como texto sin formato.

Más ayuda para la Vista rápida

  • La Vista rápida no está disponible en los dispositivos móviles.
  • El texto del botón de "Vista rápida" no puede personalizarse en este momento.
  • Las imágenes del producto aparecen como un cuadro recortado en Vista rápida.
  • Las descripciones de productos aparecen en Vista rápida sin formato especial, incluido el estilo de encabezado, negrita, cursiva, listas con viñetas o saltos de línea.

Efectos al posicionar el cursor sobre el elemento

Los efectos de desplazamiento muestran información o crean movimiento al mover el cursor sobre una imagen de producto, lo cual añade interacción y animación a tu tienda. Las opciones de desplazamiento disponibles en el sitio dependen de la versión del sitio.

Todas las páginas de la tienda muestran una imagen de producto alternativa al desplazarse cuando un producto tiene más de una imagen.

Las familias de plantillas Brine, Farro, Skye, Tremont y York (con páginas de productos avanzados) tienen tres opciones:

  • Imagen alternativa
  • Difuminar
  • Superposición de información del producto

Puedes mostrar los nombres y precios de los productos sobre una superposición de color al desplazarte por estas familias de plantillas (con páginas de productos clásicos):

  • Adirondack, Avenue, Aviator, Bedford, Five, Flatiron, Forte, Ishimoto, Momentum, Montauk, Native, Pacific, Wells, Wexley

Dos plantillas tienen opciones exclusivas de posicionamiento del cursor:

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 17 de 64
Funciones especiales de la Página de Productos