Aprende en este tutorial cómo personalizar la tipografía de los campos de pago de Easy Digital Downloads (EDD) para que sea la misma que la del tema mediante código.
El plugin Easy Digital Downloads te permite utilizar Stripe como pasarela de pago, que es una de las más populares.
Hasta la versión 2.9, el plugin usaba el elemento de Stripe «Card Element» pero a partir ese momento añadieron la opción de «Payment Element», que es más moderna e invitan a adoptarla.
De hecho la opción «Card Element» está marcada como legacy. Así que si estás pensando en actualizar a «Payment Element» te intensará saber que que EDD ha incluido varios filtros para poder modificar su aspecto. Entre ellos:
edds_stripe_payment_elements_fontsedds_stripe_payment_elements_variablesedds_stripe_payment_elements_themeedds_stripe_payment_elements_layoutedds_stripe_payment_elements_label_styleedds_stripe_payment_elements_walletsedds_stripe_payment_elements_fieldsedds_stripe_payment_elements_termsedds_stripe_payment_elements_payment_method_types
En el tutorial de hoy verás cómo usar los dos primeros para personalizar la tipografía que se muestra en este elemento y conseguir así que sea la misma que tu tema.
Vamos a ver cómo conseguirlo.
Snippet para personalizar la fuente de los campos de pago de Stripe en EDD
Añade el siguiente fragmento a tu plugin de funcionalidades:
Para ver este código y los otros 2107 snippets de esta web,
identifícate o suscríbete aquí.
En este caso usas los filtros edds_stripe_payment_elements_fonts y edds_stripe_payment_elements_variables para personalizar la tipografía que se muestra en los campos de la tarjeta de pago («Payment Element»).
En este ejemplo se mostrará la fuente Roboto, pero la idea es que lo modifiques para que se muestre la misma tipografía que usa tu tema y mantengas así una coherencia de diseño.
Conclusiones
Ahora ya sabes cómo personalizar la tipografía de los campos de la tarjeta de pago (cuando usas la opción «Payment Element» de Stripe) en Easy Digital Downloads.
Si tienes alguna duda te leo en los comentarios. Y si quieres dejarme una sugerencia para futuros tutoriales, envíamela a través del formulario de contacto.
Todo ventajas de ser suscriptor. 😉
