Provedly se instala en Webflow a través del cuadro Footer code de Site settings, y lleva más o menos un minuto. El widget se muestra en un Shadow DOM, así que ignora tus clases de Webflow y tus clases de Webflow lo ignoran a él. La parte que requiere pensar es la de los datos: Webflow Ecommerce no te da un webhook de Stripe que puedas apuntar a Provedly, así que los pedidos llegan al widget a través de la Records API o de un CSV y llevan la etiqueta "Imported".
Instalación en Site settings
- En el panel de Provedly, crea un widget y copia el token.
- En Webflow, abre Site settings y luego Custom code.
- Pega la etiqueta en el cuadro Footer code y publica.
<script
src="https://provedly.app/w/widget.js"
data-token="pp_your_token"
async
defer
></script>
El código personalizado requiere un plan de sitio de Webflow; el dominio de pruebas gratuito sin plan no lo incluye. Añade tanto tu dominio propio como tu dominio de pruebas webflow.io en los dominios permitidos del sitio en Provedly; si no, el endpoint de configuración no responderá en el dominio de pruebas y pensarás que la instalación falló.
Si prefieres que el widget no aparezca en ciertas páginas, no uses código personalizado por página. Pon la etiqueta en todo el sitio y configura la segmentación por URL en Provedly ("todas excepto" /checkout, /order-confirmation). Así hay una sola fuente de verdad.
Cómo comprobar la instalación
Publica, abre la URL de pruebas en una ventana privada y espera unos segundos. Si no aparece ninguna notificación, las causas habituales son, por orden: el dominio no está en los dominios permitidos, el widget todavía no tiene registros o la página está excluida por la segmentación por URL. Un widget con cero registros no muestra nada, así que publica un registro de prueba por la API o importa un CSV corto antes de concluir que la instalación está rota.
Cómo añadir una barra CTA
Las barras usan un cargador aparte con el mismo método de instalación:
<script
src="https://provedly.app/w/cta.js"
data-token="pp_your_bar_token"
async
defer
></script>
La posición fija arriba se coloca sobre tu barra de navegación de Webflow sin que tengas que editarla. Si tu navegación tiene position: fixed, revisa la vista previa en un teléfono; quizá prefieras mover la barra abajo. Hay tres tipos de barra: una cuenta regresiva hasta una fecha real en la zona horaria que elijas, un temporizador evergreen que es por visitante y lo dice, y un contador que avanza según un calendario publicado. Consulta funciones: barras y Temporizadores de cuenta regresiva honestos.
Cómo hacer llegar los pedidos
Webflow Ecommerce procesa los pagos con Stripe, pero la cuenta de Stripe está conectada a Webflow, y la fuente de Stripe de Provedly necesita un endpoint de webhook para checkout.session.completed registrado en tu propia cuenta de Stripe. Hasta donde permiten los ajustes de Webflow, eso no se puede configurar desde el panel de Ecommerce. Así que las opciones realistas son:
| Fuente | Cómo | Etiqueta |
|---|---|---|
| Automatización (Make, Zapier, n8n) con "nuevo pedido" | POST a la Records API | Imported |
| Webflow Logic o una pequeña función serverless | POST a la Records API | Imported |
| Exportación periódica de pedidos | Importación por CSV | Imported |
| Tu propio Stripe Checkout fuera de Webflow Ecommerce | Webhook de Stripe | Verified |
Una llamada a la Records API desde una automatización se ve así:
POST /api/v1/widgets/pp_your_token/records
Authorization: Bearer <widget api key>
Content-Type: application/json
{
"name": "{{customer name}}",
"city": "{{shipping city}}",
"country": "{{shipping country code}}",
"product_name": "{{first item name}}",
"price": "{{formatted total}}",
"external_id": "{{order id}}"
}
Envía external_id para que un reintento de la automatización no pueda crear un duplicado; el segundo intento devuelve 422. El endpoint está documentado en /docs#api.
Si vendes a través de un sitio de Webflow pero cobras con tus propios enlaces de Stripe Checkout o con un formulario aparte conectado a Stripe, puedes registrar el webhook tú mismo y esas compras se marcarán como Verified. Lo explicamos en Webhooks de Stripe para compras verificadas.
Por qué Imported no es un rebaje
Es tentador ver "Imported" como una insignia de segunda. Es una etiqueta sobre la procedencia, no sobre la calidad. Provedly no puede confirmar criptográficamente el POST de una automatización como confirma un evento firmado de Stripe, así que se lo dice tal cual al visitante. Cada insignia enlaza a una página de verificación pública con las fuentes del widget, los conteos, la última compra verificada y la política de honestidad. Una tienda de Webflow con registros Imported honestos y un contador en vivo real está en mejor posición que una tienda con un widget en el que el comerciante escribió "47 personas viendo" en un campo de texto, algo que permiten la mayoría de las herramientas de la competencia a octubre de 2026, según sus propios listados.
El contador en vivo en Webflow
El contador en vivo no necesita configuración adicional. Cuenta los visitantes que han tenido la página abierta en los últimos 90 segundos, a partir de una señal cada 30 segundos, y se oculta por debajo del mínimo que configures en lugar de mostrar un número halagador. En un portfolio o el sitio de una agencia con tráfico modesto, eso suele significar que el contador aparece durante las campañas y desaparece discretamente el resto del tiempo. Es el comportamiento correcto.
El diseño en términos de Webflow
No puedes dar estilo al widget con clases de Webflow, y no lo necesitas. Elige un tema en el panel: Clean white para la mayoría de las plantillas claras de Webflow, Midnight o Deep ocean para las oscuras, Electric violet o Sunset blaze cuando la marca es llamativa. Los formatos de nombre y ubicación son por defecto "Sarah M." y "Austin, US". Lee Cómo elegir un tema de notificación que encaje con tu marca para entender el razonamiento.
Preguntas frecuentes
¿El widget funciona en la vista previa del Webflow Designer?
No. El código personalizado de Site settings solo se ejecuta en el sitio publicado. Publica en el dominio de pruebas, añádelo a los dominios permitidos y prueba ahí.
¿Puedo mostrar el widget solo en la página de precios?
Sí. Instálalo en todo el sitio y usa la segmentación por URL en "solo estas" con /pricing. No hace falta código por página.
¿El plan Free cubre un sitio de Webflow?
Sí. Free incluye un sitio, un widget, una barra y 2.000 impresiones al mes (unas 700 visitas, a unas 3 notificaciones por visita), con la insignia "by Provedly" visible.
Instálalo en un minuto y mira tu primera notificación real: empieza.