{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-guides/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["cards","card","admonition"]},"type":"markdown"},"seo":{"title":"Checkout","description":"Shift4 Payment Platform REST API."},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"checkout","__idx":0},"children":["Checkout"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Checkout gives merchants multiple pathways to accept online payments, serving vastly different integration needs while running on the exact same foundation. ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Hosted checkout"]}," is a low-code solution that sends customers to a secure, Shift4-hosted payment page optimised for conversion with streamlined but robust customisation. Alternatively, ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Payment components"]}," allow a merchant to embed secure card input fields directly into their own forms, maintaining full control over the UI."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["With both paths, card data is captured by Shift4 rather than by your site, so neither one brings card numbers into your systems. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"#pci-compliance"},"children":["PCI compliance"]}," below."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Underneath both sits a single building block: the ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Checkout Session"]},", which your backend creates for each payment and then checks to confirm the payment went through. Only the middle step differs — whether the customer pays on Shift4's page or on yours. That makes the choice a front-end one, and it's why you can use each path for different flows, or change your approach later, without starting over."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"choose-your-integration","__idx":1},"children":["Choose your integration"]},{"$$mdtype":"Tag","name":"Cards","attributes":{"columns":3,"cardMinWidth":240},"children":[{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Hosted checkout","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/hosted-checkout"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Send customers to a secure, Shift4-hosted payment page built for conversion. The fastest way to start accepting payments, with streamlined customization and no payment experience to build or maintain yourself."]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Best for:"]}," ","Getting live quickly, teams that want Shift4 to handle the checkout experience"]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Payment components","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/payment-components/"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Bring payment directly into your own pages and keep full control of the look, feel, and flow — customers never leave your site. Card fields are rendered by Shift4, so card data never reaches your page."]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Best for:"]}," ","E-commerce checkouts, keeping your own branding end to end, a fully tailored payment experience"]}]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Both paths run on the same foundation, so you can start with one and move to the other later without rebuilding. Not sure which fits? Walk through the ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/common-scenarios"},"children":["common scenarios"]},"."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"at-a-glance","__idx":2},"children":["At a glance"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Aspect"},"children":["Aspect"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Hosted checkout"},"children":["Hosted checkout"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Payment components"},"children":["Payment components"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Where customers pay"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["On a secure Shift4-hosted page"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Right on your own site"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Effort to launch"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Fastest — little to build"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["More to build, fully tailored"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Look and feel"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Shift4-designed, lightly customizable"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Fully your brand, end to end"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Who maintains the payment experience"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Shift4"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Yours to build — card entry stays secured by Shift4"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Apple Pay / Google Pay"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"#digital-wallets"},"children":["Included"]}," — enable in the Customer Hub"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"#digital-wallets"},"children":["Included"]}," — buttons render on your page"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Where card data is entered"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["On Shift4's payment page"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["In Shift4-hosted card fields embedded in your page"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Typical PCI SAQ"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["SAQ A"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["SAQ A"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Best suited to"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Getting live quickly, one-off and ad-hoc payments"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["E-commerce, seamless on-brand checkout"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"when-to-use-checkout","__idx":3},"children":["When to use Checkout"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Bring payment into your own experience"]}," — accept payments on your product, cart, or checkout pages; with Payment components, customers stay on your brand from start to finish."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Take payments on your own terms"]}," — create a checkout for each order and start it whenever your flow is ready."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Confirm a card without charging"]}," — save a card for later or verify a payment method before you fulfil an order."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["If you just need a shareable link with nothing to build, use ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/payment-links/"},"children":["Payment Links"]}," instead."]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"pci-compliance","__idx":4},"children":["PCI compliance"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Both integration paths are designed to keep cardholder data out of your environment, so both typically qualify a merchant for ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["SAQ A"]}," — the shortest PCI DSS self-assessment questionnaire."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["What that means for each path:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Hosted checkout"]}," — the customer is redirected to a Shift4-hosted payment page. Card entry happens entirely on Shift4's page, on Shift4's domain. Your site never renders a card field and never receives card data."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Payment components"]}," — the card number, expiry, and CVC inputs are rendered by ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["shift4.js"]}," as Shift4-hosted iframes mounted inside your layout. Because those fields are served from a Shift4 origin, they are isolated from your page's own scripts; you style the surrounding page and choose when to submit, but card data goes directly from the iframe to Shift4."]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["In both cases your servers receive only a token or a Checkout Session reference — never a card number — which is what keeps your PCI burden to a minimum."]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Your page still counts."]}," Under PCI DSS v4, SAQ A eligibility also requires you to confirm that the page embedding the components — or initiating the redirect — is not susceptible to script-based attacks that could compromise the payment fields, such as a swapped iframe or an overlaid fake form. Keep your site's scripts and dependencies secure. Your acquirer makes the final determination of which SAQ applies to you."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"digital-wallets","__idx":5},"children":["Digital wallets"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Apple Pay and Google Pay are included on both integration paths, and the buttons appear automatically on devices and browsers that support the wallet — customers authorise with a touch instead of typing card details."]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Hosted checkout"]}," — nothing to build: enable the wallets in the Customer Hub and Shift4 renders the buttons on the hosted page. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/hosted-checkout#apple-pay--google-pay"},"children":["Apple Pay & Google Pay"]},"."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Payment components"]}," — the wallet buttons render right on your own page, so the whole flow stays on your brand. Each wallet is a component you mount like any other. See ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/payment-components/apple-pay"},"children":["Apple Pay"]}," and ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/guides/core-concepts/checkout/payment-components/google-pay"},"children":["Google Pay"]},"."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"next-steps","__idx":6},"children":["Next steps"]},{"$$mdtype":"Tag","name":"Cards","attributes":{"columns":3,"cardMinWidth":240},"children":[{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Common scenarios","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/common-scenarios"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Find the right integration and options for your use case."]}]},{"$$mdtype":"Tag","name":"Card","attributes":{"title":"Create a Checkout Session","imagePosition":"start","iconPosition":"auto","layout":"vertical","align":"start","variant":"filled","to":"/guides/core-concepts/checkout/create-a-checkout-session"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Set up a checkout: fixed and customer-chosen amounts, addresses, custom fields, and customers."]}]}]}]},"headings":[{"value":"Checkout","id":"checkout","depth":1},{"value":"Choose your integration","id":"choose-your-integration","depth":2},{"value":"At a glance","id":"at-a-glance","depth":3},{"value":"When to use Checkout","id":"when-to-use-checkout","depth":2},{"value":"PCI compliance","id":"pci-compliance","depth":2},{"value":"Digital wallets","id":"digital-wallets","depth":2},{"value":"Next steps","id":"next-steps","depth":2}],"frontmatter":{"title":"Checkout","description":"Accept online payments your way — send customers to a secure Shift4-hosted page with Hosted checkout, or build payment right into your own site with Payment components.","markdown":{"lastUpdatedBlock":{"hide":true}},"seo":{"title":"Checkout"}},"lastModified":"2026-10-08T08:30:07.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/guides/core-concepts/checkout","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}