Customize the First Data Connect payment page

If you have managed to use our First Data Connect for WooCommerce plugin on your site, your default payment page would appear like so:

You might find the need to customize your payment page form to fit your brand colors. Here’s how you can change it:

1. Log in to your First Data Connect back-office account.

2. From your back-office account > click Customization > Customize the design of your hosted payment forms.

3. From this page, you can choose to set the background color, and font sizes used by your form.

Classic form Tab

Combined Page Tab (this is what our plugin uses, and we recommend that you make changes to this tab)

4. You can click on the ‘Preview style’ or the ‘Mobile Preview Style’ button to see how your changes would look on a desktop or mobile, respectively.

5. Once you are happy with your changes, you can click the ‘Save Style’ button to apply your changes.

Here’s the payment page before and after applying our customizations:



Voila! as you can see from the comparison between the two screenshots, the payment page form is customized to fit the brand colors of We are AG, which is much better than the plain old black-and-white form.

Was this helpful?

First Data Connect

Don't already have the plugin? Get access now.

Still need help?

Our team are on hand to provide fast, helpful and professional support.

Support request

Front End Demo

Test drive our plugin on the demo site.

View Demo


Ask our bot about our products.

Welcome to our AG Bot, powered by OpenAI and trained on our documents and product pages. By continuing to use this service, please keep in mind:

Your continued use indicates acceptance of these terms. We hope you find our AI Chatbot useful!

Hello! I am AG Bot, how can I help you?