Aprende a integrar pagos con PayPal en ASP.NET Core: Cómo incluir botones de pago PayPal inteligente en mi página web

Estrada Web Group
Administrador
Aprende a integrar pagos con PayPal en ASP.NET Core: Cómo incluir botones de pago PayPal inteligente en mi página web

En este artículo te enseñare a incluir tus primeros botones de pago de PayPal para utilizarlo en ASP.NET Core para recibir pagos en tu página web.

En artículos anteriores ya vimos cómo incluir el SDK de JavaScript de PayPal, Crear el proyecto web ASP.NET Core, Configurar la API REST de PayPal en ASP.NET Core, Crear las cuentas PayPal.

Incluir botones de pago PayPal inteligente en mi página web

En este artículo crearemos los botones de pago inteligente de PayPal en la página web. Abre el proyecto que creamos en los artículos anteriores, en mi caso se llama EstradaWebGroup.PayPal.Web y agrega una nuevo Controller en blanco en la carpeta Controllers llamado ShowSmartButtons. Cuando se cree este controller lo abres y te mostrará el siguiente código:

public class ShowSmartButtonsController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }
    }

Sobre la palabra index das clic y botón derecho del mouse, seleccionas Agregar Vista, lo que vas a modificar solamente es seleccionar la casilla: Usar página de diseño y das clic en el botón con los tres puntos, en seguida se abrirá una ventana donde vas a seleccionar Views/Shared/_Layout.cshtml y listo das clic en aceptar y agregar.

Código HTML

Abre la vista que generaste anteriormente y que se encuentra en Views/ShowSmartButtons/ Index.cshtml, y reemplaza su contenido con el siguiente código:

@{
    ViewData["Title"] = "Botones Paypal en ASP.NET Core";
}
<h1>@ViewData["Title"]</h1>
<br /> 
<div id="div_sbtn1"></div>
<div id="div_sbtn2" style="width:50%;margin-top:30px"></div>
<div id="div_sbtn3" style="width:20%;margin-top:30px"></div> 
@section Scripts{
    <script>
        paypal.Buttons().render('#div_sbtn1');
        paypal.Buttons().render('#div_sbtn2');
        paypal.Buttons().render('#div_sbtn3');
    </script> 
}

Aquí, se definen tres elementos de contenedor <div> y luego representamos tres conjuntos de botones de pago inteligente de PayPal a estos contenedores utilizando el código JavaScript. La única diferencia entre estos contenedores son sus atributos de ancho: 100%, 50% y 20% respectivamente.

Aquí, usamos el diseño de botón vertical predeterminado, y los botones pueden ocupar una cantidad dinámica de altura (height) en tu página web, dependiendo de los botones que se representan. Si bien el tamaño de los botones se puede controlar mediante el atributo de ancho (width) del contenedor. Ahora ejecutando el proyecto de ejemplo y navegando a https://localhost:44377/ShowSmartButtons produce los resultados que se muestran en la siguiente imagen:

integrar Botones paypal en ASP.NET Core

En este artículo te mostre como incluir tus primeros botones de pago de PayPal para utilizarlo en ASP.NET Core para recibir pagos en tu página web.

Compartir artículo:

Más artículos geniales

Manténgase actualizado

Obtenga excelente contenido en su bandeja de entrada todas las semanas.
Solo contenido excelente, no compartimos su correo electrónico con terceros.
Subir al inicio de la pantalla ;