Extensión de pago avanzado OpenCart One Page – Manual del usuario

 

1.0 Introducción

Cada 1 de cada 10 usuarios en línea se ven obligados a abandonar su carrito solo por el proceso de pago largo y complicado. Además, puede optimizar el pago de su sitio a uno interesante incorporando la extensión de pago avanzado OpenCart One Page de Knowband. De hecho, el módulo emergente de pago receptivo de OpenCart convierte todo el proceso de pago en una sola ventana emergente basada en ajax. Además, que se activa en la pantalla cuando el cliente opta por comprar un producto de la tienda. Por lo tanto, One Page Checkout para OpenCart reduce el abandono del carrito al ofrecer todo el proceso de compra en una sola ventana emergente, sin cargar la página siguiente.

1.1 Características de One Page Checkout para OpenCart

La incorporación de One Page Checkout para la tienda OpenCart no es gran cosa, ya que ofrece una personalización simple sin involucrar ninguna habilidad técnica o modificaciones de código existentes. Por lo tanto, permita que sus clientes compren el producto rápidamente a través de una sola ventana emergente, brindándoles un pago más rápido. Además, una experiencia menos interrumpida. Por lo tanto, a continuación se enumeran los aspectos más destacados de esta extensión OpenCart One Page Checkout. 1. El módulo OpenCart One Page Checkout muestra los campos de pago totales en forma de una ventana emergente de pago basada en ajax receptiva en la interfaz. Además, del sitio web sin redirigir a otra URL. 2. Este One Page Checkout para OpenCart proporciona una manera perfecta de aumentar las suscripciones a boletines para el negocio en línea. 3. La ventana emergente de pago receptiva incorporada mediante el módulo de pago simplificado de OpenCart se puede habilitar o deshabilitar fácilmente con el botón de alternancia que se encuentra en el backend. 4. La función de registro de invitados de la ventana emergente de pago receptivo de OpenCart registra automáticamente al cliente en el sitio. Además, envíeles la contraseña de inicio de sesión en su correo electrónico. 5. Tiene la flexibilidad de habilitar o deshabilitar la funcionalidad de pago de invitados del módulo OpenCart One Page Checkout. 6. Con esta extensión de pago de una sola página de OpenCart, puede agregar código CSS a la página de pago avanzado. 7. El módulo de pago de una sola página de OpenCart ofrece una función de modo de prueba que le permite probar la funcionalidad avanzada de la página de pago en una IP específica. 8. Con el módulo de pago simplificado de OpenCart, brinde a los clientes el beneficio de las opciones de inicio de sesión social. Por ejemplo, Google y Facebook en la página de pago. 9. La extensión de pago rápido de OpenCart le permite mostrar/ocultar los campos de dirección de pago y envío de manera diferente para los clientes registrados e invitados de la tienda. 10. Las marcas de campo de dirección personalizadas son necesarias u opcionales con la ayuda de este módulo OpenCart One Page Supercheckout. 11. Al usar One Page Checkout para el sitio de OpenCart, puede proporcionar múltiples métodos de envío y pago a los clientes que se pueden configurar desde el backend. 12. El módulo emergente de pago receptivo de OpenCart le facilita la configuración de una imagen de logotipo y un título deseados para cada uno de los métodos de pago y envío que se muestran en la página de superpago. 13. La función ship2pay de la extensión de pago rápido de OpenCart selecciona automáticamente el método de pago correspondiente a cada método de envío seleccionado por el cliente. 14. La extensión emergente de pago receptivo de OpenCart ofrece un carrito configurable cuyos campos se pueden corregir según las necesidades comerciales. 15. El módulo OpenCart One Page Checkout es compatible con varias tiendas y varios idiomas. 16. La extensión de pago rápido OpenCart ofrece un diseño de respuesta móvil a los clientes. 17. La función Integrador de MailChimp del pago de una sola página de OpenCart sincroniza automáticamente los datos del cliente con la cuenta de MailChimp conectada del vendedor.

1.2 Interfaz frontal del módulo emergente de pago receptivo de OpenCart

Cuando el usuario hace clic en el botón “Agregar al carrito” correspondiente a un producto, verá el siguiente control deslizante de pago receptivo en su pantalla.

Sección Resumen del carrito de OpenCart One Page Advanced Checkout

opencart-one-page-checkout-extension-cart-summary

Además, al hacer clic en el botón “Pagar”, pueden ver y completar el formulario de pago avanzado completo de una sola vez, como se muestra en las imágenes a continuación:

Sección de inicio de sesión de la cuenta

Si el cliente desmarca la casilla de verificación “Enviar a la misma dirección”, verá la sección de dirección de envío como se muestra a continuación:


Sección de Métodos de Envío y Pago

2.0 Guía de instalación de OpenCart One Page Advanced Checkout Extension

Antes de comenzar el proceso de instalación, debe comprar el módulo OpenCart One Page Checkout en la tienda Knowband. Además, una vez comprado, recibirá los siguientes archivos en su correo electrónico registrado.

  • Código fuente de OpenCart One Page Advanced Checkout Extension en formato de archivo comprimido.
  • Manual de usuario de la extensión OpenCart One Page Checkout.

Ahora, para instalar este OpenCart Advanced Checkout en su tienda en línea, siga los pasos dados: 1. Descomprima el archivo zip. Obtendrá las carpetas como se muestra en la imagen a continuación.


