You may remember a blog post we released in May 2015 to celebrate the launch of Hosted Fields and help tackle the 2014 changes to the PCI DSS.
Well, three years on and many happy merchants later, we are thrilled to see how Braintree has changed the game and that the industry is moving away from hosted payment pages toward a UI-centric, yet PCI-minded, way of collecting credit card data.
As a first mover in this space, Braintree is consistently innovating and finding new ways to facilitate merchants to create optimal user experiences. You can be sure, as the merchant, Braintree has your back to make things work seamlessly for you and your customers.
Hosted Fields are a replacement for any hosted payment page or payment page iframe, but crucially, it allows you to control the look and feel without gaining any visibility to the sensitive card data so you can be eligible for SAQ-A PCI DSS validation.
The control is in your hands; you can apply your own CSS, and the call to action (payment button) is all yours, which you can optimize to convert customers.
Braintree uses an iframe for each element (card number, expiry date, CVV) so that the data is entered on our secure servers but inherits the styling you apply to the fields.
The code example below shows a simple card form using the bootstrap form-control styling. There are three div selectors referenced in our JavaScript SDK that show where to put the hosted fields.
Just as we did with Hosted Fields back in 2015, Braintree continues to innovate to make things better for you and your customers -- as well as preparing for and reacting to any and all industry changes -- to make sure that your payments are always seamless.