Use {{glossary.PayFrame}} or {{glossary.PayFields}} to add payment acceptance to your website.

{{glossary.Payrix Pro}} offers two hosted payment options that integrate directly with an online platform or website checkout page, supporting secured payment processing and simplified PCI compliance:

PayFrame: An all-in-one hosted payment form that Merchants can embed with minimal development effort.
PayFields: A highly customizable, iframe-based hosted payment solution that allows merchants to embed individual payment fields directly into their website or checkout page.

PayFrame

PayFrame embeds a Payrix Pro platform-hosted payment form on a {{glossary.Merchant}}’s checkout page with basic customizations and minimal development effort. PayFrame integrates a secure payment form, enhancing customer experience and ensuring PCI-compliant {{glossary.transaction}} processing. With customizable JavaScript and callback functions, PayFrame allows easy adjustments to the form's appearance and functionality.

To get started with your PayFrame integration, see the PayFrame Integration Guide on the Worldpay Developer Hub.

Key features of PayFrame include:

Quick Integration: Minimal setup required; ideal for fast deployment.
Basic Customization: Apply basic branding elements like logo, color, and description.
All-in-One Form: Embed the entire payment form as a single unit.
Tokenization Modes: Support token-only, transaction-only, or both transaction modes.
Digital Wallets: Support {{glossary.Apple Pay}} and {{glossary.Google Pay}} payments.

The following images are examples of an integrated PayFrame payment form:

Payment form displaying card details, including card number, expiration date, and CVV.

Payment information form with fields for address, email, and total amount due.

PayFields

PayFields is a highly customizable, Payrix Pro-hosted payment solution enabling your Merchants to accept PCI-compliant payments directly on their website or checkout page. By embedding secure JavaScript iFrames, PayFields provides a pre-built user interface for individual secure payment fields, supports custom CSS for flexible styling, and eliminates the need for direct API integration.

To get started with your PayFields integration, see the PayFields Integration Guide on the Worldpay Developer Hub.

Key features of PayFields include:

Standalone Fields: Embed single payment fields like card number and expiration individually.
Custom Styling: Maintain full control over the look and feel using custom CSS.
Tokenization Support: Supports token-only, transaction-only, or both.
Flexible Payment Methods: Accepts card payments, eCheck Payments and digital wallet payments from Apple Pay and Google Pay
Web Content Accessibility Guidelines (WCAG) Compliant Features: Integrates compliant <label> elements to support accessibility.
Single-Page Application (SPA) Compatible: Supports single-page application workflows for applications built on React, Angular and Vue.
Advanced Configurations:
- Optional fields: Add or remove fields like phone, email, billing address, and {{glossary.address verification service (AVS)}} settings.
- Prepopulated Fields: Pre-fill fields that can be edited as needed.
- Accept Unencrypted Card Reader Payments: Connect to compliant non-{{glossary.triPOS}} terminals for card present transaction environments.
- Process Invoice Payments: Connect an active invoice to a customer payment to apply a full or partial payment to an existing invoice created on the Payrix Pro platform.
- Create New Customer Accounts: Create a new customer from a new PayFields transaction.

The following image is an example of a full checkout page integrated with PayFields:

OrderEase online food ordering form with billing and payment details displayed.

Enable Google Pay for Web