2. Copie todas las carpetas del archivo zip en el directorio raíz de la configuración de OpenCart a través del administrador de FTP. Entonces, OpenCart One Page Advanced Checkout ahora está instalado correctamente. Además, está listo para usar en tu tienda. Además, vaya al menú de administración. Además, haga clic en las extensiones y, por lo tanto, haga clic en el botón Configurar junto a One Page Advanced Checkout.

Interfaz de administración 3.0 de OpenCart Responsive Checkout Popup

Justo después de la instalación exitosa de One Page Checkout para OpenCart en el sitio web, puede configurar los campos del formulario de pago según sus requisitos. Además, debe navegar por la configuración en el orden dado: Panel de administración> Extensiones> Módulos> Pago avanzado de una página

La interfaz de administración fácil de entender de la extensión de pago rápido de OpenCart se divide en nueve secciones, a saber:

  1. Ajustes generales
  2. Configuración de acceso
  3. Dirección de Pago
  4. dirección de envío
  5. Método de envío
  6. Ship2Pay
  7. Método de Pago
  8. Carrito
  9. Newsletter

Configuración general de 3.1

  • Habilitar deshabilitar: Esta opción le permite habilitar o deshabilitar la funcionalidad completa de One Page Checkout para el sitio web de Opencart. Si está deshabilitado, se muestra a los clientes el pago estándar de Opencart.
  • Habilitar la opción de boletín: Con esta opción, puede mostrar u ocultar el cuadro de suscripción al boletín de su sitio. Si el cliente marca la opción de boletín, se suscribirá a las actualizaciones del sitio (boletín).
  • Registrar invitado automáticamente: Puede habilitar el registro automático para sus clientes invitados (usuarios que realizan el pago como invitado). Esta opción enviará automáticamente una contraseña al cliente para el uso posterior de la cuenta.
  • Registrar Cuenta: Al habilitar esta opción, puede proporcionar campos de contraseña en el pago de una sola página donde el usuario puede ingresar su contraseña para registrarse.
  • Mostrar invitado: Esta opción mostrará u ocultará la opción de invitado en la sección de inicio de sesión de pago. Con esta opción, los usuarios pueden realizar el pago como invitado de sus artículos.
  • Agregar estilo personalizado: Esta opción le permite incluir un estilo personalizado adicional (código CSS), que se muestra en la parte frontal de su sitio web.
  • Modo de prueba: Puede habilitar esta opción para probar la funcionalidad del módulo de pago de una página antes de ponerlo en marcha para los clientes.
  • Añadir IP: Esta opción le permite ingresar la dirección IP específica donde desea probar las funciones avanzadas de supercheckout.

3.2 Configuración de inicio de sesión

  • Habilitar el inicio de sesión de Facebook: Esta opción habilitará o deshabilitará la opción de inicio de sesión de Facebook que se muestra en el frente del formulario de pago de una página.
  • Identificación de la aplicación de Facebook: Esta opción le permite establecer la ID de la aplicación de Facebook requerida para conectarse con su cuenta de Facebook.
  • Secreto de la aplicación de Facebook: Esta opción establecerá la clave secreta de la aplicación de Facebook. Nota: Puede obtener el ID y la clave secreta de la aplicación de Facebook en https://developers.facebook.com/, que se ha analizado en la sección 3.2.1
  • Habilitar el inicio de sesión de Google: Esta opción activará o desactivará la opción de inicio de sesión de Google que se muestra en la parte frontal del formulario de pago de una página.
  • Identificación de la aplicación de Google: Esta opción le permite configurar la ID de la aplicación de Google requerida para conectarse con su cuenta de Google.
  • ID de cliente de Google: Esta opción le permite configurar el ID de cliente de Google.
  • Al final, Secreto de la aplicación de Google:Esta opción establecerá la clave secreta de Google App.

Nota: Puede obtener la ID de la aplicación de Google, la ID del cliente y la clave secreta de https://code.google.com/apis/console, que se discutió en la sección 3.2.2

3.2.1 Cómo configurar el inicio de sesión de Facebook

La aplicación de Facebook se puede crear siguiendo los pasos mencionados a continuación: 1: Vaya a la URL dada: https://developers.facebook.com/apps/ 2: Haga clic en el botón “Agregar una nueva aplicación”. 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”.


5 y 6: Después de hacer clic en Crear ID de aplicación, deberá pasar por un control de seguridad como se muestra:

7: Haga clic en la pestaña “Configuración”.

8-13: Dos opciones estarán disponibles 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”. App Domains: yourdomain.com es correcto yourdomain.com/store es incorrecto www.domain.com es incorrecto

14: Ahora haz clic en “+Agregar plataforma”.


15: Y seleccione el sitio web como plataforma


16: Ahora ingrese la URL de su sitio.


17 y 18: Haga clic en “Productos+” y seleccione iniciar sesión en Facebook.


19: Seleccione web como plataforma para la aplicación.


20: Ahora haga clic en guardar.


21 y 22: haga clic en Configuración y agregue un URI de redirección de OAuth válido. URI de redireccionamiento OAuth válidos: https://your_store_url/index.php?route=kbstepcheckout/kbstepcheckout&fblogin=1


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 la ID de la aplicación y el secreto de la aplicación y péguelos en los campos proporcionados en el módulo.

