Programación
.jpg)
Radzivon Aljovik
Entusiasta de la automatización de bajo código
24 de abril de 2024
%20(1)%20(1).png)
.png)
.svg){kind=icon}
.jpg)
Como saben los mejores desarrolladores de Webflow, un sitio web independiente ofrece menos valor que uno integrado con otros sistemas empresariales. En Latenode, somos grandes fans de la automatización y de Webflow, por eso utilizamos ambos para mejorar nuestro sitio web.
En este artículo, compartimos cómo creamos un banner Webflow dinámico con un contador de Planes de Ofertas Vitalicias vendidos. ¿La pila tecnológica? Webflow, Stripe y nuestra propia plataforma de automatización de bajo código Latenode.
Vamos a profundizar y explorar cómo utilizar componentes Webflow, APIs y CMS para conseguir el mismo resultado de un sitio web automatizado. ¡Vamos allá!
Para los pioneros, en Latenode ideamos los Planes de Trato Vitalicio: una oferta limitada con sólo 1.000 paquetes disponibles. Queremos ser transparentes, y mostrar esta información directamente en el sitio web es crucial.
¿Pero cómo? ¿Actualizando manualmente una vez al día? ¿Quién es responsable de ese proceso? ¿Gestionando las tareas repetitivas realizadas?
Por supuesto que no, ¡se trata de automatizaciones! Echa un vistazo al resultado, especialmente a este número 937.
.jpeg)
El núcleo de la automatización es un escenario que conecta la plataforma de pago Stripe con Webflow, donde está alojado el sitio web Latenode .
.jpeg)
Compra de LTD: Un usuario compra un LTD a través de Stripe.
Activador Webhook: Stripe envía una señal a Latenode cuando se produce una compra LTD, entonces lanza automáticamente el webhook y activa todo el script
JavaScript : se conecta a Stripe utilizando una clave secreta y cuenta el número de pagos LTD realizados con éxito.
Petición HTTP (Primera): La primera petición HTTP recupera información sobre la colección en Webflow que contiene los datos del banner para recuperar la información de que el número de LTD no vendidos ha cambiado
Petición HTTP (Segunda): La segunda petición HTTP actualiza la colección Webflow, disminuyendo en uno el número de LTDs restantes.
Publicación decambios: Webflow publica automáticamente la información actualizada en el sitio web, cambiando el número de LTD en el banner.
Así es como se ve la colección en Webflow, no necesitas cambiar el recuento manualmente, el script lo hace todo automáticamente
.jpeg)
Latenode El equipo también está encantado de que la actualización del Banner esté separada de la actualización de todo el sitio.
Normalmente, cuando actualizas manualmente una parte concreta del sitio, se actualiza todo el sitio, lo que puede hacer que la página se actualice para la segunda persona que esté trabajando en el sitio en ese momento y se perdería todo el progreso. ¡Así que puedes utilizar con seguridad este escenario sin miedo a perder el trabajo que has estado haciendo durante horas!
Ahora profundicemos aún más en la parte técnica de la automatización y veamos qué hay dentro de nuestros nodos:
Actúa como puente entre Stripe y el escenario. En cuanto se produce una compra LTD, Stripe envía una señal a Latenode cuando se produce una compra LTD, entonces lanza automáticamente el webhook y activa todo el script
Se utiliza para contar el número de pagos LTD realizados con éxito en Stripe.
No escribí ni una sola línea de código y conseguí todo esto con la ayuda de un asistente de IA. Aquí tienes un artículo sobre cómo integrar código en las automatizaciones aunque no sepas programar.
JS Se conecta a Stripe mediante clave secreta.
Comprueba aquí cuántos pagos se han realizado correctamente:
Dos peticiones HTTP interactúan con la Integración API Webflow. La primera petición recupera información sobre la colección que contiene los datos del banner. La segunda petición actualiza esta colección, cambiando el número de LTD restantes.
Crear una automatización de este tipo puede parecer complejo, pero Latenode proporciona todas las herramientas y el soporte necesarios para su implementación.
Latenode Comunidad de discordia: La activa y amistosa comunidad de Latenode en Discord está siempre dispuesta a ayudar con cualquier pregunta y problema.
Soporte receptivo Latenode : El equipo de Latenode proporciona asistencia rápida y cualificada, ayudando a configurar y poner en marcha automatizaciones.
La documentación clara y detallada de la API de Webflow permite crear fácilmente peticiones HTTP para interactuar con la plataforma.
.jpeg)
Latenodede LTD es un excelente ejemplo de cómo pueden utilizarse herramientas sin código para resolver problemas empresariales reales. Gracias a Latenode y Webflow, cualquier usuario puede crear automatizaciones similares, mejorando la eficacia de sus proyectos y ahorrando tiempo.
Y, como extra, me gustaría añadir una nota: ¡mientras escribíamos este artículo, la automatización del banner LTD ya estaba en acción! De hecho, si echamos un vistazo al sitio web Latenode ahora mismo, podemos ver el resultado de este escenario en tiempo real.
Como puedes ver, el número de LTD restantes ha disminuido desde que empezamos a escribir este artículo. Esto demuestra la eficacia de la automatización y su capacidad para reflejar los cambios en tiempo real. El escenario funciona a la perfección, actualizando el banner con la información más reciente y creando una sensación de urgencia entre los clientes potenciales.
