{"templateId":"markdown","versions":[{"version":"v1","label":"v1 (latest)","link":"/products/hosted-payment-pages/customization","default":true,"active":true,"folderId":"089b7d23"}],"sharedDataIds":{"sidebar":"sidebar-products/hosted-payment-pages/sidebars.yaml","current-catalog-info":"current-catalog-info-/products/hosted-payment-pages/openapi"},"props":{"metadata":{"markdoc":{"tagList":["partial","badge","admonition"]},"custom_product":"Hosted Payment Pages","type":"markdown"},"seo":{"title":"Customize your payment pages","description":"Worldpay for Developers - docs, code examples, resources and tools. Everything you need to build your omnichannel payment solution.","siteUrl":"https://docs.worldpay.com/access","image":"/access/assets/worldpay-logo-light.21b7daf79984773a9fcd7d4fbcb07ae5289dfffd6023c4c3dca720c7058e53dc.33f780a6.svg","keywords":"documentation, api, openapi, sdks, developer, payments, json, payouts, 3ds","jsonLd":{"@context":"https://schema.org","@type":"Organization","url":"https://docs.worldpay.com/access","name":"Worldpay"},"meta":[{"name":"google-site-verification","content":"zjziIKaP3ImsqsfhYnEBnq1R85UabiSwl7HTXuwtZuo"},{"name":"doc_product","content":"Access"},{"name":"doc_category","content":"Documentation"}],"llmstxt":{"hide":false,"sections":[{"title":"Payments API","description":"Payment orchestration API combining fraud assessment, 3ds authentication, SCA exemptions, Worldpay Token creation and a card or wallet based payment.","includeFiles":["products/payments/@20240601/**/*"],"excludeFiles":[]},{"title":"Payment Queries API","description":"Querying your payments data, based on a variety of parameters.","includeFiles":["products/payment-queries/@v1/**/*"],"excludeFiles":[]},{"title":"Card BIN Data API","description":"Provides detailed information about a card.","includeFiles":["products/card-bin/@v1/**/*"],"excludeFiles":[]},{"title":"3DS Authentication API","description":"Request 3DS authentication to protect against fraud, be SCA compliant and to shift liability using this standalone API.","includeFiles":["products/3ds/@v3/**/*"],"excludeFiles":[]},{"title":"FraudSight API","description":"Request a risk assessment and receive a response with an outcome (e.g. lowRisk) using this standalone API.","includeFiles":["products/fraudsight/@v1/**/*"],"excludeFiles":[]},{"title":"Checkout SDK","description":"Integrate using our clientside SDKs for both web and native devices. Benefit from SAQ-A/PCI-SSF compliance.","includeFiles":["products/checkout/web/@v2/**/*","products/checkout/ios/@v4/**/*","products/checkout/android/@v4/**/*","products/checkout/react-native/@v3/**/*","products/checkout/flutter/@v1/**/*"],"excludeFiles":[]},{"title":"Tokens API","description":"Minimizes the exposure of sensitive card details and increases the security of your customer's card details.","includeFiles":["products/tokens/@v3/**/*"],"excludeFiles":[]},{"title":"Card Payments API","description":"Request a card payment using this standalone API, requires separate requests for 3DS, Fraud assessment etc.","includeFiles":["products/card-payments/@v7/**/*"],"excludeFiles":[]},{"title":"Card Verifications API","description":"Verify your customer's card to maximize your authentication rates.","includeFiles":["products/card-verifications/@v6/**/*"],"excludeFiles":[]},{"title":"Account Payouts API","description":"Send funds to your customer's bank accounts and search for payouts using parameters.","includeFiles":["products/account-payouts/@20250101/**/*"],"excludeFiles":[]},{"title":"APMs","description":"Pay using eWallets, bank transfers, direct debits, local card schemes, Postpay and eInvoice/ Buy Now Pay Later.","includeFiles":["products/apms/@20240701/**/*"],"excludeFiles":[]},{"title":"Balance API","description":"Request your account details for a single account or all accounts under an entity.","includeFiles":["products/balance/@20250101/**/*"],"excludeFiles":[]},{"title":"Card Payouts API","description":"Send funds to your customer's cards.","includeFiles":["products/card-payouts/@v4/**/*"],"excludeFiles":[]},{"title":"Events (Webhooks)","description":"Receive status updates from Access Worldpay by setting up a webhook.","includeFiles":["products/events/@v1/**/*"],"excludeFiles":[]},{"title":"FX API","description":"Manage Foreign Exchange (FX) on your payments.","includeFiles":["products/fx/@v1/**/*"],"excludeFiles":[]},{"title":"Hosted Payment Pages (HPP) API","description":"Our low-code option to take payments securely at the lowest PCI compliance level - SAQ A.","includeFiles":["products/hosted-payment-pages/@v1/**/*"],"excludeFiles":[]},{"title":"Money Transfers API","description":"Money Transfer OCTs (Original Credit Transaction) allow funds to be pushed to an eligible card in 30 minutes or less.","includeFiles":["products/money-transfers/@v1/**/*"],"excludeFiles":[]},{"title":"Parties API","description":"Create parties, manage your payout instruments and beneficial owners and carry out identity verification checks.","includeFiles":["products/parties/@20250101/**/*"],"excludeFiles":[]},{"title":"SCA Exemptions API","description":"Maximize a frictionless checkout experience by using issuer data insights to apply exemptions.","includeFiles":["products/sca-exemptions/@v1/**/*"],"excludeFiles":[]},{"title":"Split Payments API","description":"Divide funds from a single payment amongst yourself and your parties/sellers.","includeFiles":["products/split-payments/@20250625/**/*"],"excludeFiles":[]},{"title":"Statements API","description":"Retrieve your account statement and see individual entries for all credits and debits.","includeFiles":["products/statements/@20250101/**/*"],"excludeFiles":[]},{"title":"Transfers API","description":"Transfer funds from source account to target account.","includeFiles":["products/transfers/@20250101/**/*"],"excludeFiles":[]},{"title":"Verified Tokens API","description":"Verified Tokens ensures that your customer's payment details are valid and CIT compliant when creating a token.","includeFiles":["products/verified-tokens/@v3/**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Last updated"]},": 14 June 2025 | ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/changelog/"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Change log"]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"customize-your-payment-pages","__idx":0},"children":["Customize your payment pages"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"Badge","attributes":{"size":"small","fontSize":"0.8rem","fontWeight":"bold","color":"var(--wp-colour-black)","mt":"0rem","mb":"0.5rem","px":"1rem","py":"0.5rem","borderRadius":"6rem","bg":"#E0D5FC"},"children":["Enterprise"]}," ","Customization is available through a ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["direct API call"]}," on a per transaction basis only currently."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To tailor your payment pages through an API call use our API reference to:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["customize ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/openapi/other/create#other/create/t=request&path=hostedcustomization"},"children":["the CSS"]},", e.g. color, buttons, background"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["customize ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"https://developer.worldpay.com/products/hosted-payment-pages/openapi/other/create#other/create/t=request&path=hostedproperties"},"children":["functional properties"]},", e.g. whether billing address fields should be displayed on your payment pages"]}]},{"$$mdtype":"Tag","name":"br","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"Badge","attributes":{"size":"small","fontSize":"0.8rem","fontWeight":"bold","color":"var(--wp-colour-black)","mt":"0rem","mb":"0.5rem","px":"1rem","py":"0.5rem","borderRadius":"6rem","bg":"#A5EFFF"},"children":["SMB (Worldpay eCommerce)"]}," ","You can customize your payment pages either through a ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["direct API call"]}," on a per transaction basis or our ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Hosted Payment Page Designer"]}," which applies the settings to all requests. This guide focuses on the customization functionality through the hosted designer interface."]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"Important"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Customization through an API call overrides any customization done through the Payment Page Designer."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"customize-via-payment-page-designer","__idx":1},"children":["Customize via Payment Page Designer"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Customize the look and feel of your payment pages using our ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"https://dashboard.worldpay.com/"},"children":["Hosted Payment Page Designer"]},"."]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Log into your ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"https://dashboard.worldpay.com/"},"children":["dashboard"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Navigate to \"Developer Tools\" from the left hand menu"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Choose the \"HPP Designer\" option to launch our customization tool"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"capabilities","__idx":2},"children":["Capabilities"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Using the payment page designer, you can:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["add your company logo"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["add your own font"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["add your own stylesheet to change the look and feel of the hosted payment pages - ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/styles"},"children":["Explore possibilities"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["customize the properties of your payment page"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["add merchant-defined parameters"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["test and publish your designs"]}]},{"$$mdtype":"Tag","name":"br","attributes":{},"children":[]},"\nYou can test your customizations in the Try environment (test) and later publish them to the Live environment (production).\n",{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Next steps"]}]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/styles"},"children":["Manage logo, stylesheet and font"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/configuration"},"children":["Customize your payment page"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/test-designs"},"children":["Publish"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/hosted-payment-pages/go-live"},"children":["Go live"]}]}]}]},"headings":[{"value":"Customize your payment pages","id":"customize-your-payment-pages","depth":1},{"value":"Customize via Payment Page Designer","id":"customize-via-payment-page-designer","depth":2},{"value":"Capabilities","id":"capabilities","depth":3}],"frontmatter":{"seo":{"title":"Customize your payment pages"}},"lastModified":"2026-01-14T15:00:27.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/products/hosted-payment-pages/customization","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}