3.2.2 Cómo configurar el inicio de sesión de Google

Siga los pasos a continuación para obtener la identificación del cliente y el secreto del cliente. 1. Vaya al enlace ” https://console.developers.google.com/project “. 2. Haga clic en la opción desplegable resaltada en el botón “2” y luego haga clic en “Crear un proyecto”.

3. Ingrese el nombre de su proyecto deseado y haga clic en “Crear”.


4. Vaya a Administrador de API, haga clic en Crear credenciales y seleccione la opción ID de cliente de OAuth.

5. Haga clic en el botón “Configurar pantalla de consentimiento”.

6. Ingrese “Id de correo electrónico”, “Nombre del producto” y luego haga clic en el botón “Guardar”.


7. Seleccione “Aplicación web”, ingrese “Nombre”, “URI redirigidos autorizados” como se menciona a continuación y haga clic en el botón “Crear”,


Use la siguiente URL de redirección

https://your_store_url/index.php?route=kbstepcheckout/kbstepcheckout

8. Copie la identificación del cliente y el secreto del cliente.

9. Pegue el ID del cliente y el secreto del cliente en el campo de texto que se muestra a continuación en el panel de administración del módulo de pago de una página de Prestashop.

Cómo generar la clave API de Google:

1) Vaya a API Manager, haga clic en el menú de la izquierda, haga clic en API y servicios y luego haga clic en Credenciales.

2) Haga clic en Crear credenciales y luego seleccione la clave API.

3) Copie la clave API e ingrese la misma en el campo ID de la aplicación de Google de la página de inicio de sesión del módulo final de administración

3.3 Dirección de pago

OpenCart One Page Checkout le permite mostrar u ocultar cualquier campo para la dirección de pago. Los campos se pueden habilitar o deshabilitar por separado para los clientes que iniciaron y cerraron sesión. Puede marcar cualquier campo como requerido, de manera diferente para los clientes que iniciaron y cerraron sesión en la tienda. Además, puede reordenar los campos de dirección con una simple acción de arrastrar y soltar.

3.4 Dirección de envío

 

El módulo emergente de pago receptivo de OpenCart le permite mostrar u ocultar cualquier campo para la dirección de envío. Los campos se pueden habilitar o deshabilitar por separado para los clientes que iniciaron y cerraron sesión. Con OpenCart One Page Advanced Checkout, puede marcar cualquier campo como requerido, de manera diferente para los clientes que iniciaron y cerraron sesión en la tienda. Además, puede reordenar los campos de dirección con una simple acción de arrastrar y soltar. Nota: Para incluir y mostrar más campos personalizados en la Dirección de pago, la Dirección de envío, la sección del carrito o la sección de la cuenta del proceso de pago, puede consultar la sección 3.10

Método de envío 3.5

  • Mostrar métodos de envío: Esta opción mostrará/ocultará la lista completa de métodos de envío proporcionados en la página de pago avanzado.
  • Estilo de visualización: Con esta opción, puede seleccionar el estilo de visualización para los métodos de envío. Puede ser solo la imagen del logotipo, solo el texto o ambos.
  • Mostrar el título del método de envío: Esta opción habilitará o deshabilitará el título para el método de envío en particular.
  • Seleccione el método de envío predeterminado: Con esta opción, puede seleccionar cualquier método de envío como método predeterminado.
  • Posición: Esta opción establece el título deseado para el método de envío.
  • Logo: Esta opción establece la imagen del logotipo para el método de envío.

Del mismo modo, puede modificar el título y la imagen del logotipo para todos los métodos de envío utilizando este módulo OpenCart One Page Advanced Checkout.

3.6 Enviar2Pagar

3.7 Método de pago

  • Mostrar métodos de pago: Esta opción mostrará/ocultará la lista completa de métodos de pago proporcionados en la página de pago avanzado.
  • Estilo de visualización: Con esta opción, puede seleccionar el estilo de visualización para los métodos de pago. Puede ser solo la imagen del logotipo, solo el texto o ambos.
  • Seleccione el método de pago predeterminado: Con esta opción, puede seleccionar cualquier método de pago como método predeterminado.
  • Posición: Esta opción establece el título deseado para el método de pago.
  • Logo: Esta opción establece la imagen del logotipo para el método de pago.

Asimismo, puede modificar el título y la imagen del logotipo para todos los métodos de pago con la ayuda del supercheckout de una página.

3.8 Carrito

En esta sección de OpenCart One Page Supercheckout, puede personalizar el carrito y mostrarlo de la forma que desee en su tienda. El tamaño de la imagen de los artículos del carrito se puede modificar fácilmente configurando la altura y el ancho de la imagen.

  • Tamaño de la imagen del producto: Esta opción le permite establecer el tamaño de la imagen para los productos que se muestran en la sección del carrito del pago de una página. Además, puede mostrar u ocultar los distintos campos del carrito para iniciar y cerrar la sesión de los clientes de la tienda. Campos como “Acepto las condiciones”. Además, ordene los comentarios marcados como opcionales u opcionales según los requisitos de su sitio.

