Bloques de tienda: cuadrícula de productos, producto, carrito y pago

Muestra tus productos y recibe pedidos con los bloques de tienda: cuadrícula de productos, producto individual, página de producto, carrito, pago y reseñas, y qué hace cada ajuste.

Los bloques de tienda muestran lo que vendes y permiten que los compradores lo adquieran. Están en el grupo Tienda del panel izquierdo. Los productos en sí se gestionan en el panel de tu sitio, no en el editor. Los bloques solo los muestran, así que cuando cambias un precio o añades un producto, se actualizan todos los bloques que lo muestran.

Los bloques de tienda de un vistazo

BloqueQué muestra
Cuadrícula de productosVarios productos en una cuadrícula, como tu página de la tienda o una fila de los más vendidos.
Producto individualUn producto en forma de tarjeta, para destacarlo en cualquier sitio.
Página de productoLa página completa de un producto: fotos, precio, descripción y el botón de añadir al carrito.
CarritoLo que ha elegido el comprador, con un total y un botón de finalizar compra.
PagoEl formulario donde el comprador introduce sus datos y paga.
ReseñasLas valoraciones y reseñas de un producto.

Tu sitio ya tiene una página de carrito y una página de pago, cada una con su bloque colocado, y un diseño compartido para las páginas de producto. Rara vez necesitas añadir tú mismo el bloque de carrito, de pago o de página de producto.

Cuadrícula de productos

Arrastra una Cuadrícula de productos a una página y haz clic en ella para abrir sus ajustes.

La cuadrícula de productos Bestsellers seleccionada en el editor, con sus ajustes Categoría, Orden, Cuántos mostrar y otros en el panel de ajustes

En General:

  • Categoría limita la cuadrícula a una categoría, o muestra Todos los productos.
  • Orden ordena los productos: Como están colocados, Más recientes primero, Nombre de la A a la Z, Precio, de menor a mayor o Precio, de mayor a menor.
  • Cuántos mostrar limita el número de productos. Con Todos, aparecen todos los productos.
  • Filtros para el comprador añade botones para que los compradores reduzcan la cuadrícula Por categoría, Por etiqueta o Por categoría y etiqueta.
  • Productos por página divide una cuadrícula larga en páginas. Con Todos en una página, no hay paginación.
  • Ir al pago después de añadir al carrito lleva a los compradores directamente al pago cuando añaden algo. Déjalo desactivado si la mayoría de los compradores compra más de un artículo.
  • Abrir los productos en una ventana emergente muestra un producto en una ventana emergente para que los compradores no pierdan su sitio en la cuadrícula. Si está desactivado, al hacer clic en un producto se abre su propia página. Flechas entre productos y los dos colores de las flechas se aplican a esa ventana emergente.

En Apariencia, define el Número de columnas, la Separación de la cuadrícula y la Forma de la imagen. Activa o desactiva Mostrar el precio, Mostrar la categoría y Mostrar «añadir al carrito», cambia el Texto del botón y define el Fondo de la tarjeta y el Color del texto de la tarjeta.

La página Shop de la tienda publicada, con botones de filtro por categoría sobre una fila de fotos de productos

Para organizar los productos, consulta Organiza tus productos con categorías y etiquetas. Para convertir una página en tu tienda, consulta Configurar la página de tu tienda.

Producto individual

Usa Producto individual para poner un artículo en cualquier página, como tu página de inicio. Elígelo en Producto. Puedes cambiar la Forma de la imagen, mostrar u ocultar el precio y el botón de añadir al carrito, cambiar el Texto del botón y definir los colores de la tarjeta.

Página de producto

Diseñas una sola vez la página que comparten todos los productos. En la lista de páginas de la parte superior del editor, elige Plantilla de producto. Muestra tu primer producto como ejemplo, pero todo lo que cambies se aplica a todos ellos.

La plantilla de producto en el editor, con la Stoneware Mug, su foto, su precio, su descripción y el botón Add to cart

Haz clic en el bloque Página de producto para activar o desactivar partes: Galería de fotos, Descripción, SKU y Reseñas. También puedes cambiar el Texto del botón. En Enlace para volver, elige a dónde lleva el enlace que hay encima del producto y qué dice. De forma predeterminada lleva a tu página de la tienda. Para más detalles, consulta Cómo funcionan las páginas de producto.

Carrito

El bloque Carrito está en tu página de carrito. Sus ajustes son el Encabezado, el Mensaje de carrito vacío, Mostrar el total y el Texto del botón de finalizar compra, además de los colores de fondo y de texto. El carrito de un comprador se guarda en su propio navegador hasta que finaliza la compra.

El icono del carrito de tu encabezado abre un panel de carrito en la misma página, así que los compradores rara vez tienen que salir de lo que están viendo.

El panel del carrito en la tienda publicada, con un producto, su precio y su cantidad, un total y un botón Checkout

Pago

El bloque Pago es tu página de pago. Muestra a la izquierda los datos del comprador y a la derecha su pedido, el código de descuento que haya y los botones de pago.

El bloque Checkout seleccionado en el editor, con su formulario de datos, el resumen del pedido y los botones de pago, y sus ajustes en el panel

En General:

  • Encabezado es el título que hay encima del formulario.
  • Pedir una dirección de envío añade los campos de dirección, ciudad, provincia o estado, código postal y país. Las zonas de envío y los impuestos según la ubicación usan la dirección para calcular la tarifa, así que déjalo activado si los has configurado.
  • Pedir un número de teléfono y Permitir notas en el pedido añaden esos campos opcionales.
  • Mostrar el menú del sitio y Mostrar el pie de página están desactivados de forma predeterminada, para que los compradores vean solo tu logotipo y se centren en pagar. Activa cualquiera de los dos para volver a mostrarlo.

Los demás grupos dan estilo a la página:

  • Botón de tarjeta cambia el texto, los colores y el icono del botón de tarjeta de crédito.
  • Botón de PayPal ofrece los textos y colores propios de PayPal. PayPal no permite nada más en un botón que lleva su nombre.
  • Ambos botones define el radio de las esquinas, el tamaño, la disposición (Apilado o En paralelo) y cuál de los botones va primero.
  • Código de descuento define el tamaño del cuadro del código. El cuadro solo se muestra mientras tengas un código que los compradores puedan usar.
  • Nota bajo los botones activa o desactiva una línea de tranquilidad, te permite escribir la tuya y define su alineación.

Los botones de pago aparecen cuando Stripe o PayPal están conectados. Consulta Cómo funciona el proceso de pago.

Reseñas

El bloque Reseñas muestra las valoraciones y las reseñas escritas de un producto. Elígelo en Producto, ponle un Encabezado y activa o desactiva Mostrar el resumen de valoraciones y Permitir que los clientes escriban reseñas. Las reseñas se cargan cuando alguien visita la página, así que las nuevas aparecen sin volver a publicar. Solo los clientes que han iniciado sesión pueden escribir una. Las páginas de producto ya incluyen reseñas, así que usa este bloque cuando las quieras en otro sitio. Consulta Recoge y modera las reseñas de productos.

Artículos relacionados

Last updated 2026-10-03