Como Insertar un Boton de Paypal en tu Sitio Web

Agregar un botón de PayPal en tu sitio web es una forma sencilla y segura de aceptar pagos en línea.

Si tienes un negocio, un blog con donaciones o vendes productos o servicios, este método puede ayudarte a mejorar la experiencia de tus usuarios.

En este artículo, te enseñaré paso a paso cómo integrar un botón de PayPal utilizando código HTML.

Paso 1: Crear una Cuenta de Negocios en Paypal

Para poder integrar un boton de Paypal en tu sitio Web debes haber creado una cuenta Business en Paypal

Paso 2: Ingresar a la seccion de desarrolladores

Una vez te encuentras dentro de tu cuenta Bussines de Paypal ve a la opcion Developers

Paso 3: Configurar Sandbox

En la seccion developers van a revisar que este activado la opción Sandbox, lo cual significa ambiente de prueba, si activas la opcion LiVE, sigifica ambiente de producción.

Dentro de la opción Sandbox Accounts vas a tener 2 cuentas, una Business y una Personal la cual te sirve para hacer pruebas, tambien vas a encontrar en el menú de Apps & Credentials una aplicación por default, la cual nos sirve para hacer las pruebas.

Paso 4: Client ID

Para obtener el client ID de nuestras aplicación selecciona el menu Apps y Credenciales, el client ID que nos da la aplicacion lo vas a copiar y lo vas a reemplazar por la palabra test en el codigo del siguiente paso.

Paso 4: Modificar Código

En el código que encuentras a continuacion debes modificar ciertas lineas.

1. En client-id, reemplaza la plabra test, por el client id que copiaste anteriormente
2. En description, pon el nombre de tu producto
3. En value pon el valor de tu producto
4. En la LA URL DE TU PAGINA DE GRACIAS, pon la url de tu pagina a la cual se van a redirigir tus clientes despues de hacer el pago.
5. Copia todo el codigo y pega en tu Sitio Web.

<div id="smart-button-container">
      <div style="text-align: center;">
        <div id="paypal-button-container"></div>
      </div>
    </div>
  <script src="https://www.paypal.com/sdk/js?client-id=test&currency=USD" data-sdk-integration-source="button-factory"></script>
  <script>
    function initPayPalButton() {
      paypal.Buttons({
        style: {
          shape: 'rect',
          color: 'gold',
          layout: 'vertical',
          label: 'pay',
          
        },

        createOrder: function(data, actions) {
          return actions.order.create({
            purchase_units: [{"description":"LA DESCRIPCION DE TU PRODUCTO","amount":{"currency_code":"USD","value":47}}]
          });
        },

        onApprove: function(data, actions) {
          return actions.order.capture().then(function(orderData) {
            
            // Full available details
            console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
 
actions.redirect('LA URL DE TU PAGINA DE GRACIAS');
            
          });
        },

        onError: function(err) {
          console.log(err);
        }
      }).render('#paypal-button-container');
    }
    initPayPalButton();
  </script>

Paso 5: Copia y Pega

Una vez modificado el código copia y pega en tu sitio Web y se vera de la siguiente manera.

Si te gusto este artículo, compartelo y sigueme en mis redes sociales.