3.9 Newsletter

  • Habilitar MailChimp: Esta opción de Supercheckout de una página de Opencart le permite habilitar o deshabilitar la funcionalidad de integración de MailChimp para su tienda.
  • Clave API de MailChimp: Con esta opción, puede configurar la clave API de MailChimp que conectará su sitio a la cuenta de MailChimp del vendedor.
  • Lista de MailChimp: Con esta opción, puede obtener y seleccionar la lista particular conectada a la cuenta de MailChimp.

3.9.1 Cómo configurar MailChimp

  1. Inicie sesión en su cuenta de Mail Chimp.
  2. Haga clic en la pestaña de la esquina derecha> Elegir perfil> Extras> Claves API.
  3. Aquí el administrador puede crear una clave API haciendo clic en el botón “Crear una clave”.
  4. Copie la clave API.
  5. El administrador también puede hacer una lista diferente para cada cliente de inicio de sesión social haciendo clic en “Lista” en la barra de menú superior.
  6. Ahora pegue la clave de API en la sección Clave de API de chimpancé de correo proporcionado y haga clic en el botón “Obtener lista”.
  7. Seleccione la lista del menú desplegable.

3.10 Cómo agregar editar o eliminar campos personalizados a la página Supercheckout

Para agregar campos personalizados a cualquier sección de One Page Checkout, puede ir a la opción “Campos personalizados” en la pestaña “Clientes” en la sección del lado izquierdo de la interfaz de administración.

 

Opencart One Page Checkout – User Manual

1.0 Introducción

La mayoría de los visitantes abandonan la compra del producto deseado simplemente porque el proceso les resulta complejo y largo. Esto, en última instancia, genera un número cada vez mayor de carritos abandonados. Para controlar las tasas de salida y abandono de carritos, Knowband ofrece… Pago en una página de OpenCart Pro Plugin para tiendas OpenCart. Además, al implementar One Page Checkout en tu sitio de comercio electrónico, puedes mejorar las tasas de conversión, ya que reemplaza la página de pago de varios pasos con una página única.

Vista móvil:

Características destacadas de la extensión OpenCart One Page Checkout:

  1. La extensión ofrece la funcionalidad de pago como invitado mediante la cual los usuarios pueden completar fácil y rápidamente sus pedidos como clientes invitados sin crear una nueva cuenta en la tienda en línea.
  2. La extensión OpenCart Fast Checkout permite a los clientes iniciar sesión rápidamente en el sitio web utilizando sus cuentas de Google, Facebook y Paypal.
  3. El administrador puede personalizar fácilmente los campos de la página de pago desde el backend de la extensión OpenCart One Page Checkout Pro. Puede mostrar u ocultar cualquiera de los campos de la página de pago, o configurarlos como opcionales u obligatorios. También puede reorganizar los campos de posición con la función de arrastrar y soltar.
  4. El propietario de la tienda puede personalizar fácilmente la apariencia de la página de pago, incluido el cambio del color de los botones, el color de fondo de los botones, el color del texto, etc.
  5. OpenCart One Page Supercheckout ofrece compatibilidad con múltiples tiendas y varios idiomas.
  6. La extensión OpenCart One Step Checkout admite casi todos los principales métodos de envío y pago, lo que aumenta la confianza de los clientes para elegir el método deseado desde la página de pago.
  7. El comercio electrónico puede aplicar cualquiera de los tres diseños de caja diferentes: de 1, 2 o 3 columnas. Los campos se pueden reorganizar fácilmente arrastrando y soltando.
  8. El módulo OpenCart Quick Checkout ofrece integración con MailChimp, Klaviyo y SendinBlue que le permite sincronizar la base de datos de sus usuarios automáticamente con sus cuentas sin ningún esfuerzo manual.
  9. El comerciante electrónico también puede personalizar la apariencia de la extensión a través de CSS y JS personalizados.
  10. El módulo OpenCart Responsive One Step Checkout ofrece la función de modo de prueba mediante la cual el propietario de la tienda puede verificar y ver las personalizaciones realizadas antes de publicarlas en el sitio web.
  11. El módulo de Pago Simplificado de OpenCart ofrece la función Ship2Pay, que permite al propietario de la tienda asociar métodos de pago específicos con los métodos de entrega seleccionados. Esta función oculta todos los demás métodos de pago al seleccionar un método de entrega específico y muestra al usuario solo los métodos de pago asociados al método de entrega seleccionado.

2.0 Guía de instalación de Extensión OpenCart One Page Checkout

Antes de comenzar el proceso de instalación, debes comprar el Extensión OpenCart One Page Checkout Desde la tienda Knowband. Una vez realizada la compra, recibirás los siguientes archivos en tu correo electrónico registrado.

  • Código fuente de la extensión OpenCart One Page Checkout en formato de archivo comprimido.
  • Manual de usuario de la extensión OpenCart One Page Checkout.

Para instalar OpenCart Single Page Checkout en su tienda online, siga estos pasos: 1. Descomprima el archivo zip. Verá las carpetas como se muestra en la imagen a continuación.


2. Copie todas las carpetas del archivo zip en el directorio raíz de la configuración de OpenCart a través del administrador FTP.

