English →

Oliver Servín

Personalizar el diseño del botón de pago en Laravel Cashier Paddle

El diseño del botón de pago al usar Laravel Cashier Paddle no es particularmente el más bonito. Afortunadamente Laravel Cashier ofrece un componente de blade paddle-button con la opción de añadir estilos personalizados.

Standard Paddle styling

Puedes añadir data-theme="none" al componente paddle-button para deshabilitar el diseño por defecto de Paddle:

<x-paddle-button :url="$payLink" data-theme="none">
Buy Product
</x-paddle-button>

Después puedes añadir algunos estilos como Tailwind CSS para darle una mejor apariencia.

<x-paddle-button :url="$payLink" class="w-full bg-green-600 border border-transparent rounded-md py-3 px-8 flex items-center justify-center text-base font-medium text-white hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500" data-theme="none">
Buy Product
</x-paddle-button>


Cómo mantener en sincronía los detalles de cliente con Stripe en Laravel


Gestionar el consentimiento de marketing de Paddle con Laravel


Personalizar el diseño del botón de pago en Laravel Cashier Paddle


Incrustar el widget de pago de Paddle con Laravel Cashier


Auto-resetear semanalmente una app demo en Laravel


Eliminar la tabla personal_access_tokens de una App en Laravel


Probando Google Ads con RadioCúbito(Design)