En el dinámico mundo del comercio electrónico, la tecnología evoluciona continuamente, lo que empuja a las empresas a adaptarse e innovar para mantenerse a la vanguardia. En Knowband, entendemos la importancia de estar al día con las últimas tendencias tecnológicas para garantizar que nuestros clientes reciban las mejores herramientas para el éxito. Es por eso que hemos realizado un paso importante para nuestro complemento PrestaShop PWA: la transición de Angular a React. Este cambio está diseñado para mejorar el rendimiento de sus sitios de comercio electrónico PrestaShop, garantizando que sean más rápidos, más receptivos y mejor adaptados a sus necesidades comerciales.
Además, prometemos una experiencia de usuario más estable y mejorada para sus clientes en el próximo React. PWA para Prestashop.
¿Por qué reaccionar?
La popularidad y eficiencia de React como biblioteca frontend provienen de su DOM virtual (modelo de objetos de documento), que permite un rendimiento superior y una representación de la interfaz de usuario más rápida en comparación con Angular. Además de eso, esta transición significa que cualquier acción que los clientes realicen en su sitio PrestaShop, ya sea buscar productos o completar compras, ahora será más fluida y eficiente.
Rendimiento y experiencia de usuario mejorados:
Una de las principales ventajas de utilizar el complemento PWA de React para Knowband es la mejora significativa en los tiempos de carga y la capacidad de respuesta de la aplicación. La razón detrás de esto es que React permite una interacción más fluida en dispositivos móviles, replicando la sensación de una aplicación nativa de manera más efectiva que nunca. Por lo tanto, para cualquier negocio de comercio electrónico, la velocidad y fluidez con la que los usuarios pueden navegar por su sitio pueden afectar drásticamente las ventas y la satisfacción del cliente.
Proceso de desarrollo simplificado:
En Knowband, ofrecemos soluciones de aplicaciones web progresivas para plataformas de comercio electrónico Prestashop, WooCommerce, Magento 2 y Opencart. Además, lo sorprendente es que los proveedores no requieren ningún tipo de conocimiento técnico para crear sus aplicaciones web para Android e iOS utilizando nuestro complemento PWA.
Además, el administrador de la tienda puede crear las aplicaciones PWA en poco tiempo simplemente instalando el complemento PWA en la tienda y agregando configuraciones de Firebase.
Próximas funciones en la próxima compilación del módulo:
De cara al futuro, Knowband se complace en presentar nuevas funciones en la próxima versión de nuestro software basado en React. Complemento PrestaShop PWA, que aportará aún más capacidades a tu tienda online:
Controles deslizantes de banner automatizados:
El administrador ahora tiene la capacidad de agregar controles deslizantes de banner automatizados en la página de inicio de la aplicación PWA. Por lo tanto, la siguiente función le ayudará a atraer a sus clientes con banners dinámicos de alta calidad que son fáciles de administrar y automatizar. Esta función mejora el atractivo visual de su sitio y se puede utilizar para resaltar promociones, novedades o artículos populares.
Vista de lista/cuadrícula en las páginas de listado de productos:
Puede brindarles a los usuarios de su aplicación PWA la flexibilidad de ver productos en un formato que se adapte a sus preferencias. Alternar entre vistas de lista y cuadrícula en las páginas de listado de productos facilitará a los clientes buscar productos, compararlos y tomar decisiones de compra basadas en sus hábitos de compra personales.
Función de notificación:
Mantener a sus clientes informados y comprometidos con notificaciones en tiempo real sobre nuevos productos, ofertas especiales y estados de pedidos será más fácil con la función de notificación que se introducirá en la aplicación PWA. Además, esta función garantiza que sus clientes se sientan conectados y valorados, lo que puede ayudar a aumentar la fidelidad de los clientes y a repetir los negocios.
¡Conclusión!
Al hacer la transición de Angular a React, Knowband Creador de aplicaciones móviles PrestaShop PWA El complemento está configurado para ofrecer funciones aún más sólidas y un rendimiento mejorado. Además, estas mejoras están diseñadas para ayudar a su sitio de comercio electrónico no sólo a mantenerse al día con las tendencias del mercado, sino también a adelantarse a ellas, ofreciendo a sus clientes una experiencia de compra en línea más rápida y atractiva. Estén atentos a nuestra próxima creación de módulos, que promete llevar su sitio de comercio electrónico a nuevas alturas.
En Knowband, estamos comprometidos a brindarles a nuestros clientes soluciones de vanguardia que impulsen el éxito y la innovación en el espacio del comercio electrónico. Explore los beneficios del nuevo complemento PWA basado en React y prepárese para llevar su tienda PrestaShop al siguiente nivel.
Siempre hemos estado buscando una alternativa a las publicaciones de Google Play y Apple Store. PWA (Progressive Web Apps) parece ser la mejor opción para lo mismo. Esta tendencia se está volviendo cada vez más popular con la facilidad de respirar. Sin duda, muchos profesionales calificados y gurús informáticos predicen que PWA será el futuro. Bueno, si tienes una tienda Prestashop, puedes invertir fácilmente en el Creador de aplicaciones móviles Prestashop PWA de Knowband.
La aplicación móvil Prestashop PWA ayuda a replicar la relación nativa específica con las aplicaciones del programa. La principal ventaja es que el dueño de la tienda no tiene que lidiar con las publicaciones de App Store o Play Store. En cambio, la aplicación web progresiva Prestashop se puede proporcionar simplemente abriendo la URL del sitio web en una aplicación móvil. Cuando los clientes abren la URL de la tienda en el móvil, tienen la opción de agregar el PWA de comercio electrónico a su pantalla de inicio.
Si posee una tienda Prestashop, este artículo le explicará los beneficios de tener una Aplicación móvil Prestashop PWA. ¿Estás listo para saber más sobre ellos? Puede ir y comprobarlos usted mismo para una mejor comprensión.
Las ventajas esenciales de Prestashop Pwa Mobile App Builder
Mayor tasa de conversión y ganancias
Prestashop PWA Mobile App Maker puede ayudar a las empresas de comercio electrónico a mejorar las conversiones móviles. Además, proporcionar un ciclo reducido para proporcionar la aplicación directamente desde el sitio web móvil dirige a los consumidores a la aplicación web progresiva. Las aplicaciones, con su navegación en capas y pago de una sola página, tienen el potencial de ser un gran punto de enfoque de pago para las organizaciones de comercio electrónico.
Menos esfuerzo y gasto de desarrollo
Con las aplicaciones de compras nativas, los minoristas de comercio electrónico deben incurrir en gastos y esfuerzos significativos para crear y distribuir aplicaciones de Android e iOS. El ciclo de publicación en Google Play y Apple App Store es fascinante. Sin embargo, ocasionalmente se convierte en un problema para los dueños de negocios que no entienden las sutilezas. En la situación actual, Prestashop PWA Mobile App Creator viene al rescate. La aplicación móvil Prestashop PWA se resuelve fácilmente accediendo a la URL de la tienda en una aplicación móvil y agregando el logotipo a la pantalla de inicio del teléfono celular. Su formulario móvil se convertirá en una aplicación PWA mientras la transición de escritorio permanece activa.
Prestashop PWA Mobile App Builder es una excelente alternativa para las empresas de comercio electrónico, ya que funciona perfectamente con Android e iOS. Puede usar la aplicación PWA de comercio electrónico de Prestashop para dirigirse a todo el mundo o a ciertas regiones. Cuantos más usuarios visiten el sitio web, más bases de Progressive Web App habrá. Además, las aplicaciones se colocarán en el gabinete de aplicaciones con otras aplicaciones. La funcionalidad será completamente nativa y los usuarios solo tendrán que iniciar la aplicación para buscar artículos y otros datos de la tienda.
La Decisión Comercial Aprobada
Si cree que un modelo lo ayudará a comprender la PWA de comercio electrónico, debe considerar Twitter, Alibaba y muchos otros. Estas son algunas de las diversas empresas que utilizan la tendencia de las aplicaciones web progresivas para mejorar las conversiones y los pagos. Las aplicaciones móviles de PWA pueden ser utilizadas tanto por pequeñas como por grandes empresas de comercio electrónico de Prestashop para aumentar de inmediato las ventas de los clientes móviles.
Funciona rápidamente en cualquier situación, incluso sin conexión
Los PWA de comercio electrónico son excepcionalmente ligeros y rara vez fallan o se detienen en los dispositivos móviles. El desarrollo de la aplicación Prestashop eCommerce PWA es sofisticado, lo que garantiza que los artículos se carguen y ejecuten más rápido en comparación con las aplicaciones nativas. Una carga más rápida y un funcionamiento fluido pueden mejorar la experiencia de compra de los consumidores móviles en todo momento. Otra característica importante es que PWA para Prestashop puede ejecutarse en modo fuera de línea, con una conexión web débil o inexistente.
Monitoreo del panel de administración simplificado en la aplicación móvil Prestashop Pwa
La aplicación web progresiva de comercio electrónico crea un panel de administración simple (backend) para administrar y personalizar la aplicación web progresiva en vivo. No hay una razón convincente para ponerse en contacto con el servicio de atención al cliente o averiguar cómo codificar. El administrador de la tienda solo necesita hacer los cambios necesarios. Además, la PWA de comercio electrónico en vivo se actualizará automáticamente. La opción de diseño de la página de aterrizaje le permite al administrador de la tienda modificar la apariencia y el estilo de la página en vivo. Knowband Aplicación web progresiva para Prestashop en cualquier momento sin cambiar el código.
Las notificaciones push son una excelente forma de publicidad
Durante mucho tiempo, las notificaciones automáticas han sido una parte importante del marketing para cualquier sitio de comercio electrónico. Todos habríamos recibido alertas automáticas en nuestros teléfonos móviles para las aplicaciones de compras nativas instaladas. Esto también es posible en sus aplicaciones PWA gracias a la aplicación web progresiva para Prestashop. El propietario de la tienda podrá planificar y enviar alertas automáticas personalizadas y predefinidas a los dispositivos móviles.
Importe paso a paso en la página del producto
El escalador de cantidad es otra expansión que permite a los clientes de la Creador de aplicaciones móviles Prestashop PWA subir o bajar el número de productos individuales antes de enviarlos a su contenedor. El botón +/- en la pantalla del artículo del complemento Prestashop es todo lo necesario para los compradores.
Botón Agregar al carrito, la página de inicio y la página de categoría facilitan el trabajo
Los clientes pueden agregar fácilmente productos al carrito desde la página de inicio y las páginas de categoría. Al utilizar el módulo, los clientes no necesitan reconsiderar agregar los productos porque la pantalla de inicio y las páginas de clase actualmente tienen accesible el botón Agregar al carrito.
Productos relacionados La accesibilidad ayuda en la venta cruzada
Con la similitud con el complemento de productos relacionados automáticos de Prestashop, la aplicación web progresiva de Prestashop permite al administrador vender más cosas. Además, puede mostrar productos relacionados en el sitio para que los clientes elijan y compren más. Posteriormente, más ventas e ingresos esperados.
Si desea mantenerse a la vanguardia en el mercado del comercio electrónico, use Prestashop PWA Mobile App Builder para ayudarlo a llegar allí. Dada la gran cantidad de PWA, ahora es un excelente momento para convertir su tienda Prestashop en una aplicación móvil. Proporcione una experiencia de compra desconcertante con funciones mejoradas, como velocidad rápida, operación fuera de línea, alertas automáticas, SEO y mucho más.
Brindar a los usuarios acceso a una aplicación PrestaShop PWA optimizada mejoraría su experiencia de compra móvil. Con la ayuda de este módulo de la aplicación PrestaShop PWA, puede convertir su tienda en línea en una aplicación web fácil de usar que se puede mantener desde el backend. Estas aplicaciones ofrecen una serie de capacidades adicionales que no se encuentran en las aplicaciones nativas, incluido el modo fuera de línea y la independencia de la plataforma, lo que las convierte en una opción de compra sin problemas y sin inconvenientes para los clientes. Incluso puede ponerse en contacto con el equipo de soporte para todas sus consultas en support@knowband.com.
No hace mucho tiempo, tener un negocio exitoso estaba relacionado con tener un sitio web bien diseñado que atrajera a las personas y las alentara a comprarte. Eso fue, sin duda, hace mucho tiempo. Ahora las cosas han cambiado.
Por el momento, el mercado se trata de mantenerse a la vanguardia en términos de avances tecnológicos. Después de la transición del sitio web a las aplicaciones nativas, las cosas se volvieron mucho más fáciles para los usuarios y más valiosas para los comerciantes de las tiendas. Independientemente, con Internet rápido, las aplicaciones nativas se dispararon como un cohete. Sin embargo, si la velocidad de la web es lenta, las aplicaciones nativas fallarían. Aquí es donde entran en juego las aplicaciones web progresivas (también populares como PWA de comercio electrónico).
¿Qué son exactamente las aplicaciones web progresivas (PWA)?
Una aplicación web progresiva de comercio electrónico no es equivalente a ninguna otra aplicación web. Funciona de la misma manera que un sitio móvil tradicional en el que se accede a él utilizando el producto de su teléfono celular. No obstante, en realidad, la PWA incorpora tecnología de front-end que le permite funcionar y sentirse como una aplicación local.
Si tiene una tienda Prestashop, la aplicación móvil Prestashop PWA puede ayudarlo a hacer crecer su negocio de comercio electrónico más rápido que antes. La aplicación web progresiva para Prestashop brinda a sus clientes una experiencia de compra consistente. Además, acceda a su contenido independientemente de si hay una conexión a Internet débil o inexistente.
Aspectos destacados del generador de aplicaciones móviles Prestashop PWA
Arreglo con etiqueta blanca
Cuando el propietario de una tienda crea una aplicación móvil de comercio electrónico, la aplicación debe estar etiquetada con el nombre de la marca. Con PWA de comercio electrónico de Knowband, el administrador puede estar seguro de que la salida estará bajo el nombre de la marca y no tendrá nada que ver con Knowband, según el acuerdo de etiqueta blanca.
La lista de productos está disponible
La función de lista de productos destacada de la aplicación web progresiva de comercio electrónico le permite agregar diferentes componentes basados en productos/clases. Usando la redirección, estos componentes pueden actualizarse eficientemente con los estándares. Los productos principales aparecerán en la primera página de la aplicación web del vendedor de la tienda.
La personalización es simple
Al visitar el sitio web, los clientes pueden agregar fácilmente el PWA para Prestashop a su pantalla de inicio. Desde el back-end, el administrador de la tienda puede crear y personalizar fácilmente la pantalla de inicio.
Mejora el compromiso y es confiable.
En términos de confiabilidad/confiabilidad, la aplicación Prestashop eCommerce PWA funciona incluso cuando no hay conexión a Internet o ésta es inestable. Mientras que las aplicaciones nativas requieren una conexión a Internet estable, las PWA de comercio electrónico seguramente pueden funcionar sin ella. Debido a la función de notificaciones automáticas, se cree que el equivalente aumenta la participación del consumidor. Con Prestashop PWA Mobile App Creator, el administrador de la tienda puede enviar una cantidad ilimitada de alertas automáticas a los usuarios.
Similitud entre varios dispositivos
Prestashop PWA Mobile App Maker es totalmente compatible con todos los dispositivos portátiles. Por ejemplo, teléfonos móviles, iPhones, iPads y más.
Ligeros
La aplicación web progresiva Prestashop no requiere descarga desde Google Play Store o App Store, a diferencia de las aplicaciones nativas. El primero puede estar en MegaBytes o GigaBytes. Sin embargo, la aplicación móvil Prestashop PWA es liviana y no requiere descarga. En su lugar, el cliente debe instalar en la pantalla de inicio del teléfono móvil para acceder al contenido.
Iniciar sesión usando el correo electrónico y las redes sociales
El administrador de la tienda puede utilizar PWA para Prestashop para permitir que los usuarios se registren o inicien sesión con sus direcciones de correo electrónico, exactamente como lo hacen con las identificaciones de inicio de sesión social. A los usuarios les resultará mucho más fácil ir al negocio como resultado de esto.
Sincronización en tiempo real
La aplicación móvil Prestashop PWA es su mejor opción cuando necesita que su sitio web y el contenido de las aplicaciones estén sincronizados entre sí. La sincronización en vivo permite ver todo lo que sucede en el sitio web también en la aplicación. Por ejemplo, el administrador puede eliminar elementos no disponibles, los productos pueden expandirse, los pedidos pueden realizarse y más.
Modo para usar cuando no estás conectado a Internet
La función fuera de línea de la aplicación web progresiva Prestashop garantiza que los consumidores puedan acceder al contenido de la tienda incluso si tienen una conexión a Internet deficiente.
Se aceptan todos los métodos de pago y envío.
Independientemente de las opciones de pago disponibles en su tienda de comercio electrónico, querrá usar Prestashop para integrarlas en su PWA de comercio electrónico. Del mismo modo, el complemento proporcionará todas las opciones de entrega disponibles en la tienda de comercio electrónico.
Pago en una sola página
El complemento Prestashop viene con un pago de una sola página incorporado que solo solicita la información más básica del usuario. También le permite evaluar todos los detalles del pedido antes de completar el pago.
Botón Agregar al carrito en la página de inicio y la página de categoría
Los clientes pueden agregar productos al carrito sin esfuerzo desde la página de inicio y las páginas de categoría. Con el complemento, los clientes no tienen que pensar dos veces antes de agregar los productos porque la pantalla de inicio y las páginas de categorías ahora tienen disponible el botón Agregar al carrito.
Disponibilidad de productos relacionados
Con la compatibilidad del complemento de productos relacionados automáticos de Prestashop, la aplicación web progresiva de Prestashop permite al administrador vender más artículos. Además, puede mostrar productos relacionados en el sitio web para que los clientes elijan y compren más. Por lo tanto, más ventas e ingresos potenciales.
Paso a paso de cantidad en la página del producto
El escalador de cantidad es una nueva adición que permite a los clientes de la aplicación móvil Prestashop PWA aumentar o disminuir la cantidad de productos individuales antes de enviarlos a su cesta. El botón +/- en la pantalla del producto del complemento Prestashop es todo lo que se requiere de los consumidores.
Beneficios de la aplicación web progresiva Prestashop de Knowband
Las aplicaciones para iOS y Android son menos costosas
En comparación con la distribución de contenido para iOS, Android y un sitio web de forma independiente, ahorra tiempo y dinero porque el material solo debe crearse una vez. Además, la aplicación Prestashop eCommerce PWA no requiere ninguna actualización. No es probable que los usuarios descarguen material nuevo. Si una PWA de Prestashop funciona, ya no tendrás que preocuparte por desarrollarla. Esto hace que eCommerce PWA sea una opción financieramente viable.
Optimización con fines SEO
El contenido de una función de aplicación web progresiva de comercio electrónico en los resultados de búsqueda. Por lo tanto, ayudar a mejorar el SEO. Con Google Tools, puede ver cómo funciona su aplicación web progresiva para Prestashop en los SERP. La seguridad y el rendimiento de carga de una aplicación web progresiva de Prestashop son consideraciones importantes. Además, como suele ser el caso con SEO, el material debe ser distintivo y aplicable. Debido a que ahora se pueden encontrar tantos servicios y bienes en línea, el SEO se está volviendo cada vez más importante.
La velocidad de la página mejora
Al actualizar a un Aplicación PWA de comercio electrónico Prestashop, primero debe realizar una actualización completa del sitio web. Esto garantiza que no solo se beneficie de las ventajas de almacenar en caché a los empleados de servicios, sino que también puede deshacerse del tejido cicatricial que limita su sesión. Al actualizar a las mejores prácticas, puede hacer que su sitio web sea un demonio de la velocidad, brindándole una ventaja significativa sobre sus competidores.
Cuando el invitado regresa, los recursos almacenados en caché reducen las latencias en la organización, aumentando su probabilidad regular hasta el primer byte y acelerando la carga de la página. Con la ayuda de Prestashop PWA Mobile App Builder, será mucho más fácil.
Bajos requisitos de almacenamiento
La competencia por un asiento en los gadgets aún continúa. También se está volviendo cada vez más difícil para las aplicaciones de compras nativas ganar terreno en la vida de los consumidores. Como resultado, la aplicación web progresiva de comercio electrónico no debería tener una gran restricción de uso. Sobre todo, no hay un motivo convincente para descargar ninguna aplicación nueva, por lo que la ventaja es modesta. Como resultado, su grupo seleccionado puede probar la aplicación web progresiva de Prestashop. También pueden hacer uso de la aplicación sin conexión. También usa menos memoria que los programas nativos, lo cual es una consideración importante para ciertos usuarios.
Funcionamiento sin conexión a Internet
Los PWA de comercio electrónico son mucho más útiles que los sitios web que necesitan una conexión legal a Internet, ya que pueden funcionar sin conexión o en redes poco confiables. Como resultado, los trabajadores de servicios integrados guardan información y aspectos destacados básicos de las aplicaciones web progresivas, evitando la necesidad de descargarlas y permitiendo que los usuarios accedan a ellas incluso cuando no están conectados a Internet.
Se basa, por ejemplo, en el almacenamiento de información de páginas visitadas recientemente por los usuarios. Esto es importante para los minoristas, ya que anima a los compradores a permanecer en sus tiendas y aumenta la retención de clientes.
No hay necesidad de tiendas de aplicaciones
La aplicación web progresiva para Prestashop está disponible a través de un motor de búsqueda y otros sitios web. También podría proporcionar una aplicación móvil Prestashop PWA a través de un sitio de redes sociales, su página de inicio u otra parte de su entorno. Ya no dependes de las tiendas de aplicaciones. Las tiendas de aplicaciones, por otro lado, ofrecen la ventaja de poder llegar a una gran audiencia a la vez.
Prestashop Progressive Web App es adaptable y, lo mejor de todo, recibimos todos los aspectos comerciales cruciales. Este módulo Knowband será beneficioso para su negocio de comercio electrónico y ampliará sus horizontes. Además, el complemento Prestashop lo ayuda a aumentar las ventas y los ingresos. Si desea obtener más información sobre el módulo, puede consultar la página del producto en Knowband. O puede enviarnos un correo electrónico a support@knowband.com con sus consultas y lo ayudaremos.
La aplicación web progresiva no es más que un sitio web o una aplicación web que se ve y funciona como una aplicación móvil nativa pero que incorpora las ventajas de ambos marcos. Técnicamente hablando, para ofrecer una experiencia móvil, las PWA reutilizan el código de su sitio web. Jugar con las nuevas tecnologías puede ser aterrador; ¿Será una buena idea implementar la PWA en un mercado en línea? Mediante la integración de PWA en él, un mercado en línea que se incluye en el marco del comercio electrónico, un sitio web o una aplicación que permite a los clientes comprar varios tipos de productos de diferentes proveedores, se puede hacer razonablemente fácil de usar. La aplicación web progresiva está creando un escándalo en la industria del mercado y los elogios por sus ventajas no tienen fin, sin embargo, el escepticismo se forma en nuestra cabeza cuando se trata de invertir en ella y nos obliga a repensarlo. Es relativamente más fácil crear y lanzar aplicaciones web progresivas que hacer lo mismo con las aplicaciones nativas para teléfonos inteligentes. Hemos recopilado los ejemplos más populares de PWA para mercados de comercio electrónico en esta publicación de blog. Esto le dará una perspectiva sobre la implementación y los beneficios de las PWA para eCommerce Marketplace.
Beneficios adicionales de las PWA para el comercio electrónico y el mercado en línea
Para mercado de comercio electrónico de múltiples proveedores, Las PWA pueden ofrecer experiencias web móviles rápidas y atractivas. PWA se ejecuta directamente en el navegador móvil. Ejecutar junto con el sitio web: no es necesario instalarlo por separado de la tienda. Los PWA están hechos a medida para teléfonos móviles iO y Android. A diferencia de las aplicaciones móviles, no es un problema crear un diseño diferente, ya que ya está curado de esa manera. Google permite agregar PWA a la tienda Google Play y brindar mayor soporte a las aplicaciones web receptivas.
Eficiente y confiable
Las especificaciones de todos los puntos finales en los que opera son cumplidas por la propia PWA. No es necesario crear varias versiones para diferentes dispositivos. Además, obtiene la apariencia de las aplicaciones móviles y el mejor resultado de los sitios web en uno. PWA permanece en el servidor, por lo que utiliza una proporción muy limitada de almacenamiento del sistema solo en caché para el usuario.
Mejora la tasa de conversión
En términos de ritmo, había un competidor decente para las aplicaciones nativas y los sitios web diarios. Las PWA son conocidas por su alta velocidad, lo que simplifica todas las tareas principales en las plataformas de mercado para el comercio electrónico. Los usuarios pueden encontrar un producto que necesitan, agregarlo a un carrito de compras o comprar un artículo en línea mucho más rápido. La interacción del usuario de las PWA es excelente, ya que las empresas pueden conectarse con los usuarios de su sitio de una manera más personalizada y personalizada con la función de alertas web push. Son progresivos, sensibles, de carga rápida y muy seguros, además, por decirlo.
Mejor compromiso con el cliente
En comparación con el software nativo / híbrido, la aplicación PWA es muy ligera. Esto hace que su aplicación web progresiva en los dispositivos de los usuarios use menos espacio. Esta variable también está detrás de la explicación de que PWA no se bloquea y ofrece una experiencia de usuario mejorada. Actualiza periódicamente las aplicaciones nativas a sus nuevas versiones, mientras que las PWA se actualizan automáticamente desde el navegador.
Desplazamiento ininterrumpido en una red inestable
Al desplazarse en un navegador, a veces sucede que el sitio web del mercado tarda más de lo habitual y la mala conectividad de la red es la razón detrás de esto. Las PWA son independientes de las redes de Internet. Incluso en una red inestable, utiliza la captura y le permite navegar por el contenido guardado. Permiten a los usuarios, incluso en modo offline, seguir navegando para lograr un alto nivel de eficiencia.
Ranking SEO mejorado
Google admite PWA y su SEO rastrea los sitios web del mercado rico en PWA en la parte superior. Además, las PWA se pueden compartir y conectar cómodamente, lo que las hace más visibles que las aplicaciones nativas. Google prioriza los sitios web rápidos y optimizados para dispositivos móviles desde que inició la indexación de dispositivos móviles primero en 2018. Esto significa que en los resultados de las páginas del motor de búsqueda, su sitio de mercado en línea debe tener estas características para obtener una calificación más alta. Ahí es cuando los servicios de una empresa de desarrollo de PWA serían útiles para su empresa.
Historias de éxito de PWA para comercio electrónico y mercado en línea
Varios mercados en línea y tiendas de comercio electrónico han desarrollado sus PWA y se benefician de sus ventajas. Las PWA agregan íconos de aplicaciones en la pantalla de inicio y hacer clic en un ícono siempre es más fácil que escribir y navegar. Con un aumento simultáneo en el consumo y el intercambio de contenido, el crecimiento en las tasas de conversión y los ingresos, el objetivo de cada sitio web de comercio electrónico y mercado en línea es el mismo, independientemente de la escala y el sector en el que trabajen constantemente para minimizar los costos de adquisición del consumidor. Afortunadamente, las tiendas de celulares de PWA los respaldan a todos. Las marcas de fama mundial y otras empresas de comercio electrónico que han crecido rápidamente en años anteriores pueden otorgar algunos créditos a las PWA. ¿Son las PWA realmente tan emocionantes? Sí lo son.
Jumia
Jumia está aprovechando la tecnología PWA para su plataforma de mercado. ¡Esta se convirtió en la experiencia web móvil predeterminada en 2018 cuando se lanzó en Nigeria y se ha expandido en 14 países con 6.7 millones de usuarios hasta ahora! El público objetivo de Jumia estaba utilizando predominantemente la red 2G, lo que obligó a la empresa de comercio electrónico a buscar una experiencia de sitio web más eficaz y fluida incluso en una conectividad de red inestable. Entonces entró en escena la PWA de Jumia, que fue un éxito inmediato. Los beneficios de utilizar la plataforma de comercio electrónico Jumia son muchos. Estadísticamente, toma 25 veces menos almacenamiento y dos veces menos datos para comenzar. La tasa de conversión se incrementó en un 33% y redujo la tasa de rebote en un 50% con un consumo de datos 5 veces menor. ¿No es un gran éxito?
AliExpress
AliExpress es una reconocida empresa de comercio electrónico que se lanzó en China en 2010. Se puede encontrar casi de todo, desde ropa, zapatos, productos electrónicos y artículos para mascotas hasta electrodomésticos. También han adoptado la estrategia Progressive Web App (PWA) y han visto muchos buenos resultados desde que forman parte del Grupo Alibaba. Desde el ejemplo, las conversiones de AliExpress aumentaron dramáticamente en un 104% inmediatamente después del lanzamiento de la aplicación web progresiva. Además, sus usuarios comenzaron a visitar más páginas por visita y en promedio. Los usuarios comienzan a pasar un 74% más de tiempo en la tienda de comercio electrónico de AliExpress. Por lo tanto, ¡las PWA son muy atractivas!
Flipkart
Flipkart es la empresa comercial más grande de India que compite con Amazon. El gran gigante Flipkart decidió fusionar su presencia en línea con su aplicación nativa en una aplicación web progresiva, lo que resultó en un aumento de conversión del 70%. ¡Eso es enorme! La empresa abandonó su sitio web móvil en 2015, que no podía competir en términos de una interfaz de usuario rápida y receptiva con una aplicación nativa. Algunas estadísticas a tener en cuenta:
El tiempo del consumidor de Flipkart Lite en el sitio ahora es De 3.5 minutos vs experiencia móvil anterior: 70sec
3 veces más tiempo en el sitio
Aumento del 40% de la tasa de reenganche
70% más de tasa de conversión entre los que visitan a través del icono de la pantalla de inicio
3 veces menor consumo de datos
trivago
Trivago! ¡La aplicación del hotel! El motor de búsqueda de hoteles líder en el mundo compara 175 sitios web de reservas con más de 700,000 hoteles en todo el mundo. Sorprendentemente, Trivago tiene más espectadores de teléfonos inteligentes que de escritorio. Su PWA, con accesos directos a la pantalla de inicio, notificaciones automáticas y acceso sin conexión, es como una aplicación nativa. Resultó aumentar la interacción del usuario en un 150%. El motor de búsqueda de hoteles de Trivago informó una tasa de conversión significativamente más alta que su aplicación nativa con el poder de PWA. Además, la tasa de clics de sus reservas de hotel experimentó un aumento espectacular del 97%. ¡Wow wow!
MakeMyTrip
La agencia de viajes en línea líder en India es MakeMyTrip. Pasaron por precios altos continuos y costosos costos de adquisición para el consumidor antes de lanzar la aplicación web progresiva (PWA). Para hacer frente a eso, MakeMyTrip quería invertir en PWA para llevar su experiencia de usuario al siguiente nivel y al mismo tiempo invertir su presupuesto de manera más eficiente. Afortunadamente, sus consumidores están realmente interesados en las innovaciones tecnológicas, de acuerdo con un aumento de tres veces en las tasas de conversión y un crecimiento del tráfico de más del 150%. ¡Intenta no amarlo!
¿Cómo puede KnowBand ayudarlo con el desarrollo progresivo de aplicaciones web?
En KnowBand somos fanáticos de la tecnología PWA. Nuestro equipo cree firmemente que tiene la capacidad suficiente para reemplazar las aplicaciones móviles. Por lo tanto, hemos diseñado la aplicación web progresiva que convierte su sitio web lento y aburrido en una aplicación web progresiva dinámica. Los PWA tienen varias ventajas, como experiencias fluidas, sin esfuerzos de instalación, menor consumo de almacenamiento, tiempos de carga sustancialmente más rápidos, etc. Además, las tasas de conversión mejoradas, las tasas de participación y el aumento de las ventas móviles son beneficios interesantes. Eso es a lo que a menudo conduce el cambio a PWA. La aplicación web progresiva está disponible para varias plataformas de comercio electrónico y es fácil de instalar en su tienda de comercio electrónico existente y en el mercado en línea.
Principales características de la aplicación móvil PWA
Conclusión: ¡Con suerte, esos cinco maravillosos ejemplos de marcas importantes que utilizan Progressive Web Apps (PWA) deberían haberlo animado a hacer lo mismo! Llevará menos tiempo crear una aplicación con la estrategia de creación de PWA, ya que ahora solo tendrá una aplicación multiplataforma para iniciar. En este sentido, la creación de aplicaciones web progresivas es una forma fantástica de reducir el costo de desarrollo de una aplicación móvil. Por lo tanto, es rentable y es por eso que debe probar las PWA. Si cree que la tecnología Progressive Web App podría ayudar a su empresa, nos encantaría ayudarlo. Hoy, ponte en contacto.
Las aplicaciones web progresivas convierten su sitio web habitual en una aplicación web de carga rápida que se comporta como una aplicación móvil en un navegador. La extensión de la aplicación web progresiva OpenCart está integrada con todas las funciones necesarias y convierte su sitio web en una PWA dinámica. El Extensión de aplicación web progresiva le dará a su cliente de comercio electrónico la sensación de usar una aplicación móvil cuando en realidad está usando el navegador de Internet. ¿Por qué es importante PWA para un sitio web de comercio electrónico? Hay muchas marcas famosas como Starbucks, Flipkart, MakeMyTrip, Trivago, Jumia, etc., que han experimentado un tremendo crecimiento en la participación del cliente y la tasa de conversión después de lanzar PWA. Los PWA son altamente confiables y brindan a los clientes una experiencia de usuario fluida. La tecnología PWA no es muy antigua, pero el término fue acuñado por Google en 2015 y luego muchos lo siguieron, ya que mostró resultados positivos de muchas maneras. La extensión OpenCart PWA tiene varias características que beneficiarán a los propietarios de la tienda de varias maneras. Algunas de las características y beneficios se analizan en este artículo. Veámoslo en profundidad.
La aplicación web progresiva OpenCart
Para ofrecer una experiencia similar a una aplicación a los consumidores, una aplicación web progresiva (PWA) utiliza tecnologías web modernas. Nuestra aplicación web progresiva OpenCart da la impresión de una aplicación nativa que los mantiene comprometidos y mejora la experiencia general del usuario. Admite muy bien las notificaciones push, lo que mejora aún más la accesibilidad de su sitio web.
¿Por qué PWA es una extensión imprescindible para la tienda OpenCart?
Si desea brindar a sus visitantes una experiencia similar a una aplicación en la web móvil, entonces OpenCart Progressive Web App (PWA) es la mejor solución para sus necesidades.
La aplicación web progresiva admite notificaciones push que mejora la tasa de conversión.
Los PWA son carga rápida que mantiene al usuario comprometido y reduce la tasa de rebote
Soporte fuera de línea: Funcionan bien con una conectividad de red deficiente e incluso en modo fuera de línea (usa caché)
Aquí están rentable porque ahorra el costo que necesita para crear una aplicación nativa
Las PWA son altamente confiable y atractivo
El OpenCart PWA es un opción de primer nivel para usted porque no requiere que se cargue en las tiendas de Apple y Google Play.
Apto para gadgets: La aplicación web OpenCartProgressive funciona bien en todos los dispositivos móviles.
Ocupa almacenamiento bajoy casi no se enfrenta a ningún choque o retraso.
¿Cómo funciona una extensión de la aplicación web progresiva OpenCart (PWA)?
Esta aplicación progresiva de OpenCart (PWA) es como cualquier otra extensión de OpenCart. Cuando esta extensión se instala en un sitio web de carrito abierto, crea una PWA personalizable derivada de los datos del sitio web.
Se mantiene una sincronización en tiempo real entre el sitio web y la PWA.
1. PWA le permite personalizar y configurar la interfaz de usuario de la tienda OpenCart
Para administrar la interfaz de usuario de PWA, no necesita un codificador profesional. Es así de sencillo de personalizar y configurar. Los propietarios de la tienda OpenCart pueden seleccionar y personalizar el nombre de la aplicación, el icono de la aplicación, el logotipo, la pantalla de presentación, los estilos de fuente, etc. En el navegador móvil, los usuarios del sitio web pueden conectar su aplicación OpenCart PWA a la pantalla de inicio de sus dispositivos. Obtenga todo el poder sobre su aplicación desde el panel de backend de la extensión que con unos pocos clics y botones de alternancia. La apariencia de la tienda se inspirará en el tema y el nombre de dominio que desee.
2. Compatible con notificaciones push que mejoran la conversión
Para las aplicaciones móviles de comercio electrónico, las notificaciones push son un factor de beneficio, si se usan con prudencia. La aplicación móvil OpenCart PWA también lo ayuda a brindar directamente a los usuarios de su aplicación notificaciones automáticas personalizadas en sus teléfonos inteligentes. El administrador de la tienda también puede programar las actualizaciones que se enumeran a continuación desde el panel de administración:
Notificación de un pedido exitoso
Actualizaciones de estado de pedidos
Notificación de seguimiento para carrito abandonado
3. Manejo del estado del pedido en tiempo real
En la aplicación web OpenCart Progressive, el estado del pedido se cambia en tiempo real. Los usuarios de la aplicación podrán vigilar el cumplimiento de los pedidos exitosos. Los detalles del pedido permanecen sincronizados con la tienda.
4. Ahora es fácil administrar el inventario
Todo el inventario del sitio web estará sincronizado automáticamente con la aplicación. Además, el control manual no es necesario cuando se trata del inventario de aplicaciones. Cualquier actualización o nueva incorporación al software también se modificará solo actualizándola.
5. Desarrolle la marca y el marketing sin esfuerzo
Si PWA está instalado en su tienda OpenCart, se beneficiará de sus prácticas herramientas promocionales que lo ayudarán con el marketing y la ejecución de ofertas en su tienda. Es una extensión rentable, porque no necesita ningún módulo adicional para ejecutar ofertas en su tienda.
Campañas y promociones a la venta
Para aumentar las ventas, puede ejecutar diferentes ofertas de ventas promocionales. Utilice los gráficos de campaña de la pantalla de inicio intuitiva y promueva más compras para los usuarios. El administrador también puede ejecutar una venta flash basada en un temporizador y crear una emergencia para compras rápidas.
Funciona bien con otros cupones y ofertas que se ejecutan en la tienda
La aplicación PWA también funciona para todos los cupones y vales activados en su sitio web OpenCart. Proporcionará a los usuarios de la aplicación web progresiva los mismos cupones de descuento y vales que los usuarios del sitio web.
Permite compartir productos en las redes sociales
Un cliente cree en los demás clientes. La aplicación web OpenCart Progressive permite a los usuarios de la aplicación compartir su elección de productos beneficiosos en varias redes sociales con sus amigos y familiares e inspirarlos a comprar productos.
Ofrezca a sus clientes de OpenCart una experiencia de compra perfecta
Todos los propietarios de tiendas buscan las estrategias adecuadas para brindar una mejor experiencia de cliente a sus clientes nuevos y existentes. La PWA tiene algunas características avanzadas que brindan efectivamente un gran experiencia del cliente.
# 1- Funciona bien en una red inestable
Incluso con una conexión lenta y sin conexión a Internet, esta aplicación OpenCart PWA funcionará. Cada vez que deseen buscar elementos o preseleccionarlos, los usuarios no tendrían que esperar a tener una buena conectividad a Internet. ¡Aunque no es magia! Esto sucede debido a los archivos de caché guardados.
# 2- Admite múltiples métodos de pago
En su aplicación OpenCart PWA, todas las opciones de pago disponibles en su sitio web OpenCart también estarán activas. Este complemento para el creador de la aplicación sincroniza todos los métodos de pago de la vista web.
# 3- Puedes agregar varios métodos de envío
En su aplicación PWA, cualquier tipo de método de envío activo en su tienda OpenCart también funciona a la perfección. La aplicación web OpenCart Progressive significa que los usuarios pueden gestionar fácilmente el envío y la distribución de mercancías.
# 4- El pago de una página reduce el abandono del carrito de anuncios de la tasa de rebote
Además, la aplicación web progresiva OpenCart viene con un Una página de pago donde solo las entradas requeridas se obtienen de los clientes. Antes de realizar pedidos exitosos, también les ayuda a revisar la información completa del pedido de una sola vez y así minimizar el abandono del carrito.
Conclusión: Puede que esté de acuerdo con el sitio web que está utilizando, pero convertirlo en una aplicación web progresiva puede hacer maravillas. Hay varias historias de éxito de grandes marcas que convirtieron sus tiendas en PWA y los cambios que han observado fueron notables.
Lectura recomendada:
Puedes haz clic aquí y realice un recorrido de demostración de la aplicación web progresiva OpenCart. Nosotros en KnowBand Cree aplicaciones móviles personalizadas para casi todas las principales plataformas de comercio electrónico. Puede discutir las ideas de su proyecto con nuestros expertos en support@knowband.com. Y deje un comentario y avísenos si encuentra útil este artículo. Lectura recomendada:
Hoy en día, las personas pasan mucho más tiempo utilizando dispositivos móviles para acceder a Internet y consumen el doble de los datos que consumen en los sitios web de escritorio. Eso también se aplica a los estándares de compras en línea. Usar un sitio web de comercio electrónico para generar ventas es un desafío cuando tiene una conectividad a Internet inestable. Y pedir a los usuarios que instalen una aplicación móvil vuelve a ser un asesino de conversiones. PWA (aplicación web progresiva) encaja entre la aplicación móvil nativa y el navegador del sitio web y es más probable que esté diseñada para impulsar las conversiones móviles para las tiendas de comercio electrónico. Progressive Web App es el nuevo formato imprescindible para la marca móvil de su empresa. Las aplicaciones móviles de PWA han superado el problema de distribución más alarmante. ¿Alguna vez va a su navegador para la navegación de Google Maps? ¡Probablemente no! La investigación dice que la mayoría de los usuarios, alrededor del 87%, eligen navegar en aplicaciones nativas. Eso hace que sea obligatorio tener la aplicación instalada en el dispositivo del usuario. La aplicación móvil PWA se deriva directamente del navegador móvil del sitio web y no es necesario visitar ninguna tienda de aplicaciones de terceros o medio para instalar la aplicación. En realidad, cada vez que un usuario abre un sitio web activo de PWA en un navegador móvil, un mensaje de aviso solicita “Agregar aplicación a la pantalla de inicio”. Los desarrolladores de aplicaciones y los trabajadores de servicios (archivos de script) en combinación crean PWA para ofrecer una experiencia de usuario dinámica y fluida al acceder al contenido a través de un sitio web / aplicación web.
Introducción a la aplicación web progresiva
Las aplicaciones web progresivas, también conocidas como PWA, son versiones mejoradas de aplicaciones web, desarrolladas con javascript. Las PWA tienen capacidades adicionales, como que el usuario puede acceder a ellas sin conexión y también recibir notificaciones automáticas basadas en los estándares de marketing. PWA mejora el rendimiento, la seguridad, la accesibilidad y las funciones de SEO de su sitio web. Mejora su confiabilidad y flujo de trabajo. Le permiten trabajar sin conexión y en redes inestables. Las aplicaciones web progresivas son rápidas y atractivas. Los PWA tienen una navegación fluida y están repletos de animaciones fluidas, desplazamiento sin interrupciones que lo hace más rápido.
Principales ventajas de la aplicación web progresiva
Para crear aplicaciones web eficientes, las aplicaciones web progresivas (PWA) son más una técnica que incluye una combinación de tecnologías. Con una interfaz de usuario mejorada, las personas pueden pasar más tiempo en sitios web y ver más publicidad. Prefieren comprar más y es más probable que regresen regularmente con notificaciones de advertencia.
# 1. Desempeño confiable
Un sitio web típico obliga a los usuarios a esperar mientras está ocupado haciendo viajes al servidor, sin hacer nada. Cada solicitud de la red para obtener un activo o un dato pasa a través de un trabajador del servicio, quien primero verifica si la respuesta a una solicitud específica ya está en la caché. Como los usuarios obtienen contenido real de inmediato, incluso en un enlace incorrecto, confían más en la aplicación y la ven como más confiable.
# 2. Carga rapida
Esta interfaz de usuario no es inestable. El desplazamiento es fluido y la aplicación reacciona fácilmente a la interacción del usuario. Su aplicación web progresiva será naturalmente más rápida que las aplicaciones nativas, siendo liviana y con un mecanismo de carga rápido. Esto proporciona a los usuarios de la aplicación una experiencia de usuario excepcional que mantiene los servicios a la par.
# 3. Más atractivo
Se ve y se siente como una aplicación nativa. En la pantalla de inicio del usuario, una PWA puede obtener una ubicación. Al ofrecer un entorno de trabajo de pantalla completa, proporciona una experiencia similar a una aplicación nativa. Para mantener activos a los usuarios, utiliza notificaciones push.
# 4. Uso sin conexión
El patrón de “sin conexión primero o” caché primero “es la técnica más común para entregar contenido al usuario. Si un recurso está en caché y se puede verificar la accesibilidad sin conexión antes de descargar el contenido. Descárguelo si aún no está en la caché y guárdelo para uso futuro.
# 5. Notificaciones push
Las notificaciones push aumentan efectivamente la tasa de conversión de su tienda de comercio electrónico. Las PWA permiten a los propietarios de la tienda configurar y enviar notificaciones push ilimitadas. Tienen funcionalidad incorporada para automatizarlos y programarlos. Usar títulos y gráficos llamativos en sus notificaciones puede hacer maravillas.
¿Por qué debería tener una aplicación web progresiva?
Si bien una PWA no es una funcionalidad imprescindible, es una forma de mejorar su relación con los clientes actuales y potenciales y, al mismo tiempo, superar el difícil desafío de los visitantes que abandonan el sitio web. Muchas personas se olvidan de las indicaciones para ingresar a una lista de correo electrónico y, a veces, no dan el siguiente paso para abrir y leer los correos electrónicos, pero puede desarrollar una lealtad real a la marca si logra que un cliente use su aplicación web progresiva. Google admite las PWA desde 2015 y ahora iOS también las permite en su navegador web. Google puntúa mejor las aplicaciones web progresivas durante el rastreo y otras prácticas. Se crean varias extensiones de Google Chrome para admitir las PWA. PWA puede ser una buena idea si está iniciando su nuevo sitio web. Tiene sentido distribuir su aplicación web a los usuarios, al principio, para obtener sus comentarios antes de crear su aplicación móvil receptiva. La aplicación web progresiva no se puede reemplazar con aplicaciones móviles receptivas, pero de alguna manera cuando planea lanzar su aplicación móvil, es una buena opción para comenzar.
KnowBand desarrolló PWA para varias plataformas de comercio electrónico:
La extensión Progressive Web App Builder está disponible para casi todas las principales plataformas de comercio electrónico. El administrador de la tienda solo necesita elegir el complemento correcto e instalarlo para seguir las pautas simples para la configuración.
Principales funciones de las extensiones de aplicaciones web progresivas
Las características que se mencionan a continuación son las más destacadas y están todas juntas y nuestros expertos de Knowband desarrollaron la aplicación web progresiva. La aplicación es ligera, se carga más rápido y tiene un rendimiento mejorado. La aplicación PWA Mobile admite monedas multilingües y varias que le permiten expandir su negocio a nivel mundial.
1. Cambie la apariencia de la PWA- El dueño de la tienda puede cambiar los colores, agregar un logo de marca y varios diseños para que se vea bien. Incluso el diseño completo de la pantalla de inicio se puede editar y cambiar a través de un editor de bricolaje. Los cambios se reflejarán en la aplicación real en cualquier momento.
2. Listado de productos destacados Diseñado de manera que el usuario pueda agregar diferentes elementos basados en productos / categorías. El administrador de la tienda puede mostrar los productos más vendidos, destacados, comprados recientemente, etc. en la pantalla de inicio.
3. Fácil instalación Los usuarios no necesitan visitar ninguna tienda de aplicaciones de terceros. En su lugar, la aplicación móvil PWA se puede agregar directamente al teléfono abriendo el sitio web en un navegador móvil.
4. Confiable y atractivo: la aplicación móvil de comercio electrónico PWA funciona perfectamente con una conexión a Internet lenta o nula. Incluso en modo fuera de línea, los datos almacenados en caché y las páginas cargadas previamente hacen que el contenido esté disponible para los usuarios de la aplicación.
5. Correo electrónico e inicio de sesión social El propietario de la tienda puede permitir que los usuarios se registren agregando una dirección de correo electrónico o con sus cuentas de redes sociales.
6. Soporte para todos los métodos de pago y envío El cliente a menudo se recupera debido a los métodos de envío y pago limitados, pero con PWA, esto ya no es un desafío. Todos los métodos de pago y envío del sitio web funcionarán activamente en la aplicación móvil PWA.
7. Modo sin conexión Incluso sin una conexión a Internet o en una red lenta, su aplicación PWA funcionará correctamente. Los usuarios no tendrán que depender de Internet en todo momento para comprar artículos de aplicaciones.
8. Pago de una página, notificaciones push ilimitadas, sincronización en vivo, y Seguimiento De Pedidos características similares son las ventajas adicionales de PWA.
9. Venta cruzada– Le permite mostrar productos relacionados para mejorar las ventas en PWA. También permite al gerente de la tienda seleccionar las páginas CMS del sitio web y se optimizarán automáticamente. Aquí hay un lista de beneficios ofrecidos por PrestaShop PWA (Aplicación web progresiva). Hemos desarrollado las PWA para muchos clientes y algunos de los historias de éxito para 2020 se analizan en nuestro artículo anterior.
Conclusión:
Convierta el sitio web de comercio electrónico en línea en la aplicación para teléfonos inteligentes de PWA y brinde a los visitantes móviles una aplicación de compras web perfecta. Las PWA altamente atractivas se pueden iniciar desde la pantalla de inicio, ya que puede agregar un ícono e incluso enviar notificaciones automáticas. Este es un gran ejemplo de desarrollo tecnológico y tiene mucho alcance en el avance futuro. Las aplicaciones web progresivas todavía están en su infancia, como se describe, pero es un momento emocionante para experimentar con las metodologías que las respaldan y ver qué tan bien pueden relacionarse con sus aplicaciones web. No dude en comentar en el hilo si tiene comentarios sobre los lugares que le gustaría ver cubiertos.
Este complemento listo para usar está diseñado y desarrollado por KnowBand para convertir su tienda WooCommerce en ejecución en una aplicación web progresiva rica en funciones. Una vez que la tienda de comercio electrónico se transforme en una aplicación PWA, cada vez que un usuario abra la URL de la tienda en el navegador móvil, se le pedirá a la persona interesada que “Agregue PWA a la pantalla de inicio”. Una vez que la aplicación móvil WooCommerce PWA se agrega a la pantalla de inicio del dispositivo móvil, el usuario puede navegar por la tienda en la aplicación como cualquier otra aplicación. La aplicación móvil WooCommerce PWA es una aplicación web que en realidad no depende de la publicación de aplicaciones en Google Play y Apple App Store. Los usuarios pueden simplemente agregar la aplicación web progresiva al dispositivo móvil y usarla como cualquier otra aplicación.
1.1 Características atractivas para elegir WooCommerce PWA:
– Carga más rápida y rendimiento rápido – Pantalla de inicio totalmente personalizable con el editor de bricolaje – Admite todos los métodos de pago y envío del sitio web – Interfaz atractiva y fácil de usar – Sin dependencia de las tiendas de aplicaciones – Totalmente personalizado para su tienda – Correo electrónico e inicio de sesión social (Google y Facebook ) – Soporte multilingüe y RTL – Funcionamiento en modo sin conexión – Sitio web y aplicación de sincronización en vivo en blanco y negro – Compatible con Android e iOS – Pago en una página – Aplicación liviana – Administración de páginas CMS
1.2 Ver la demostración de WooCommerce PWA
Explore las funciones del módulo y la aplicación PWA desde los siguientes enlaces de demostración:
�> Los dispositivos iOS no ofrecen ningún aviso incorporado de “Agregar a la pantalla de inicio”, por lo que los usuarios deben agregar manualmente la aplicación móvil PWA a la pantalla de inicio del iPhone o iPad. �> iOS no admite notificaciones web push. Por lo tanto, las notificaciones automáticas no se recibirán en la PWA instalada en el iPhone o iPad.
[NUEVA ACTUALIZACIÓN] WooCommerce PWA admite secuencias de comandos de lenguaje RTL:
El creador de aplicaciones web progresivas de WooCommerce ahora es compatible con todos los idiomas del mundo, incluidos los RTL (de derecha a izquierda), como el árabe, el hebreo, el persa, etc. El administrador de la tienda ahora puede incluso agregar idiomas RTL en la aplicación móvil WooCommerce PWA.
Pantallas del panel de administración 2.0:
Explore todas las configuraciones en el Panel de administración de la aplicación móvil WooCommerce PWA y verifique cómo funcionan con la ayuda a continuación:
2.1 Configuración general:
a) Mostrar/ocultar vista previa: Toque el botón del ojo para mostrar/ocultar el teléfono de vista previa en el panel de administración. b) Habilitar/Deshabilitar: Habilite el módulo para que PWA funcione en dispositivos móviles. c) Habilitar informes de registro de solicitudes: Habilitar el registro de errores en el móvil. d) Redirigir en la página del carrito cuando se agrega al carrito: Controle la redirección del botón Agregar al carrito cada vez que cualquier usuario toque el botón Agregar al carrito. e) Mostrar descripción breve: Habilite y muestre una breve descripción del producto (si se agrega en la página del producto del sitio web). f) Mostrar la ventana emergente Agregar a la pantalla de inicio: Ofrezca el mensaje emergente “Agregar a la pantalla de inicio” y permita a los usuarios agregar la aplicación PWA en los dispositivos móviles. g) Habilitar logotipo: Agregue el logotipo de su marca en el encabezado de la aplicación móvil WooCommerce PWA.
h) Color de fondo de la pantalla de bienvenida: Elija y establezca el color de la pantalla de bienvenida de la aplicación web progresiva de WooCommerce. i) Nombre de la aplicación PWA: Ingrese el nombre deseado para la aplicación WooCommerce PWA. Se mostrará una vez que el usuario agregue la aplicación en los dispositivos móviles. j) Imagen para el icono de la aplicación: Agregue la imagen del icono de la aplicación en el panel de administración. k) Seleccione la fuente de la aplicación: Elija la fuente para su aplicación móvil WooCommerce PWA. l) Seleccionar diseño para la página de inicio: Elija entre el diseño de pantalla de inicio preagregado para la aplicación WooCommerce PWA.
m) Color del botón de la aplicación: Elija el color del botón para la aplicación móvil PWA. n) Color del tema de la aplicación: Elija el color del tema para la aplicación PWA. o) Color de fondo de la aplicación: Elija el color de fondo para la aplicación PWA. p) Habilitar barra de pestañas: Habilite la barra de pestañas en la parte inferior de la aplicación PWA para una navegación más rápida y sencilla. q) CSS personalizado: Ingrese el código CSS para mejorar la apariencia de las páginas de vista web de la aplicación PWA, como el pago de vista web, las páginas de CMS, etc.
2.2 Configuración de notificaciones automáticas
Las notificaciones automáticas son la mejor herramienta de marketing para la aplicación PWA para WooCommerce. El administrador de la tienda puede simplemente promocionar los productos y ofertas de la tienda a los usuarios de la aplicación y generar más ventas e ingresos. Ingrese todos los detalles en la configuración de notificaciones automáticas creando un proyecto de Firebase:
¿Cómo configurar una cuenta de Firebase?
Paso 1:�Iniciar sesión en Google Firebase
Paso 2:Crear un nuevo proyecto Al hacer clic en Agregar proyecto, aparecerá el siguiente cuadro de diálogo:
Tardará unos segundos en crear el proyecto. Una vez que el proyecto esté listo, haga clic en continuar.
Paso 3:Administrar la configuración del proyecto Una vez creado el proyecto, haga clic en Configuración del proyecto.
Paso 4:�Ir a Opciones de autenticación:
Paso 5:�Buscar claves de Firebase En la configuración del proyecto, haga clic en Configuración de mensajería en la nube. Desde aquí, puede obtener directamente la clave del servidor.
Paso 6:�Agregue su Web-App a Firebase
Paso 7:Obtenga otros detalles relacionados con firebase y péguelos en el panel de administración del módulo PWA.
Paso 8:Obtenga la clave del servidor Firebase desde la pestaña de mensajería en la nube en Configuración:
Paso 9:�Agrega tu dominio en autenticación>>iniciar sesión.
A) Notificación de envío de pedido exitoso:
Habilite/desactive la notificación automática automática que se enviará a los usuarios de la aplicación cada vez que realicen un pedido exitoso desde la aplicación WooCommerce PWA.
B) Notificación automática de actualización del estado del pedido:
Habilite/desactive la notificación automática automática que se envía cada vez que se actualiza el estado del pedido desde la aplicación. Los usuarios de la aplicación móvil WooCommerce PWA pueden controlar los detalles de los pedidos anteriores.
C) Notificación automática de carrito abandonado:
Habilitar/deshabilitar la notificación automática enviada a los usuarios que abandonan los productos en el carrito sin una compra exitosa. Esta notificación automática se enviará a los usuarios automáticamente después del intervalo de tiempo ingresado.
2.3 Historial de notificaciones push
El historial completo de notificaciones push de las notificaciones push enviadas con éxito se verá aquí. El administrador de la tienda puede realizar un seguimiento de las notificaciones push enviadas anteriormente desde aquí.
A) Enviar Notificación:
Personalice y envíe notificaciones automáticas manualmente a los usuarios de la aplicación PWA según la necesidad. El administrador de la tienda puede configurar estas notificaciones por su cuenta y enviarlas a los usuarios de la aplicación WooCommerce PWA.
Diseño de la página de inicio de 2.4:
La aplicación móvil WooCommerce PWA ofrece una pantalla de inicio personalizable cuyo diseño se puede diseñar desde el panel de administración con unos pocos clics del mouse y arrastrar y soltar. El diseño atractivo según el festival en curso, la venta, la ocasión, etc. seguramente puede ayudar a mejorar las ventas a través de las aplicaciones móviles WooCommerce PWA.
Agregue un nuevo diseño desde esta pestaña o edite los agregados anteriormente. Los ajustes de configuración de la página de inicio ofrecen los siguientes elementos:
a) Categorías principales:�
b) Bandera Cuadrada:�
c) Banner Deslizante Horizontal:�
d) Banners de cuadrícula:�
e) Banner del temporizador de cuenta regresiva:�
f) Productos Cuadrados:�
g) Productos Deslizantes:�
h) Productos de rejilla:�
2.5 Páginas de información:
Agregue páginas CMS en la aplicación y ofrezca contenido informativo a los usuarios de la aplicación móvil WooCommerce PWA.
¿Cómo obtener los detalles de la aplicación de Facebook?
La aplicación de Facebook se puede crear siguiendo los pasos mencionados a continuación:
Paso 1:�Ir a la URL dada: https://developers.facebook.com/apps/
Paso 2:�Haga clic en el botón “Agregar una nueva aplicación”.
Paso 3 y 4:Ingrese el nombre de su aplicación y la identificación de correo electrónico, luego haga clic en el botón “Crear ID de aplicación”.
Paso 5 y 6:Después de hacer clic en Crear ID de aplicación, deberá pasar por un control de seguridad como se muestra:
Paso 7:Haga clic en la pestaña “Configuración”.
Paso 8-13:�Estarán disponibles dos opciones en el menú desplegable, Básico y Avanzado, haga clic en “Básico”. Y luego ingrese su “Dominio de la aplicación”, “Correo electrónico de contacto”, “URL de privacidad”, “URL de términos y condiciones”, “Agregar logotipo”, “Seleccionar categoría” y haga clic en el botón “Guardar cambios”. Dominios de la aplicación: sudominio.com es correcto sudominio.com/tienda es incorrecto www.dominio.com es incorrecto
Paso 14:�Ahora haga clic en “+Agregar plataforma”.
Paso 15:�Y seleccione Sitio web como Plataforma.
Paso 16:Ahora ingrese la URL de su sitio.
Paso 17 y 18:�Haga clic en “Productos+” y seleccione iniciar sesión en Facebook.
Paso 19:�Seleccione web como la plataforma para la aplicación.
Paso 20:�Ahora haga clic en guardar.
Paso 21 y 22:�Haga clic en Configuración y agregue un URI de redirección de OAuth válido. URI de redireccionamiento de OAuth válidos: https://example.com/pwa-app/login
Paso 23 y 24:�Haga clic en “Revisión de la aplicación”. Y marque “Hacer público ‘el nombre de su aplicación'” en Sí.
Paso final:�Copie el ID de la aplicación y el Secreto de la aplicación y péguelos en los campos proporcionados en el módulo.
¿Cómo obtener los detalles de la aplicación de Google?
Vaya a Google Developers Console (https://console.developers.google.com/project) o haga clic en el enlace que se encuentra en la parte superior derecha de la pestaña respectiva en la página de configuración del módulo.
Ahora haga clic en Crear proyecto a la izquierda de la página.
Ingrese un nombre para su proyecto y continúe con el siguiente paso.
Ahora haga clic en API y autenticación-> Credenciales en el menú de la izquierda, como se muestra a continuación.
Haga clic en el botón Crear nuevo ID de cliente en el panel derecho de la pantalla.
Es posible que deba completar el formulario para la pantalla de consentimiento antes de continuar. Para hacerlo, debe hacer clic en Pantalla de consentimiento en el menú de la izquierda, como se muestra en la imagen de arriba.
Complete el formulario emergente con los detalles a continuación:
Tipo de aplicacion:�Aplicación Web. Orígenes autorizados de JavaScript:�El nombre de dominio de su tienda (https://www.yourstore.com). URI de redireccionamiento autorizado o URI de la página de redireccionamiento del iniciador de sesión:
https://example.com/pwa-app/login
Ahora haga clic en el botón Crear ID de cliente para obtener su ID de cliente y clave secreta de cliente.
Ahora puede usar el secreto del cliente y la identificación del cliente para permitir que sus clientes inicien sesión en su tienda usando su cuenta de Google.
3.0 Pantallas PWA frontales:
3.1 Pantalla de inicio:
La pantalla de inicio de la aplicación móvil WooCommerce PWA es totalmente personalizable con el editor DIY, como se explicó anteriormente en las pantallas del Panel de administración. Cambie la apariencia de la pantalla de inicio de la aplicación en cualquier momento y ofrezca una apariencia más fácil de usar y orientada a las ventas.
1. Diseño personalizado:
Usando varios banners, controles deslizantes, elementos de productos, el administrador de la tienda puede crear un diseño dinámico según la necesidad.
2. Logotipo de la marca:
Use el logotipo de su tienda en el encabezado superior de la aplicación WooCommerce PWA.
3. Bolsa de carrito de compras:
El ícono del carrito de compras en la esquina superior derecha de la pantalla de inicio permite a los usuarios acceder a la pantalla del carrito y verificar los productos agregados.
4. Menú de navegación izquierdo:
Explore las categorías que se muestran en la aplicación PWA con el menú de navegación izquierdo.
3.2 Menú Acordeón (Barra de Navegación):
Las aplicaciones móviles WooCommerce PWA vienen con una categorización perfecta y adecuada disponible. Los usuarios pueden encontrar categorías relevantes en el menú de navegación izquierdo y buscar productos. También se pueden agregar varias páginas de CMS en el menú que ofrecen contenido relevante en la aplicación.
1. Mi cuenta
La opción Mi cuenta contiene toda la información personal de los usuarios, incluido el envío y el pedido. Los compradores de la aplicación web progresiva de WooCommerce pueden ver y actualizar la información guardada.
2. Categorías
Las categorías que se muestran en el menú de navegación izquierdo de la aplicación web progresiva WooCommerce son las mismas que están disponibles en la tienda de comercio electrónico.
3. Páginas CMS
Desde aquí se puede acceder a varias páginas de CMS como Acerca de nosotros, Contáctenos, Términos y condiciones, etc. Estas páginas de información se pueden agregar desde el panel de administración de la extensión.
4. Idioma(s)
La opción de idioma permite a los usuarios de la aplicación PWA ver la aplicación web en el idioma deseado.
5. Moneda(s)
Todas las monedas disponibles en su sitio web se muestran aquí en la aplicación WooCommerce PWA.
6. Iniciar/Cerrar sesión
Los usuarios pueden iniciar/cerrar sesión fácilmente desde la aplicación WooCommerce PWA a través de esta opción.
3.3 Pantalla de categoría:
Las pantallas de categoría ordenadas con la vista de lista y cuadrícula permiten a los usuarios elegir lo que es mejor para ellos de una categoría específica. Todo el inventario de la tienda permanecerá sincronizado con la aplicación móvil WooCommerce PWA y las nuevas incorporaciones y cambios incluso se actualizarán en tiempo real.
1. Vista de lista y cuadrícula:
Las categorías en la aplicación PWA para WooCommerce se pueden explorar tanto en la vista de lista como en la de cuadrícula.
2. Clasificación de productos:
La opción de clasificación permite a los compradores en línea restringir los productos en el orden de clasificación deseado y encontrar el correcto.
3. Filtro de producto:
La aplicación móvil WooCommerce PWA ofrece la opción de filtrar productos simplificando la búsqueda de productos. Los compradores en línea pueden encontrar los productos deseados en categorías usando filtros para varios atributos como tamaño, color, precio, etc.
3.4 Pantalla del producto:
La pantalla del producto de la aplicación web progresiva WooCommerce es tan simple e intrigante como podría ser. Con todas las opciones e información necesarias sobre el producto, se convierte en cuestión de minutos para que los usuarios estén seguros sobre el producto.que está a punto de comprar. Las imágenes múltiples están disponibles para el producto con las opciones En stock y Agotado.
1. Información y cuidado del producto:
Aquí se mostrará la información completa del producto disponible en el inventario.
2. Descripción breve:
Los usuarios pueden leer la breve descripción de su producto para decidir rápidamente sobre la compra.
3. Opciones de productos:
Todas las opciones relacionadas con el producto como tamaño, color, etc. se muestran aquí.
5. Agregar al carrito:
Este botón permite a los usuarios agregar productos al carrito. Los usuarios pueden seguir procesando el carrito para la compra.
6. Intercambio social de productos:
La opción de compartir para el producto permite a los usuarios compartir productos en múltiples canales sociales.
Pantalla de inicio de sesión de 3.5
La aplicación móvil WooCommerce PWA ofrece opciones de inicio de sesión social con un solo toque y hace que el proceso de inicio de sesión/registro sea más fluido. La aplicación web progresiva WooCommerce ofrece inicio de sesión de Google y Facebook.
1. Iniciar sesión:
Los usuarios de la aplicación pueden autenticarse e iniciar sesión fácilmente en las aplicaciones PWA utilizando sus credenciales de inicio de sesión de correo electrónico anteriores.
2. Regístrate:
Todos los nuevos usuarios de la aplicación pueden registrarse y crear su cuenta en la tienda desde la aplicación WooCommerce PWA. El formulario de registro solicita solo los detalles necesarios para crear una cuenta.
3. Iniciar sesión con Facebook:
Los usuarios pueden iniciar sesión en la aplicación PWA utilizando sus credenciales de cuenta de Facebook.
4. Iniciar sesión con Google:
Los usuarios pueden iniciar sesión en la aplicación PWA con las credenciales de su cuenta de Google.
3.6 Pantalla del carrito de compras:
La pantalla del carrito de compras de la aplicación móvil WooCommerce PWA mostrará todos los productos agregados al carrito de compras. Los usuarios de la aplicación pueden ver el nombre del producto, la cantidad, el precio total y el costo de envío. Esta pantalla tiene las siguientes opciones:
1. Aplicar Vale:
Esta opción permite a los usuarios usar cupones del sitio web y obtener ofertas de descuento.
2. Precio total del producto:
Los usuarios pueden ver el costo completo de su bolsa de compras antes de continuar. Se actualiza automáticamente de acuerdo con cualquier actualización con cantidad de producto o nueva incorporación.
3. Actualizar cantidad de producto:
Los usuarios de la aplicación PWA pueden incluso actualizar la cantidad del producto con la opción “Actualizar cantidad”.
4. Eliminar producto:
Los usuarios de la aplicación pueden simplemente eliminar el producto del carrito simplemente tocando la opción “Eliminar”.
5. Continuar comprando:
Los usuarios de la aplicación pueden dejar el carrito para buscar más productos en su aplicación.
6. Continuar para pagar:
Los usuarios de la aplicación PWA pueden continuar con las pantallas de pago y pago simplemente tocando la opción “Continuar con el pago”.
Pantalla de pago 3.7
La aplicación web progresiva para WooCommerce tiene un pago simplificado en una sola pantalla con solo información relevante. Los usuarios de la aplicación pueden ver detalles completos de pago, como detalles de envío, detalles de facturación, resumen del pedido, comentario del pedido, resumen del pago.
1. Detalles de envío y facturación:
Esta pantalla proporciona detalles de las direcciones de envío y facturación guardadas por el usuario. El usuario también puede editar/guardar la nueva dirección de envío si es necesario.
2. Resumen del pedido:
Los usuarios de la aplicación pueden ver los detalles del producto antes de realizar el pago.
3. Métodos de envío:
Todos los métodos de envío disponibles se muestran aquí. Los usuarios pueden elegir el que se adapte a sus necesidades.
4. Comentario del pedido:
Los usuarios también pueden agregar cualquier comentario relacionado con su pedido que será visible para el administrador de la tienda en la página web del pedido en el backend.
5. Resumen de pago:
Esta sección muestra los detalles completos del pago desglosado relacionados con la compra.
6. Proceder al pago:
Los usuarios de la aplicación PWA serán redirigidos a la pantalla de pago después de tocar el botón “Continuar con el pago”.
3.8 Pantalla de pago:
La pantalla de pago de la aplicación WooCommerce PWA tiene todos los pagos de vista web disponibles en la tienda. Los compradores en línea pueden encontrar experiencias de pago similares tanto en sitios web como en aplicaciones.
3.9 Pantalla Mi cuenta
La pantalla Mi cuenta de la aplicación móvil WooCommerce PWA permite a los compradores en línea ver sus detalles completos guardados en la aplicación web progresiva. Esta pantalla también muestra una lista de pedidos de aplicaciones anteriores.
1. Datos personales:
Los usuarios pueden ver y actualizar sus datos personales guardados previamente en la aplicación móvil de PWA.
2. Dirección(es) de envío:
Los usuarios de la aplicación pueden ver la lista completa de direcciones de envío guardadas previamente en la aplicación PWA.
3. Detalles del pedido:
Los usuarios de la aplicación pueden ver la lista completa de los pedidos realizados anteriormente desde la aplicación PWA y sus detalles.
4. Función de reordenación:
Hay un botón de pedido directo en la pantalla Mi cuenta de la aplicación PWA. Todos los productos anteriores bajo este pedido se agregarán al carrito con solo un botón.
3.91 Pantalla de detalles del pedido
La pantalla de detalles del pedido de la aplicación web progresiva WooCommerce proporciona detalles completos de pedidos específicos de la aplicación PWA. Los usuarios pueden ver fácilmente la dirección de envío, el resumen del producto, el método de envío y pago, y el resumen del costo total, etc. Incluso ofrece la opción de realizar un seguimiento del estado del pedido y la entrega.
Esta extensión automatizada de OpenCart se creó con el motivo de facilitar que los propietarios de tiendas en línea transformen su tienda en una aplicación web progresiva. La tienda de comercio electrónico en PWA es una de las principales tecnologías avanzadas que todo negocio de comercio electrónico debe buscar. La aplicación móvil OpenCart PWA es en realidad una aplicación web que no depende de las tiendas de aplicaciones de terceros (Google Play y Apple App Store). Los compradores en línea pueden fácilmente “Agregar la aplicación PWA a la pantalla de inicio” y comprar productos sobre la marcha como cualquier otra aplicación.
1.1 ¿Cómo funciona la aplicación web progresiva OpenCart (PWA)?
Una vez que la tienda de comercio electrónico se convierta a la aplicación móvil OpenCart PWA, cada vez que un usuario abra la URL de la tienda en el navegador móvil, se le pedirá a los usuarios que “Agreguen PWA a la pantalla de inicio”. Es así de simple instalar y usar la aplicación web progresiva OpenCart.
1.2 Funciones principales para elegir OpenCart PWA:
Carga más rápida y rendimiento rápido
Pantalla de inicio totalmente personalizable con editor de bricolaje
Soporte para todos los métodos de pago y envío del sitio web
Notificaciones push ilimitadas (tanto notificaciones automáticas como personalizadas)
Notificación push de carrito abandonado
Soporte de chat de Zopim y WhatsApp
Interfaz atractiva y fácil de usar
Sin dependencia de las tiendas de aplicaciones
Totalmente de marca para su tienda (Etiqueta Blanca)
Correo electrónico e inicio de sesión social (Google y Facebook)
Soporte multilingüe y RTL
Funcionamiento en modo sin conexión
Funcionalidad de lista de deseos incorporada
Sitio web y aplicación de sincronización en vivo en blanco y negro
Actualización automática de inventario
Compatibilidad con varios dispositivos
Pago de una página
Aplicación ligera
Gestión de páginas CMS
Productos relacionados en Progressive Web App
Reseñas de usuarios para productos en PWA
Soporte de monedas múltiples
Asistencia con cupones / vales
[IMP] Notas para iOS PWA:
�> Los dispositivos iOS (iPhone, iPad, etc.) no ofrecen ningún mensaje incorporado “Agregar a la pantalla de inicio”. Por lo tanto, los usuarios de la aplicación móvil PWA deben agregar manualmente la aplicación móvil OpenCart PWA a la pantalla de inicio de iPhone o iPad. �> iOS no admite notificaciones web push. Por lo tanto, el administrador de la tienda solo puede enviar notificaciones automáticas al dispositivo Android, no al iOS.
OpenCart PWA Mobile App Creator ahora admite varios idiomas, incluidos los scripts RTL (de derecha a izquierda) como árabe, hebreo, persa, etc. Todos los idiomas de la tienda OpenCart estarán en la aplicación web progresiva y también se pueden agregar otros idiomas requeridos. Los usuarios pueden elegir el idioma en la aplicación web progresiva y todo el contenido de la aplicación se traducirá en consecuencia.
Totalmente compatible con KnowBand Multi-vendor Marketplace:
Nuestra aplicación móvil OpenCart PWA es compatible con Mercado OpenCart de múltiples proveedores. Convierta su tienda de comercio electrónico OpenCart en un mercado completo y ejecute la aplicación móvil PWA para el mismo. Los vendedores del mercado estarán disponibles en su aplicación web progresiva y los usuarios también pueden navegar por ellos.
Nota: Las aplicaciones móviles de OpenCart PWA solo están centradas en el cliente, es decir, los usuarios pueden visitar la aplicación de navegación PWA junto con los vendedores. No habrá ningún panel de control o administración del vendedor a través de la aplicación web progresiva OpenCart. El administrador puede administrar a los vendedores desde la web del mercado y lo mismo se actualizará automáticamente en la aplicación móvil de PWA.
1.3 Ver la demostración de OpenCart PWA:
Explore las funciones del módulo y la aplicación PWA desde los siguientes enlaces de demostración:
(Copiar y pegar URL en el navegador móvil y “Agregar a la pantalla de inicio”)
Pantallas del panel de administración 2.0:
Explore todas las configuraciones del panel de administración de la extensión de la aplicación móvil OpenCart PWA junto con la funcionalidad y trabaje con las instantáneas compartidas a continuación:
2.1 Configuración general:
a) Mostrar/ocultar vista previa: Toque el botón del ojo para mostrar/ocultar el teléfono de vista previa en el panel de administración. b) Estado: Habilite el módulo para que PWA funcione en dispositivos móviles. c) Habilitar informes de registro de solicitudes: Habilitar el registro de errores en el móvil. d) Nombre de la aplicación PWA: Ingrese el nombre de la aplicación OpenCart PWA. e) Seleccionar diseño para la página de inicio: Elija entre el diseño de pantalla de inicio preagregado para la aplicación web progresiva OpenCart.
f) Habilitar barra de pestañas: Habilite la barra de pestañas en la parte inferior de la aplicación OpenCart PWA para una navegación perfecta. g) Fuente para la aplicación PWA: Elija una fuente para OpenCart Progressive Web App (PWA). h) Color del botón de la aplicación: Elija el color del botón para la aplicación móvil PWA. i) Color del tema de la aplicación: Elija el color del tema para la aplicación PWA. j) Color de fondo de la aplicación: Elija el color de fondo para la aplicación PWA. k) Color de la pantalla de bienvenida de la aplicación: Elija una pantalla de inicio para la aplicación móvil PWA. l) Habilitar logotipo: Agregue el logotipo de su marca en el encabezado de la aplicación móvil OpenCart PWA.
m) Imagen para el icono de la aplicación: Agregue la imagen del icono de la aplicación en el panel de administración de la extensión OpenCart PWA. n) Redirigir en la página del carrito cuando se agrega al carrito: Controle la redirección del botón Agregar al carrito cada vez que cualquier usuario toque el botón Agregar al carrito.
2.2 Configuración de notificaciones automáticas
Las notificaciones automáticas son la mejor herramienta de marketing para la aplicación web progresiva (PWA) para OpenCart. El administrador de la tienda puede simplemente promocionar los productos y ofertas de la tienda a los usuarios de la aplicación y generar más ventas e ingresos. Ingrese todos los detalles en la configuración de notificaciones automáticas creando un proyecto de Firebase:
¿Cómo configurar una cuenta de Firebase?
Paso 1:�Iniciar sesión en Google Firebase
Paso 2:Crear un nuevo proyecto Al hacer clic en Agregar proyecto, aparecerá el siguiente cuadro de diálogo:
Tardará unos segundos en crear el proyecto. Una vez que el proyecto esté listo, haga clic en continuar.
Paso 3:Administrar la configuración del proyecto Una vez creado el proyecto, haga clic en Configuración del proyecto.
Paso 4:�Ir a Opciones de autenticación:
Paso 5:�Buscar claves de Firebase En la configuración del proyecto, haga clic en Configuración de mensajería en la nube. Desde aquí, puede obtener directamente la clave del servidor.
Paso 6:�Agregue su Web-App a Firebase
Paso 7:Obtenga otros detalles relacionados con firebase y péguelos en el panel de administración del módulo PWA.
Paso 8:Obtenga la clave del servidor Firebase desde la pestaña de mensajería en la nube en Configuración:
Paso 9:�Agrega tu dominio en autenticación>>iniciar sesión.
A) Notificación de envío de pedido exitoso:
Habilite / deshabilite la notificación automática automática que se enviará a los usuarios de la aplicación cada vez que realicen un pedido exitoso desde la aplicación web progresiva OpenCart (PWA).
B) Notificación automática de actualización del estado del pedido:
Habilite/desactive la notificación automática automática que se envía cada vez que se actualiza el estado del pedido desde la aplicación. Los usuarios de la aplicación móvil OpenCart PWA pueden controlar los detalles de los pedidos anteriores.
C) Notificación automática de carrito abandonado:
Habilitar/deshabilitar la notificación automática enviada a los usuarios que abandonan los productos en el carrito sin una compra exitosa. Esta notificación automática se enviará a los usuarios automáticamente después del intervalo de tiempo ingresado.
2.3 Historial de notificaciones push
El historial completo de notificaciones push de las notificaciones push enviadas con éxito se verá aquí. El administrador de la tienda puede realizar un seguimiento de las notificaciones push enviadas anteriormente desde aquí.
A) Enviar Notificación:
Personalice y envíe notificaciones automáticas manualmente a los usuarios de OpenCart Progressive Web App (PWA) según la necesidad. El administrador de la tienda puede configurar estas notificaciones por su cuenta y enviarlas a los usuarios de OpenCart Progressive Web App (PWA).
Diseño de la página de inicio de 2.4:
Diseñe y guarde múltiples diseños de diseño (ofertas, festivales, etc.) y simplemente elija el correcto desde el panel de administración para actualizar en OpenCart Progressive Web App.�
La aplicación web progresiva OpenCart (PWA) ofrece una pantalla de inicio personalizable cuyo diseño se puede diseñar desde el panel de administración con unos pocos clics del mouse y arrastrar y soltar. El diseño atractivo según el festival en curso, la venta, la ocasión, etc. seguramente puede ayudar a mejorar las ventas a través de las aplicaciones móviles OpenCart PWA.
Agregue un nuevo diseño desde esta pestaña o edite los agregados anteriormente. Los ajustes de configuración de la página de inicio ofrecen los siguientes elementos:
Categorías principales:�
Bandera cuadrada:
Banner deslizante horizontal:
Banner de cuadrícula:�
Banner del temporizador de cuenta regresiva:�
Productos cuadrados:�
Productos deslizantes:�
Productos de rejilla:�
¿Cómo obtener los detalles de la aplicación de Facebook?
La aplicación de Facebook se puede crear siguiendo los pasos mencionados a continuación:
Paso 1:�Ir a la URL dada: https://developers.facebook.com/apps/
Paso 2:�Haga clic en el botón “Agregar una nueva aplicación”.
Paso 3 y 4:Ingrese el nombre de su aplicación y la identificación de correo electrónico, luego haga clic en el botón “Crear ID de aplicación”.
Paso 5 y 6:Después de hacer clic en Crear ID de aplicación, deberá pasar por un control de seguridad como se muestra:
Paso 7:Haga clic en la pestaña “Configuración”.
Paso 8-13:�Estarán disponibles dos opciones en el menú desplegable, Básico y Avanzado, haga clic en “Básico”. Y luego ingrese su “Dominio de la aplicación”, “Correo electrónico de contacto”, “URL de privacidad”, “URL de términos y condiciones”, “Agregar logotipo”, “Seleccionar categoría” y haga clic en el botón “Guardar cambios”. Dominios de la aplicación: sudominio.com es correcto sudominio.com/tienda es incorrecto www.dominio.com es incorrecto
Paso 14:�Ahora haga clic en “+Agregar plataforma”.
Paso 15:�Y seleccione Sitio web como Plataforma.
Paso 16:Ahora ingrese la URL de su sitio.
Paso 17 y 18:�Haga clic en “Productos+” y seleccione iniciar sesión en Facebook.
Paso 19:�Seleccione web como la plataforma para la aplicación.
Paso 20:�Ahora haga clic en guardar.
Paso 21 y 22:�Haga clic en Configuración y agregue un URI de redirección de OAuth válido. URI de redireccionamiento de OAuth válidos: https://example.com/pwa-app/login
Paso 23 y 24:�Haga clic en “Revisión de la aplicación”. Y marque “Hacer público ‘el nombre de su aplicación'” en Sí.
Paso final:�Copie el ID de la aplicación y el Secreto de la aplicación y péguelos en los campos proporcionados en el módulo.
¿Cómo obtener los detalles de la aplicación de Google?
Vaya a Google Developers Console (https://console.developers.google.com/project) o haga clic en el enlace que se encuentra en la parte superior derecha de la pestaña respectiva en la página de configuración del módulo.
Ahora haga clic en Crear proyecto a la izquierda de la página.
Ingrese un nombre para su proyecto y continúe con el siguiente paso.
Ahora haga clic en API y autenticación-> Credenciales en el menú de la izquierda, como se muestra a continuación.
Haga clic en el botón Crear nuevo ID de cliente en el panel derecho de la pantalla.
Es posible que deba completar el formulario para la pantalla de consentimiento antes de continuar. Para hacerlo, debe hacer clic en Pantalla de consentimiento en el menú de la izquierda, como se muestra en la imagen de arriba.
Complete el formulario emergente con los detalles a continuación:
Tipo de aplicacion:�Aplicación Web. Orígenes autorizados de JavaScript:�El nombre de dominio de su tienda (https://www.yourstore.com). URI de redireccionamiento autorizado o URI de la página de redireccionamiento del iniciador de sesión:
https://example.com/pwa-app/login
Ahora haga clic en el botón Crear ID de cliente para obtener su ID de cliente y clave secreta de cliente.
Ahora puede usar el secreto del cliente y la identificación del cliente para permitir que sus clientes inicien sesión en su tienda usando su cuenta de Google.
2.7 Páginas de información:
Agregue páginas CMS en la aplicación y ofrezca contenido informativo a los usuarios de la aplicación móvil OpenCart PWA.
3.0 Pantallas de la aplicación Front End PWA:
3.1 Pantalla de inicio:
La pantalla de inicio de la aplicación web progresiva OpenCart (PWA) es totalmente personalizable con un editor de bricolaje como se explicó anteriormente en las pantallas del Panel de administración. Cambie la apariencia de la pantalla de inicio de la aplicación en cualquier momento y ofrezca una apariencia más fácil de usar y orientada a las ventas.
1. Diseño personalizado:
Usando varios banners, controles deslizantes, elementos de productos, el administrador de la tienda puede crear un diseño dinámico según la necesidad.
2. Logotipo de la marca:
Use el logotipo de su tienda en el encabezado superior de la aplicación web progresiva OpenCart (PWA).
3. Bolsa de carrito de compras:
El ícono del carrito de compras en la esquina superior derecha de la pantalla de inicio permite a los usuarios acceder a la pantalla del carrito y verificar los productos agregados.
4. Menú de navegación izquierdo:
Explore las categorías que se muestran en la aplicación PWA con el menú de navegación izquierdo.
3.2 Menú Acordeón (Barra de Navegación)
Las aplicaciones móviles OpenCart PWA vienen con una categorización perfecta y adecuada disponible. Los usuarios pueden encontrar categorías relevantes en el menú de navegación izquierdo y buscar productos. También se pueden agregar varias páginas de CMS al menú que ofrecen contenido relevante en la aplicación.
1. Mi cuenta:
La opción Mi cuenta contiene toda la información personal de los usuarios, incluido el envío y el pedido. Los compradores de la aplicación web progresiva OpenCart pueden ver y actualizar la información guardada.
2. Categorías:
Las categorías que se muestran en el menú de navegación izquierdo de la aplicación web progresiva OpenCart son las mismas que están disponibles en la tienda de comercio electrónico.
3. Páginas de CMS:
Desde aquí se puede acceder a varias páginas de CMS como Acerca de nosotros, Contáctenos, Términos y condiciones, etc. Estas páginas de información se pueden agregar desde el panel de administración de la extensión.
4. Idioma(s):
La opción de idioma permite a los usuarios de la aplicación PWA ver la aplicación web en el idioma deseado.
5. Moneda(s):
Todas las monedas disponibles en su sitio web se muestran aquí en la aplicación OpenCart Progressive Web App (PWA).
6. Iniciar/Cerrar sesión:
Los usuarios pueden iniciar/cerrar sesión fácilmente desde la aplicación OpenCart PWA a través de esta opción.
3.3 Pantalla de categoría:
Las pantallas de categoría ordenadas con la vista de lista y cuadrícula permiten a los usuarios elegir lo que es mejor para ellos de una categoría específica. Todo el inventario de la tienda permanecerá sincronizado con la aplicación móvil OpenC Progressive Web App (PWA) y las nuevas incorporaciones y cambios incluso se actualizarán en tiempo real.
1. Vista de lista y cuadrícula:
Las categorías en la aplicación PWA para OpenCart se pueden explorar tanto en la vista de lista como en la de cuadrícula.
2. Clasificación de productos:
La opción de clasificación permite a los compradores en línea restringir los productos en el orden de clasificación deseado y encontrar el correcto.
3. Filtro de producto:
La aplicación móvil OpenCart PWA ofrece la opción de filtrar productos simplificando la búsqueda de productos. Los compradores en línea pueden encontrar los productos deseados en categorías usando filtros para varios atributos como tamaño, color, precio, etc.
3.4 Pantalla del producto:
La pantalla del producto de la aplicación web progresiva OpenCart es tan simple e intrigante como podría ser. Con todas las opciones e información necesarias sobre el producto, es cuestión de minutos para que el usuario esté seguro del producto que está a punto de adquirir. Las imágenes múltiples están disponibles para el producto con las opciones En stock y Agotado.
1. Información y cuidado del producto:
Aquí se mostrará la información completa del producto disponible en el inventario.
2. Descripción breve:
Los usuarios pueden leer la breve descripción de su producto para decidir rápidamente sobre la compra.
3. Opciones de productos:
Todas las opciones relacionadas con el producto como tamaño, color, etc. se muestran aquí.
4. Agregar al carrito:
Este botón permite a los usuarios agregar productos al carrito. Los usuarios pueden seguir procesando el carrito para la compra.
5. Intercambio social de productos:
La opción de compartir para el producto permite a los usuarios compartir productos en múltiples canales sociales.
Pantalla de inicio de sesión de 3.5
La aplicación móvil OpenCart PWA ofrece opciones de inicio de sesión social con un solo toque y hace que el proceso de inicio de sesión/registro sea más fluido. La aplicación web progresiva OpenCart ofrece inicio de sesión de Google y Facebook.
1. Iniciar sesión:
Los usuarios de la aplicación pueden autenticarse e iniciar sesión fácilmente en las aplicaciones PWA utilizando sus credenciales de inicio de sesión de correo electrónico anteriores.
2. Regístrate:
Todos los nuevos usuarios de la aplicación pueden registrarse y crear su cuenta en la tienda desde la aplicación OpenCart PWA. El formulario de registro solicita solo los detalles necesarios para crear una cuenta.
3. Iniciar sesión con Facebook:
Los usuarios pueden iniciar sesión en la aplicación PWA utilizando sus credenciales de cuenta de Facebook.
4. Iniciar sesión con Google:
Los usuarios pueden iniciar sesión en la aplicación PWA con las credenciales de su cuenta de Google.
3.6 Pantalla del carrito de compras:
La pantalla del carrito de compras de la aplicación móvil OpenCart PWA mostrará todos los productos agregados al carrito de compras. Los usuarios de la aplicación pueden ver el nombre del producto, la cantidad, el precio total y el costo de envío. Esta pantalla tiene las siguientes opciones:
1. Aplicar Vale:
Esta opción permite a los usuarios usar cupones del sitio web y obtener ofertas de descuento.
2. Precio total del producto:
Los usuarios pueden ver el costo completo de su bolsa de compras antes de continuar. Se actualiza automáticamente de acuerdo con cualquier actualización con cantidad de producto o nueva incorporación.
3. Actualizar cantidad de producto:
Los usuarios de la aplicación PWA pueden incluso actualizar la cantidad del producto con la opción “Actualizar cantidad”.
4. Eliminar producto:
Los usuarios de la aplicación pueden simplemente eliminar el producto del carrito simplemente tocando la opción “Eliminar”.
5. Continuar comprando:
Los usuarios de la aplicación pueden dejar el carrito para buscar más productos en su aplicación.
6. Continuar para pagar:
Los usuarios de la aplicación PWA pueden continuar con las pantallas de pago y pago simplemente tocando la opción “Continuar con el pago”.
Pantalla de pago 3.7
La aplicación web progresiva para OpenCart tiene un pago simplificado en una sola pantalla con solo información relevante. Los usuarios de la aplicación pueden ver detalles de pago completos, como detalles de envío, detalles de facturación, resumen del pedido, comentario del pedido, resumen del pago.
1. Detalles de envío y facturación:
Esta pantalla proporciona detalles de las direcciones de envío y facturación guardadas por el usuario. El usuario también puede editar/guardar la nueva dirección de envío si es necesario.
2. Resumen del pedido:
Los usuarios de la aplicación pueden ver los detalles del producto antes de realizar el pago.
3. Métodos de envío: aquí se muestran todos los métodos de envío disponibles. Los usuarios pueden elegir el que se adapte a sus necesidades.
4. Comentario del pedido:
Los usuarios también pueden agregar cualquier comentario relacionado con su pedido que será visible para el administrador de la tienda en la página web del pedido en el backend.
6. Resumen de pago:
Esta sección muestra los detalles completos del pago desglosado relacionados con la compra.
7. Proceder al pago:
Los usuarios de la aplicación PWA serán redirigidos a la pantalla de pago después de tocar el botón “Continuar con el pago”.
3.8 Pantalla de pago:
La pantalla de pago de la aplicación OpenCart PWA tiene todos los pagos de vista web disponibles en la tienda. Los compradores en línea pueden encontrar experiencias de pago similares tanto en sitios web como en aplicaciones.
3.9 Pantalla Mi cuenta
La pantalla Mi cuenta de la aplicación móvil OpenCart PWA permite a los compradores en línea ver sus detalles completos guardados en la aplicación web progresiva. Esta pantalla también muestra una lista de pedidos de aplicaciones anteriores.
1. Datos personales:
Los usuarios pueden ver y actualizar sus datos personales guardados previamente en la aplicación móvil de PWA.
2. Dirección(es) de envío:
Los usuarios de la aplicación pueden ver la lista completa de direcciones de envío guardadas previamente en la aplicación PWA.
3. Detalles del pedido:
Los usuarios de la aplicación pueden ver la lista completa de los pedidos realizados anteriormente desde la aplicación PWA y sus detalles.
4. Función de reordenación:
Hay un botón de pedido directo en la pantalla Mi cuenta de la aplicación web progresiva OpenCart (PWA). Todos los productos anteriores bajo este pedido se agregarán al carrito con solo un botón.
3.91 Pantalla de detalles del pedido
La pantalla de detalles del pedido de la aplicación web progresiva OpenCart proporciona detalles completos de pedidos específicos de la aplicación PWA. Los usuarios pueden ver fácilmente la dirección de envío, el resumen del producto, el método de envío y pago, y el resumen del costo total, etc. Incluso ofrece la opción de realizar un seguimiento del estado del pedido y la entrega.
Al estar en la industria del comercio electrónico minorista, debe haber encontrado la palabra PWA (aplicación web progresiva). En caso afirmativo, también debe tener en cuenta la capacidad que tienen como aplicación de compras. En caso de que no, has aterrizado en el lugar correcto. Con el crecimiento constante en el uso de aplicaciones de compras (tanto nativas como PWA), las tiendas en línea están cambiando al desarrollo de aplicaciones móviles PWA para sus negocios. Lanzar una aplicación web progresiva es una tarea bastante más simple y asequible en estos días. KnowBand ha lanzado la aplicación móvil Magento 2 PWA, una herramienta completa sin código y automatizada para lanzar una aplicación web progresiva. En palabras simples, cada vez que un usuario abra la URL de su tienda en el navegador móvil, recibirá un mensaje de “Agregar a la pantalla de inicio”. La aplicación web progresiva Magento 2 se agregará en el dispositivo del usuario como cualquier otra aplicación y las compras en línea se pueden realizar sobre la marcha.
1.1 Ver aplicación de demostración:
Explore la demostración de la aplicación web progresiva para Magento 2 y eche un vistazo a cómo se verán y funcionarán sus aplicaciones finales:
�> Los dispositivos iOS no ofrecen ningún mensaje incorporado “Agregar a la pantalla de inicio”. Los usuarios deben agregar manualmente la aplicación móvil Magento 2 PWA a la pantalla de inicio del iPhone o iPad. �> iOS no admite notificaciones web push. Las notificaciones automáticas solo se pueden enviar al dispositivo Android desde el panel de administración de Magento 2 PWA Mobile App Builder.
El creador de aplicaciones móviles Magento 2 PWA ahora es compatible con todos los idiomas del mundo, incluido RTL (de derecha a izquierda). La aplicación móvil PWA para Magento 2 puede tener idiomas como árabe, hebreo, persa, etc. El propietario de la tienda puede ofrecer todos los idiomas del sitio web en la aplicación web progresiva e incluso puede agregar otros nuevos.
Pantallas del panel de administración 2.0:
Con el backend del panel de administración amigable, el administrador de la tienda puede configurar y personalizar la apariencia y el funcionamiento de la aplicación móvil PWA. Es solo una cuestión de unos pocos clics y alternar el mouse para realizar cambios en las aplicaciones web progresivas de Magento 2. Veamos una descripción detallada de las pantallas del panel de administración:
2.1 Configuración general:
a) Habilitar la Extensión:Habilite el módulo Magento 2 PWA para que la aplicación web funcione en los teléfonos inteligentes de los usuarios.
b) Redirigir en la página del carrito cuando se agrega al carrito:Habilite para redirigir a los usuarios al carrito de compras o deshabilite para mantenerlos en la pantalla del producto.
c) Mostrar descripción breve:Habilite para agregar y mostrar una breve descripción en la pantalla del producto de Progressive Web App.
d) Habilitar informes de registro de solicitudes: Habilite esta pestaña para activar el archivo de registro en la aplicación móvil de PWA. Este archivo de registro se puede utilizar para rectificar cualquier comportamiento anormal de la aplicación web progresiva.
e) Mostrar vista previa de la aplicación: Habilite para agregar un teléfono de vista previa en el panel de administración. Todos los cambios de color, fuente y pantalla de inicio se mostrarán en el teléfono de vista previa en tiempo real.
f) Habilitar barra de pestañas: Agregue una barra de pestañas inferior en la aplicación móvil Magento 2 PWA.
g) Seleccionar diseño para la página de inicio:Elija los diseños deseados de los agregados y mejore la apariencia de la aplicación.
h) Imagen para el icono de la aplicación:Cargue el ícono de la aplicación Magento 2 PWA por su cuenta y cámbielo también si es necesario.
i) Nombre de la aplicación PWA:�Ingrese el nombre de la aplicación web progresiva Magento 2.
j) Seleccionar fuente para la aplicación PWA:Elija la fuente de su aplicación PWA para Magento 2.
k) Color del botón de la aplicación: Elija el color del botón para su aplicación móvil PWA.
l) Color del texto del botón de la aplicación: Elija el color del texto del botón para su aplicación web progresiva Magento 2.
m) Color del tema de la aplicación: Elija el color del tema (encabezado) de su aplicación web.
n) Color de fondo de la aplicación:Elija el color de fondo de la aplicación web progresiva.
o) Color de fondo de la pantalla de bienvenida: Elija la opción de color adecuada para el fondo de la pantalla de presentación de la aplicación PWA.
p) Métodos de envío deshabilitados: Elija los métodos de envío para que no funcionen en la aplicación móvil Magento 2 PWA.
q) Habilitar y cargar logotipo: Agregue la imagen del logotipo de su tienda para que se muestre en el encabezado de la aplicación PWA Mobile.
2.2 Configuración de notificaciones automáticas:
La aplicación web progresiva Magento 2 ofrece notificaciones automáticas ilimitadas al mercado y promueve ofertas y productos de la tienda. El administrador de la tienda recibirá notificaciones automáticas de por vida sin cargos adicionales.
Los diversos campos de esta pestaña de configuración requieren la configuración de una cuenta de Firebase. Así es como puede configurar uno:
¿Cómo configurar una cuenta de Firebase?
Paso 1: Iniciar sesión Google Firebase
Paso 2: Crear un nuevo proyecto Al hacer clic en Agregar proyecto, aparecerá el siguiente cuadro de diálogo:
Tardará unos segundos en crear el proyecto. Una vez que el proyecto esté listo, haga clic en continuar.
Paso 3: Administrar la configuración del proyecto Una vez creado el proyecto, haga clic en Configuración del proyecto.
Paso 4: Vaya a las opciones de autenticación:
Paso 5: Buscar claves de Firebase En la configuración del proyecto, haga clic en Configuración de mensajería en la nube. Desde aquí, puede obtener directamente la clave del servidor.
Paso 6: Agregue su aplicación web a Firebase
Paso 7: Obtenga otros detalles relacionados con firebase y pegue lo mismo en el panel de administración del módulo PWA.
Paso 8: Obtenga la clave del servidor Firebase desde la pestaña de mensajería en la nube en Configuración:
Paso 9: Agregue su dominio en autenticación>>iniciar sesión.
2.21 Notificaciones automáticas automáticas:
El administrador de la tienda puede programar el envío automático de notificaciones para los siguientes casos:
a) Configuración de nuevos pedidos:Siempre que se realice un nuevo pedido desde la aplicación móvil Magento 2 PWA.
b) Ajustes de cambio de estado del pedido: Siempre que se cambie/actualice el estado de entrega de cualquier pedido.
c) Configuración del carrito abandonado: Siempre que un usuario deje el producto en el carrito y abandone la aplicación web progresiva.
2.22 Notificación de inserción manual:
Como se muestra en la instantánea anterior, el administrador de la tienda puede personalizar y enviar notificaciones push manuales a los usuarios de la aplicación móvil de PWA. El mensaje, la imagen, el descuento ofrecido, el enlace de redirección se pueden agregar/editar para mejorar la eficiencia de la notificación y generar más ventas.
Diseño de la página de inicio de 2.3:
Magento 2 PWA Mobile App Builder ofrece un panel de edición de bricolaje totalmente personalizable para personalizar y configurar la apariencia de la aplicación web progresiva. Se pueden agregar varios diseños nuevos al panel de administración en función de los próximos festivales y ocasiones.
2.31 Categorías principales:
2.32 Bandera cuadrada:
2.33 Pancarta Deslizante:
2.34 Banner de cuadrícula:
2.35 Pancarta del temporizador de cuenta regresiva
2.36 Productos cuadrados:
2.37 Productos deslizantes:
2.38 Productos de rejilla:
¿Cómo obtener los detalles de la aplicación de Facebook?
La aplicación de Facebook se puede crear siguiendo los pasos mencionados a continuación:
Paso 1:�Ir a la URL dada: https://developers.facebook.com/apps/
Paso 2:�Haga clic en el botón “Agregar una nueva aplicación”.
Paso 3 y 4:Ingrese el nombre de su aplicación y la identificación de correo electrónico, luego haga clic en el botón “Crear ID de aplicación”.
Paso 5 y 6:Después de hacer clic en Crear ID de aplicación, deberá pasar por un control de seguridad como se muestra:
Paso 7:Haga clic en la pestaña “Configuración”.
Paso 8-13:�Estarán disponibles dos opciones en el menú desplegable, Básico y Avanzado, haga clic en “Básico”. Y luego ingrese su “Dominio de la aplicación”, “Correo electrónico de contacto”, “URL de privacidad”, “URL de términos y condiciones”, “Agregar logotipo”, “Seleccionar categoría” y haga clic en el botón “Guardar cambios”. Dominios de la aplicación: sudominio.com es correcto sudominio.com/tienda es incorrecto www.dominio.com es incorrecto
Paso 14:�Ahora haga clic en “+Agregar plataforma”.
Paso 15:�Y seleccione Sitio web como Plataforma.
Paso 16:Ahora ingrese la URL de su sitio.
Paso 17 y 18:�Haga clic en “Productos+” y seleccione iniciar sesión en Facebook.
Paso 19:�Seleccione web como la plataforma para la aplicación.
Paso 20:�Ahora haga clic en guardar.
Paso 21 y 22:�Haga clic en Configuración y agregue un URI de redirección de OAuth válido. URI de redireccionamiento de OAuth válidos: https://example.com/pwa-app/login
Paso 23 y 24:�Haga clic en “Revisión de la aplicación”. Y marque “Hacer público ‘el nombre de su aplicación'” en Sí.
Paso final:�Copie el ID de la aplicación y el Secreto de la aplicación y péguelos en los campos proporcionados en el módulo.
¿Cómo obtener los detalles de la aplicación de Google?
Vaya a Google Developers Console (https://console.developers.google.com/project) o haga clic en el enlace que se encuentra en la parte superior derecha de la pestaña respectiva en la página de configuración del módulo.
Ahora haga clic en Crear proyecto a la izquierda de la página.
Ingrese un nombre para su proyecto y continúe con el siguiente paso.
Ahora haga clic en API y autenticación-> Credenciales en el menú de la izquierda, como se muestra a continuación.
Haga clic en el botón Crear nuevo ID de cliente en el panel derecho de la pantalla.
Es posible que deba completar el formulario para la pantalla de consentimiento antes de continuar. Para hacerlo, debe hacer clic en Pantalla de consentimiento en el menú de la izquierda, como se muestra en la imagen de arriba.
Complete el formulario emergente con los detalles a continuación:
Tipo de aplicacion:�Aplicación Web. Orígenes autorizados de JavaScript:�El nombre de dominio de su tienda (https://www.yourstore.com). URI de redireccionamiento autorizado o URI de la página de redireccionamiento del iniciador de sesión:
https://example.com/pwa-app/login
Ahora haga clic en el botón Crear ID de cliente para obtener su ID de cliente y clave secreta de cliente.
Ahora puede usar el secreto del cliente y la identificación del cliente para permitir que sus clientes inicien sesión en su tienda usando su cuenta de Google.
3.0 Pantallas de la aplicación Front End PWA:
Eche un vistazo rápido a las pantallas perfectamente diseñadas de Progressive Web App para Magento 2:
3.1 Pantalla de inicio:
La pantalla de inicio de la aplicación web progresiva Magento 2 es totalmente personalizable desde el panel de administración del módulo. Puede diseñar el diseño de las pantallas de la aplicación de la forma que desee. Los diseños personalizados se pueden diseñar en el panel de administración en función de eventos, festivales, ocasiones, etc. y se pueden usar cuando sea necesario.
1. Diseño dinámico:
Usando varios elementos de diseño (banners, controles deslizantes, categorías, etc.), el administrador de la tienda puede crear un diseño dinámico según la necesidad.
2. Logotipo de la tienda:
Agregue el logotipo de la tienda en el encabezado de la aplicación PWA.
3. Carrito de compras:
El ícono del carrito de compras en la esquina superior derecha de la pantalla de inicio permite a los usuarios cambiar a la pantalla del carrito.
4. Menú de navegación:
Explore las categorías en las aplicaciones con el menú de navegación izquierdo en la pantalla de inicio.
3.2 Menú de navegación izquierdo:
Las aplicaciones móviles Magento 2 PWA presentan una categorización perfecta de productos. Las categorías en la aplicación móvil de PWA serán las mismas que están disponibles en el sitio web. Los compradores en línea pueden navegar fácilmente por productos de múltiples categorías sin problemas. También se pueden agregar varias páginas de CMS al menú de navegación izquierdo usando el panel de administración.
1. Mi cuenta:
La opción Mi cuenta contiene toda la información personal, de envío y de pedido del usuario. Los compradores de la aplicación PWA pueden ver todos los datos almacenados relacionados con ellos y también pueden actualizarlos.
2. Categorías
Las categorías que se muestran en el menú de navegación izquierdo de la aplicación PWA son las mismas que las de su sitio web.
3. Páginas de CMS:
Se puede acceder a varias páginas de CMS como Acerca de nosotros, Contáctenos, Términos y condiciones, etc. desde aquí.
4. Idioma(s)
La opción de idioma permite a los usuarios de la aplicación PWA ver la aplicación web en el idioma deseado. Todos los idiomas disponibles se muestran solo en esta opción.
5. Moneda(s)
Todas las monedas disponibles en su sitio web se muestran aquí en la aplicación Magento 2 PWA.
6. Iniciar/Cerrar sesión
Los usuarios pueden iniciar o cerrar sesión fácilmente desde la aplicación Magento 2 PWA a través de esta opción.
3.3 Pantalla de categoría:
1. Vistas múltiples:
Las categorías en la aplicación PWA para Magento 2 se pueden ver tanto en la lista como en la vista de cuadrícula.
2. Clasificación:
Esta opción permite a los compradores en línea elegir el orden de clasificación para reducir la búsqueda y obtener el producto deseado con facilidad.
3. Filtrar:
La opción de filtrar productos simplifica la búsqueda de productos. Los usuarios pueden filtrar todos los productos en categorías usando varios atributos como tamaño, color, precio, etc.
3.4 Pantalla del producto:
La pantalla del producto de la aplicación web progresiva Magento 2 contiene toda la información necesaria del producto al igual que la de su tienda. Desde múltiples imágenes de productos hasta descripciones cortas y largas ayuda a que el usuario se anime a comprar. La disponibilidad del producto se indica como “En stock” o “Fuera de stock” según el estado del inventario.
1. Información y cuidado del producto
Aquí se mostrará la información completa del producto disponible en el inventario.
2. Descripción breve
Los usuarios pueden leer la breve descripción de su producto para decidir rápidamente sobre la compra.
3. Opciones de productos:
Todas las opciones relacionadas con el producto como tamaño, color, etc. se muestran aquí.
5. Agregar al carrito:
Este botón permite a los usuarios agregar productos al carrito. Los usuarios pueden seguir procesando el carrito para la compra.
6. Intercambio social de productos:
La opción de compartir para el producto permite a los usuarios compartir productos en múltiples canales sociales.
Pantalla de inicio de sesión de 3.5
La aplicación web progresiva Magento 2 ofrece opciones rápidas de inicio de sesión con un solo toque y hace que el proceso de inicio de sesión/registro sea más fluido: – Inicio de sesión por correo electrónico – Inicio de sesión en Google – Inicio de sesión en Facebook
1. Iniciar sesión
Los usuarios de la aplicación pueden autenticarse e iniciar sesión fácilmente en las aplicaciones PWA utilizando sus credenciales de inicio de sesión de correo electrónico anteriores.
2. Regístrate
Todos los nuevos usuarios de la aplicación pueden registrarse y crear su cuenta en la tienda desde la aplicación Magento 2 PWA. El formulario de registro solicita solo los detalles necesarios para crear una cuenta.
3. Inicia sesión con Facebook
Los usuarios pueden iniciar sesión en la aplicación PWA utilizando sus credenciales de cuenta de Facebook.
4. Iniciar sesión con Google+
Los usuarios pueden iniciar sesión en la aplicación PWA con las credenciales de su cuenta de Google.
3.6 Pantalla del carrito de compras:
La bolsa de compras de las aplicaciones Magento 2 PWA mostrará todos los productos agregados junto con su cantidad y precio a pagar. Los usuarios de la aplicación también pueden ver los detalles del producto para estar seguros antes de comprar uno.
1. Aplicar Vale:
Esta opción permite a los usuarios usar cupones del sitio web y obtener ofertas de descuento.
2. Precio total del producto:
Los usuarios pueden ver el costo completo de su bolsa de compras antes de continuar. Se actualiza automáticamente de acuerdo con cualquier actualización con cantidad de producto o nueva incorporación.
3. Actualizar cantidad de producto:
Los usuarios de la aplicación PWA pueden incluso actualizar la cantidad del producto con la opción “Actualizar cantidad”.
4. Eliminar producto:
Los usuarios de la aplicación pueden simplemente eliminar el producto del carrito simplemente tocando la opción “Eliminar”.
5. Continuar comprando:
Los usuarios de la aplicación pueden dejar el carrito para buscar más productos en su aplicación.
6. Continuar para pagar:
Los usuarios de la aplicación PWA pueden continuar con las pantallas de pago y pago simplemente tocando la opción “Continuar con el pago”.
3.7 Pantalla de pago:
Las aplicaciones móviles de PWA para Magento 2 vienen con una sola pantalla de pago sin desorden con solo los campos relevantes y necesarios. Los usuarios de la aplicación obtienen una descripción general completa del pedido antes de realizar el pago, como los detalles de envío, los detalles de facturación, el resumen del pedido, el comentario del pedido y el resumen del pago.
1. Detalles de envío y facturación
Esta pantalla proporciona detalles de las direcciones de envío y facturación guardadas por el usuario. El usuario también puede editar/guardar la nueva dirección de envío si es necesario.
2. Resumen del pedido
Los usuarios de la aplicación pueden ver los detalles del producto antes de realizar el pago.
3. Métodos de envío
Todos los métodos de envío disponibles se muestran aquí. Los usuarios pueden elegir el que se adapte a sus necesidades.
4. Comentario del pedido
Los usuarios también pueden agregar cualquier comentario relacionado con su pedido que será visible para el administrador de la tienda en la página web del pedido en el backend.
6. Resumen de pago
Esta sección muestra los detalles completos del pago desglosado relacionados con la compra.
7. Proceder al pago
Los usuarios de la aplicación PWA serán redirigidos a la pantalla de pago después de tocar el botón “Continuar con el pago”.
3.8 Pantalla de pago:
La aplicación Magento 2 PWA trae todos los pagos de vista web (sitio web) en la aplicación. Los usuarios de la aplicación encontrarán aquí las mismas opciones de pago que están disponibles en las aplicaciones. La pantalla de pago de la aplicación web progresiva Magento 2 está completamente optimizada para la vista de la aplicación.
3.9 Pantalla Mi cuenta:
La pantalla Mi cuenta de la aplicación Magento 2 PWA ofrece todos los detalles de los usuarios disponibles en la aplicación web progresiva. Los compradores en línea pueden ver los datos personales, la dirección de envío, los detalles del pedido, etc.
1. Detalles personales
Los usuarios también pueden ver y actualizar sus detalles de perfil previamente guardados.
2. Dirección(es) de envío
Los usuarios de la aplicación pueden ver la lista completa de direcciones de envío guardadas previamente en la aplicación PWA.
3. Detalles del pedido
Los usuarios de la aplicación pueden ver la lista completa de los pedidos realizados anteriormente desde la aplicación PWA y sus detalles.
4. Función de reordenamiento
Hay un botón de pedido directo en la pantalla Mi cuenta de la aplicación PWA. Todos los productos anteriores bajo este pedido se agregarán al carrito con solo un botón.
3.10 Pantalla de detalles del pedido
La aplicación web progresiva Magento 2 muestra los detalles completos de los pedidos de aplicaciones anteriores. Esta pantalla contiene detalles del pedido, historial de estado, direcciones de envío y facturación, etc. para cada pedido realizado a través de la aplicación Magento 2 PWA. Los usuarios de la aplicación pueden ver rápidamente el resumen completo del pedido y también pueden realizar un seguimiento del estado de la entrega.
Las aplicaciones ligeras son una necesidad para casi todas las industrias, especialmente el comercio electrónico; si son una organización establecida o una startup. Independientemente de la demografía de los consumidores / públicos a los que se dirigen, las aplicaciones livianas son un boom. Este artículo se centra principalmente en la creación de una aplicación móvil PrestaShop PWA y le presenta los beneficios de las aplicaciones web progresivas. Debe conocer la naturaleza básica de una aplicación liviana que consume menos espacio en los dispositivos de los usuarios de la aplicación sin comprometer la calidad y la funcionalidad de la aplicación. Además, las aplicaciones livianas cargan el contenido más rápido y, en general, realizan todas las tareas más rápido, en comparación con las aplicaciones nativas. Estos dos factores ayudan a que las aplicaciones livianas prosperen incluso en las áreas que no tienen una conexión a Internet de muy alta velocidad. Las aplicaciones web progresivas o PWA son una gran solución para eso. Los PWA no solo son más rápidos y consumen menos espacio, sino que también ofrecen una gama más amplia de beneficios tanto para los propietarios de las tiendas como para los usuarios de la aplicación. Tener un PrestaShop PWA (aplicación web) puede hacer maravillas para un negocio. Y construir uno para su negocio ahora es tan fácil como un pastel usando una extensión preparada, es decir, un módulo PrestaShop PWA Builder. Antes de sumergirse en eso, debe echar un vistazo a los beneficios que vienen con una PWA (aplicación web) para su tienda PrestaShop.
Creación de una aplicación ligera con PrestaShop PWA Builder:
Paso 2: Rellene el formulario de requisitos previos de la aplicación proporcionado por KnowBand.
Paso 3: Revise su aplicación web PrestaShop desarrollada y confirme para ponerla en funcionamiento. Esta aplicación móvil PWA para PrestaShop crea fácilmente una aplicación web progresiva derivada de su propio sitio web de comercio electrónico PrestaShop.
Características de la aplicación móvil PrestaShop PWA:
Debido a sus ricas características y posibilidad de personalización, las aplicaciones progresivas están ganando más popularidad entre las empresas cada año. De hecho, PWA y sus versiones híbridas han sido etiquetadas como el futuro de las aplicaciones y las empresas de comercio electrónico que pueden aprovechar al máximo.
Otras ventajas de una aplicación PrestaShop PWA:
Las aplicaciones web progresivas (PWA) consumen menos espacio y son más rápidas que las aplicaciones móviles tradicionales (aplicaciones nativas). Los PWA son más rápidos, incluso para sitios de comercio electrónico como PrestaShop, porque el contenido de la página se descarga progresivamente a medida que el usuario sigue navegando. Además, tenga en cuenta que los PWA son aplicaciones basadas en la web codificadas en HTML, CSS y JavaScript, de ahí el nombre de "Aplicación web progresiva".
Una sola aplicación PrestaShop PWA puede ejecutarse en todos los sistemas operativos, es decir, en Android, iOS, Windows, etc. Esto se debe a que los PWA se ejecutan en los navegadores de Internet. Lo mismo no es posible con las aplicaciones nativas porque necesitaría construir 2 aplicaciones nativas, una para Android y otra para iOS, ambas en diferentes lenguajes de programación.
Los PWA aparecen exactamente como una aplicación móvil nativa una vez que los visitantes que navegan en su sitio PrestaShop agregan el PWA a su pantalla de inicio.
Debido a que los PWA son aplicaciones web, no es necesario que publique su PrestaShop PWA en Play Store o App Store para que esté disponible para su audiencia. Por lo tanto, no hay dependencia en las tiendas de aplicaciones móviles con PWAs.
Los usuarios de su sitio / aplicación pueden compartir fácilmente las aplicaciones web progresivas con solo una URL. Los nuevos usuarios no necesitan descargar e instalar su aplicación antes de usarla. Pueden acceder directamente a su aplicación web PrestaShop desde sus navegadores y luego elegir agregarla directamente a su pantalla de inicio. Y es entonces cuando comenzaría a actuar como una aplicación nativa con el ícono de la aplicación en la pantalla de inicio de sus dispositivos y en su menú.
Las aplicaciones web progresivas también pueden usar la mayoría de las funciones del dispositivo (teléfonos inteligentes / tabletas) como cámaras, micrófonos, etc. Sin embargo, el uso de geofencing y NFC en PWA aún está por venir en el futuro.
PWAs también le permite enviar notificaciones push a los usuarios de su aplicación tal como lo haría una aplicación nativa.
Los PWA utilizan URL seguras (https: //), por lo tanto, no necesita preocuparse por las preocupaciones de seguridad.
Las aplicaciones web progresivas son más fáciles de actualizar y mantener. Los usuarios de su aplicación web PrestaShop no necesitarán actualizar manualmente sus PWA. Esa es una tarea involucrada con aplicaciones nativas, no con PWAs.
Conclusión:
Como poseer una aplicación PWA para su tienda PrestaShop se ha vuelto más fácil y asequible, es un buen momento para comprar estas aplicaciones web. Utilizar el módulo PrestaShop PWA Builder es una forma inteligente de crear su aplicación web. Nosotros, en KnowBand, también ofrecemos aplicaciones nativas (Android e iOS) para PrestaShop. Échales un vistazo desde abajo:
Si tiene alguna consulta relacionada con este módulo de creación de aplicaciones, no dude en enviarnos un correo electrónico a support@knowband.com. ¡Nos encantaría escuchar sus valiosos comentarios!
