Add Checkout Page to HubSpot

In this help article, you will learn how to add Checkout Page to your HubSpot website page or landing page.

HubSpot offers to build two types of pages: website pages and landing pages. These instructions work for both types of pages.

Please note: To add a pop-up or embed your one page checkout, your landing page has to be built using either HubSpot Professional or Enterprise plan templates.

Add a Buy button

1. On HubSpot, click on Marketing from the top menu and open the Landing pages tab
2. Edit the page you want to add the Buy button to
3. From the left-hand menu, drag the Button block onto your page layout
4. Open your Checkout Page dashboard, click on the checkout you’d like to link to and then Add to site
5. Copy the Payment link
6. Back on HubSpot, paste this link into the URL field on the left
7. Scroll lower to edit the Button text
8. Preview and Publish your page

Add a pop-up checkout

Note: for this option, your landing page has to be built using either HubSpot Professional or Enterprise plan templates.

1. On HubSpot, click on Marketing from the top menu and open the Landing pages tab
2. Edit the page you want to add the pop-up checkout to
3. From the left-hand menu, drag the Rich Text block onto your page layout and delete the default text from it
4. Open your Checkout Page dashboard, click on the checkout you’d like to link to and then Add to site
5. Go to the Pop up tab for the Script code and Link code to open pop up under the Custom website section
6. Return to HubSpot and select the Rich Text block
7. From the top menu, click on Advanced and then Source code
8. Paste the Script code, add an empty line and paste the Link code to open pop up

1. Optionally, style the link by adding CSS and Save changes
2. Preview and Publish your page

Embed your checkout

Note: for this option, your landing page has to be built using either HubSpot Professional or Enterprise plan templates.

1. On HubSpot, click on Marketing from the top menu and open the Landing pages tab
2. Edit the page you want to add the pop-up checkout to
3. From the left-hand menu, drag the Rich Text block onto your page layout and delete the default text from it
4. Open your Checkout Page dashboard, click on the checkout you’d like to link to and then Add to site
5. Go to the Embed tab and copy the Embed code from the Custom website section
6. Return to HubSpot and select the Rich Text block
7. From the top menu, click Insert and select Embed

1. Paste the Embed code and click Insert to save
2. Adjust spacing and alignment as needed
3. Preview and Publish your page

That’s it, now your one page checkout has been added to your HubSpot page!