Skip to content

Primeros pasos con Peek

  • WordPress 6.5 o posterior.
  • WooCommerce 8.0 o posterior, activo.
  • PHP 8.1 o posterior.

Peek no registra sus hooks del escaparate hasta que WooCommerce está disponible.

  1. Instala Peek desde el directorio de plugins de WordPress o sube la carpeta del plugin a wp-content/plugins/.
  2. Actívalo en Plugins.
  3. Ve a Peek en el escritorio de WordPress.
  4. Guarda los ajustes y abre una página de tienda o categoría en otra pestaña.

Empieza con estas decisiones:

  1. Activa la vista rápida.
  2. Escribe la etiqueta del botón, por ejemplo Vista rápida.
  3. Elige el estilo visual y la posición, debajo de la tarjeta o sobre la imagen.
  4. Define en qué archivos de productos se cargará.
  5. Marca las secciones que debe mostrar el diálogo.
  6. Decide si una pulsación sobre el fondo debe cerrarlo.

No necesitas editar una plantilla del tema. Peek se conecta a los hooks de bucle de WooCommerce y usa el formulario de compra nativo del producto.

Comprueba al menos un producto simple y uno variable:

  1. Abre la tienda sin iniciar sesión.
  2. Llega al botón con el teclado y pulsa Enter.
  3. Confirma que el foco entra en el diálogo y no sale de él al avanzar con Tab.
  4. Cierra con Escape y verifica que el foco vuelve al botón que abrió el modal.
  5. En el producto variable, selecciona todos los atributos y confirma que el precio, el stock y el botón responden como en la página del producto.
  6. Añade el producto al carrito.

Si el tema reemplaza por completo los hooks estándar del bucle, prueba el shortcode dentro de la plantilla o del maquetador:

[peek id="123" text="Ver producto" style="outline"]

Peek carga sus recursos sólo donde pueden usarse. Su script propio no necesita jQuery, se envía con defer y permanece en el pie. El soporte de variaciones procede de WooCommerce y puede añadir sus dependencias nativas cuando el diálogo las necesita.

El diálogo está oculto hasta la interacción, así que no desplaza el contenido visible. También respeta prefers-reduced-motion.

Esta documentación describe exclusivamente las funciones disponibles en la edición gratuita de Peek.