Pasos para instalar el archivo OCMOD
  • Después de descomprimir la carpeta, encontrará un archivo supercheckout_pro.ocmod.xml como se muestra a continuación:
  • Ahora, en el panel de administración, haz clic en Extensiones en el menú lateral izquierdo. Luego, haz clic en Instalador de extensiones ( Inicio->extensión).

  • Ahora, cargue el archivo supercheckout_pro.ocmod.xml. Se mostrará un mensaje de confirmación una vez cargado.
  • Después de cargar el archivo, vaya a  Inicio->Modificación
  • Encontrará un archivo llamado Supercheckout Pro v2.8 (esto significa que su ocmod se ha instalado correctamente). Haga clic en el icono “+” correspondiente para activarlo. El icono verde se vuelve rojo, como se muestra a continuación.
  • Por último, haga clic en el botón actualizar (esto es obligatorio).

¿Entonces  Pago en una página de OpenCart Pro Ya está instalado y listo para usar en tu tienda. Ve al menú de administración y haz clic en Extensiones y luego en Módulos. Haz clic en el botón de configuración junto a Supercheckout de Knowband.

3.0 Interfaz de administración de Módulo de pago responsivo de un solo paso de OpenCart

Tras instalar correctamente One Page Checkout para OpenCart, podrá configurar los campos del formulario de pago según sus necesidades. Debe navegar por la configuración en el orden indicado: Panel de administrador > Prórrogas de tiempo para presentar declaraciones de impuestos > Módulos > Supercheckout de Knowband

La interfaz de administración fácil de entender de Pago en una página de OpenCart Pro se divide en diez secciones, a saber: 1. Configuración general 2. Personalizador 3. Configuración de inicio de sesión 4. Dirección de pago 5. Dirección de envío 6. Método de envío 7. Ship2Pay 8. Método de pago 9. Carrito 10. Diseño 11. Boletín informativo Cada una de estas secciones se ha discutido a continuación:

Configuración general de 3.1

  • Activar/Desactivar: Usando esta opción, puede habilitar o deshabilitar la funcionalidad completa de la Pago en una página de OpenCart Pro Plugin de OFF a ON.
  • Habilitar la opción de boletín informativo: Puede habilitar o deshabilitar la opción de boletín informativo en la página de Supercheckout. Una vez habilitado este botón, se aplicarán las siguientes condiciones: a.) La opción de boletín informativo solo será visible para los clientes que realicen la compra como invitados si ha habilitado la opción “Registrar automáticamente como invitado”. b.) La opción de boletín informativo siempre será visible para los clientes que creen una cuenta nueva. c.) La opción de boletín informativo nunca será visible para los clientes que hayan iniciado sesión.
  • Registrar invitado automáticamente: Puede habilitar esta opción para registrar automáticamente a los clientes invitados en su tienda. Al habilitarla, podrá registrar a sus clientes en la tienda y enviarles una contraseña generada a su correo electrónico.
  • Registrar Cuenta: Al habilitar este campo, puede mostrar un campo de contraseña en la página de supercheckout para que los nuevos usuarios puedan establecer fácilmente la contraseña deseada para su cuenta.
  • Seleccione la opción predeterminada al finalizar la compra: Con esta opción, puede establecer una opción predeterminada en la sección de inicio de sesión de su OpenCart Supercheckout de una página página de las opciones como Invitado, Iniciar sesión y Registrarse.
  • Deshabilitar invitado: Puede habilitar o deshabilitar la funcionalidad de invitado para los usuarios en la sección de inicio de sesión de One Page Checkout.
  • Agregar estilo personalizado: Con esta opción, puede agregar o incluir un estilo personalizado a la página de Supercheckout. Para aplicar CSS personalizado, escriba el CSS en el cuadro de texto a la derecha de la etiqueta “Agregar estilo personalizado”. Por ejemplo, puede cambiar el color de los botones de la página de Supercheckout.
  • Agregar monto mínimo para mostrar el banner de envío gratuito: Desde esta pestaña, el administrador puede agregar una cantidad mínima requerida después de la cual los clientes serán elegibles para obtener el envío gratuito de su pedido.
  • Habilitar detección automática de país: Después de habilitar esta función, la extensión detectará y completará automáticamente el país del usuario en la sección de país.
  • Validación en línea: Con esta función, la extensión muestra un error cada vez que el usuario no completa un campo obligatorio en la página de pago.
  • Habilitar la dirección automática de Google para completar: Tan pronto como el usuario comienza a escribir su dirección, la extensión sugiere su dirección si esta función está habilitada.
  • Habilitar o deshabilitar nueva plantilla: Con la extensión OpenCart One Page Checkout, el propietario de la tienda puede aplicar la plantilla de pago nueva o antigua según su deseo desde la configuración general.
  • Modo de prueba: Esta opción le ayuda a habilitar o deshabilitar la funcionalidad del modo de prueba de este Extensión de pago de una página de OpenCart.
  • URL de prueba: Una vez que habilite el modo de prueba, puede configurar una URL de supercheckout donde puede probar la funcionalidad del pago en una página.

Personalizador

Desde la pestaña Personalizador, puede personalizar el color de fondo del botón, el color del borde del botón, la vista previa del botón, el color del texto del botón, el color inferior del borde del botón, el color de fondo del botón Mi cuenta, el color de fondo del botón Iniciar sesión, el color de fondo del botón Iniciar sesión, el color de fondo del botón Cerrar sesión, el color de fondo del botón Código de cupón, el color de fondo del botón Código de cupón, etc.

  • Color de fondo de la barra de envío gratuito: Esta sección le permite cambiar el color de fondo de la barra de envío gratuito en la página de pago.
  • CSS y JS personalizados: Esta sección le permite personalizar la apariencia de la página de pago con CSS y JS personalizados.

3.2 Login

En esta pestaña, encontrará opciones para configurar las opciones de inicio de sesión de Facebook, Google y Paypal como se muestra a continuación.

  • Habilitar el inicio de sesión de Facebook: Con esta opción, puede habilitar o deshabilitar la opción de inicio de sesión de Facebook en One Page Checkout.
  • ID de la aplicación de Facebook: Esta opción le permite configurar el ID de la aplicación de Facebook, que se puede generar usando la cuenta de desarrollador de Facebook.
  • Secreto de la aplicación de Facebook: Con esta opción, configure la clave secreta generada mediante la cuenta de desarrollador de Facebook.
  • Habilitar el inicio de sesión de Google: Con esta opción, puede habilitar o deshabilitar la opción de inicio de sesión de Google en One Page Checkout.
  • ID de la aplicación de Google: Esta opción le permite configurar el ID de GoogleApp.
  • El ID de cliente de Google: Este campo le permite configurar el ID de cliente de Google creado desde la consola de Google.
  • Secreto de la aplicación de Google: Con esta opción, puedes configurar la clave secreta de la aplicación generada mediante la consola de Google.
  • Habilitar el inicio de sesión de PayPal: Con esta opción, puede permitir que sus clientes inicien sesión a través de sus cuentas de Paypal.
  • ID de cliente de PayPal: Esta opción le permite agregar su ID de cliente de PayPal.
  • Secreto del cliente de PayPal: Esta opción le permite agregar su ID secreto de cliente de PayPal.

Para obtener instrucciones detalladas sobre cómo generar el ID de la aplicación, la clave secreta de la aplicación y el ID del cliente, pase a la siguiente sección.

3.2.1 ¿Cómo configurar el inicio de sesión de Facebook?

La aplicación de Facebook se puede crear siguiendo los pasos que se mencionan a continuación:

1: Vaya a la URL indicada: https://developers.facebook.com/apps/

2: Haga clic en el botón “Crear aplicación”.

3 y 4: Seleccione la opción “Construir experiencias conectadas” opción y haga clic en el botón ‘Continuar’.

5 y 6: Agregue “Nombre para mostrar de la aplicación”, “Correo electrónico de contacto de la aplicación” y seleccione “¿Tiene una cuenta de administrador comercial?” y luego haga clic en el botón “Crear aplicación”.

7 y 8: Después de hacer clic en Crear ID de aplicación, deberá pasar por una verificación de seguridad como se muestra:

9: Haga clic en la pestaña “Configuración”.

Amablemente agregar eliminar URL de devolución de llamada. Puede consultar la descripción de la URL de devolución de llamada de eliminación desde aquí: https://developers.facebook.com/docs/development/create-an-app/app-dashboard/data-deletion-callback/

10-15: En el menú desplegable, encontrará dos opciones: Básica y Avanzada. Haga clic en “Básica”. A continuación, introduzca su “Dominio de la aplicación”, “URL de privacidad”, “URL de términos de servicio”, “Añadir icono”, “Seleccionar categoría” y haga clic en el botón “Guardar cambios”.

App Dominios:

tudominio.com es correcta

tudominio.com/tienda es incorrecto

www.dominio.com es incorrecto

16: Ahora haga clic en “+Agregar plataforma”.

17: Y seleccione Sitio web como Plataforma.

18 y 19: Ahora ingrese la URL de su sitio.

20 y 21: Haga clic en “Productos+” y haga clic en el botón Configurar desde la pestaña de inicio de sesión de Facebook.

22: Seleccione la web como plataforma para la aplicación.

23: Agregue la URL del sitio y haga clic en guardar.

24-26: Haga clic en Configuración y agregue una URI de redireccionamiento OAuth válida.

URI de redireccionamiento OAuth válidos:

https://your_store_url/index.php?route=kbstepcheckout/kbstepcheckout&fblogin=1

27: Seleccione la opción “En desarrollo” .

28 y 29: Elija una categoría del menú desplegable y haga clic en el botón “Cambiar modo”.

30: Copie el ID de la aplicación y el secreto de la aplicación y péguelos en los campos provistos en el módulo.

Paso final:

1. Inicie sesión con el SDK de JavaScript.

Establezca este campo como Sí.

2. Dominios permitidos para el SDK de JavaScript

Establecer el dominio de la tienda.

Nota: aquí el dominio debe ingresarse con el siguiente tipo.

https://octest.knowband.com

3.2.2 ¿Cómo configurar el inicio de sesión de Google?

Siga los pasos a continuación para obtener el ID y el secreto del cliente. 1. Vaya al enlace “ https://console.developers.google.com/project 2. Haga clic en “Crear un proyecto”.

3. Ingrese el nombre del proyecto y el nombre de la organización que desee y haga clic en “Crear”.


4. Vaya al Administrador de API, haga clic en el menú de la izquierda, haga clic en API y servicios y luego haga clic en Crear credenciales.


5. Seleccione la opción ID de cliente OAuth.

6. Haga clic en el botón “Configurar pantalla de consentimiento”. Introduzca el “ID de correo electrónico”, el “Nombre del producto” y haga clic en el botón “Guardar”.


7. Seleccione la opción Externa y haga clic en el botón “Crear”.


Utilice la siguiente URL de redireccionamiento https://your_store_url/index.php?route=supercheckout/supercheckout 8. Agregue el nombre de la aplicación y el correo electrónico de soporte al usuario.

9. Haga clic en Agregar dominio y agregue el dominio autorizado y luego haga clic en Guardar y continuar.

10. Haga clic en el botón Guardar y continuar.

Haga clic en +Agregar usuarios.

11. Agregue un nombre de usuario y haga clic en el botón Agregar.

12. El usuario agregado será visible, luego haga clic en el botón Guardar y continuar.

13. Haga clic en la pantalla de contenido de Juramento y luego haga clic en el botón Publicar Agregar.

14. Haga clic en Credenciales y luego en el botón +Crear credenciales y luego seleccione ID de cliente de Oath.

15. Agregue el tipo de aplicación y el nombre y luego haga clic en el botón Agregar.

16. Agregue las URL y luego haga clic en el botón Crear.

17. Copie y pegue el ID de cliente y el secreto de cliente en el campo de texto que se muestra a continuación en el módulo de pago de una página de Prestashop.

Cómo generar la clave API de Google:

1) Vaya al Administrador de API, haga clic en el menú de la izquierda, haga clic en API y servicios y luego haga clic en Credenciales.

2) Haga clic en Crear credenciales y luego seleccione la clave API.

3) Copie la clave API e ingrésela en el campo Id. de la aplicación de Google de la página de inicio de sesión del módulo del extremo administrador.

3.3 Dirección de pago

Esta pestaña contiene configuraciones para los campos que se mostrarán en la sección Dirección de pago o facturación en la página de pago como se muestra a continuación.

  1. Consta de dos secciones: la de la izquierda es para clientes invitados y la de la derecha, para clientes registrados.
  2. Para que un campo se muestre u oculte en la página de pago, marque la casilla de verificación justo a la izquierda de la etiqueta Mostrar.
  3. Para que un campo sea obligatorio (campo requerido) marque la casilla de verificación justo a la izquierda de Requerir etiqueta.
  4. Los campos también se pueden reorganizar según las necesidades. Para reorganizarlos, simplemente coloque el cursor sobre el icono de arrastrar y suelte el campo donde corresponda, como se muestra a continuación.
  5. Al guardar, los campos se reorganizarán según los cambios.

3.4 Dirección de envío

Esta pestaña contiene configuraciones para los campos que se mostrarán en la sección Dirección de envío en la página de pago como se muestra a continuación.

  1. Consta de dos secciones: la de la izquierda, para clientes invitados, y la de la derecha, para clientes registrados.
  2. Para que un campo se muestre u oculte en la página de pago, marque la casilla de verificación justo a la izquierda de la etiqueta Mostrar.
  3. Para que un campo sea obligatorio (campo requerido) marque la casilla de verificación justo a la izquierda de Requerir etiqueta.
  4. Los campos también se pueden reorganizar según las necesidades. Para reorganizarlos, simplemente coloque el cursor sobre el icono de arrastrar y suelte el campo donde corresponda, como se muestra a continuación.
  5. Al guardar, los campos se reorganizarán según los cambios.

Método de envío 3.5

Esta pestaña contiene la configuración del método de envío que se muestra en la página de pago. Permite habilitar, deshabilitar y configurar el método de envío predeterminado, como se muestra a continuación:

  • Mostrar métodos de envío: Con esta opción, puedes mostrar u ocultar los métodos de envío en la página de pago. Para ello, debes activar o desactivar el botón, o viceversa.
  • Estilo de visualización: Esta opción le permite seleccionar el estilo de visualización de los métodos de envío que ha añadido a su sitio web. Puede elegir entre tres opciones: Solo texto, Solo imagen o Texto con imágenes.
  • Título del método de envío de la pantalla: Con esta opción, puede habilitar o deshabilitar el título de los métodos de envío que se muestran en la página de pago.
  • Seleccione un método de envío predeterminado: Esta opción le ayuda a seleccionar cualquier método como método de envío predeterminado para su tienda.
  • Título: Con esta opción, puedes configurar títulos para cada método de envío añadido y configurado en tu tienda. Puedes configurar el título en inglés o francés.
  • Logo: Esta opción te permite configurar el logo deseado correspondiente a cada uno de los métodos de envío configurados para tu tienda.

3.6 Envío a pago

La función de envío a pago del módulo Supercheckout de OpenCart desactiva automáticamente los métodos de pago según el método de envío seleccionado por el cliente. Es decir, el administrador puede asociar opciones de pago específicas con opciones de envío específicas en la tienda.

3.7 Método de pago

Esta pestaña contiene configuraciones para los métodos de pago que se muestran en la página de pago, como habilitar/deshabilitar o seleccionar un método predeterminado.

  • Mostrar métodos de pago: Con esta opción, puede mostrar u ocultar los métodos de pago en la página de pago. Para ello, debe activar o desactivar el botón, o viceversa.
  • Estilo de visualización: Esta opción le permite seleccionar el estilo de visualización de los métodos de pago que ha añadido a su sitio web. Puede elegir entre tres opciones: Solo texto, Solo imagen o Texto con imágenes.
  • Seleccione un método de pago predeterminado: Esta opción le ayuda a seleccionar cualquier método como método de pago predeterminado para su tienda.
  • Título: Con esta opción, puedes configurar títulos para cada método de pago añadido y configurado en tu tienda. Puedes configurar el título en inglés o francés.
  • Logo: Esta opción te permite configurar el logo deseado correspondiente a cada uno de los métodos de pago configurados para tu tienda.

3.8 Carrito

En esta sección encontrarás los campos del carrito divididos en dos secciones, la de la izquierda es para Clientes Invitados y la de la derecha es para clientes Registrados o Logueados.

  1. Para mostrar u ocultar el carrito de la página de pago, marque y desmarque la casilla de verificación presente delante de la etiqueta Mostrar carrito.
  2. Para habilitar o deshabilitar cualquier columna en el carrito, marque o desmarque la casilla de verificación frente a la columna correspondiente.
  3. Para habilitar o deshabilitar las imágenes emergentes del producto, marque o desmarque la casilla de verificación frente a la columna correspondiente.
  4. Para cambiar el tamaño de la imagen emergente, ingrese el ancho y la altura de la ventana emergente en el cuadro de texto frente a la etiqueta Tamaño de la imagen del producto.
  5. Las opciones de cupones, puntos de recompensa y vales también se pueden activar o desactivar marcando o desmarcando la casilla correspondiente. Tenga en cuenta que el cuadro de texto de puntos de recompensa solo será visible en la página de Supercheckout una vez que se cumplan las siguientes tres condiciones: a) El cliente debe iniciar sesión; b) Debe tener al menos 1 punto de recompensa en su cuenta; c) Debe tener un producto en el carrito que pueda comprarse con puntos de recompensa.

Confirmar:

  1. Esta pestaña está dividida nuevamente en dos secciones, la de la izquierda es para Clientes Invitados y la de la derecha para Clientes Registrados o Iniciados Sesión.
  2. Para habilitar el cuadro de comentarios para el pedido del cliente, marque la casilla de verificación frente a Dejar un comentario para la etiqueta del pedido y para deshabilitarlo, desmarque la misma casilla de verificación.
  3. Para habilitar o aceptar los términos o cualquier otra información guardada en el administrador de la tienda, marque o desmarque la casilla de verificación frente a la etiqueta Acepto las condiciones.

3.9 Pestaña Diseño

Esta pestaña contiene las configuraciones para el diseño de OpenCart One Page Checkout Pro como se muestra a continuación:

1 columna

2 columna

3 columna

Puede cambiar fácilmente el ancho de cualquier columna ajustando el control deslizante presente en la parte superior como se muestra a continuación.

 

También puedes reposicionar diferentes bloques de la página de pago con solo arrastrar y soltar. Al guardar, el bloque se reorganizará en la página de pago según los cambios.

3.10 Newsletter

Al hacer clic en la pestaña Boletín informativo de la Módulo de pago responsivo de un solo paso de OpenCart, puede configurar los ajustes de MailChimp, SendinBlue y Klaviyo Integrator como se muestra a continuación:

  • Habilitar MailChimp: Puedes habilitar o deshabilitar la función de Integrador de MailChimp para tu tienda. Puedes habilitar esta opción si quieres aumentar las suscripciones al boletín informativo de tu tienda.
  • Clave API de MailChimp: Esta opción le ayuda a configurar la clave API de Mailchimp para capturar los correos electrónicos de los clientes.
  • Lista de MailChimp: Una vez configurada la clave con esto Extensión de pago rápido de OpenCart, puede buscar y seleccionar la lista de MailChimp.

Se puede hacer lo mismo con SendinBlue y Klaviyo.

4.0 Interfaz frontal de Extensión de pago en un solo paso de OpenCart

Cuando el usuario hace clic en el botón “Añadir al carrito” correspondiente a un producto y realiza su pago, verá el siguiente supercheckout en su pantalla.

5.0 Tutorial de Opencart One Page Checkout Pro de Knowband

Para que la instalación, configuración y configuración sean completamente sencillas, hemos creado un tutorial detallado y fácil de entender para OpenCart One Page Checkout Pro de Knowband. Esta guía paso a paso te guía paso a paso, desde la descarga e instalación del módulo hasta la configuración de todas sus potentes funciones para una experiencia de pago más rápida, fluida e intuitiva. Tanto si eres nuevo en OpenCart como si eres un usuario experimentado, el tutorial te permite personalizar campos, gestionar las opciones de inicio de sesión con redes sociales, habilitar el pago como invitado, configurar los métodos de pago y envío, y optimizar el diseño general sin complicaciones. Consulta el tutorial completo aquí para garantizar una instalación y un funcionamiento sin problemas de la extensión One Page Checkout Pro.

Extensión de pago en una página de OpenCart: https://www.knowband.com/opencart-one-supercheckout-pro

Demostración de administración del proceso de pago en una página de OpenCart: https://opencartdemo.knowband.com/demo/index.php?module=oc_onepagecheckout_knowband&demo=admin&lang=en

Demostración frontal del proceso de pago en una página de OpenCart: https://opencartdemo.knowband.com/demo/index.php?module=oc_onepagecheckout_knowband&demo=front&lang=en

Pago en una página de OpenCart desde el Marketplace oficial de OpenCart: https://www.opencart.com/index.php?route=marketplace/extension/info&extension_id=15353