Kartra Pages Colorful Templates

In this introduction to Kartra Pages, you will learn how to create a page with an interactive checkout component. This will allow you to sell a product from the page.

The steps to create any other type of interactive page – for example, an opt-in page – are the same as this checkout guide. In that case, you will simply choose an Opt-in section or component instead of a Checkout.

To create a checkout page, you will need:

  • Pre-written copy for the page that describes your product or service
  • A fully configured Kartra product to process payments and collect customer information

Tip

If you do not have a product set up, create that first. You will add a checkout component to the page and link it to the configured product asset.

When your product is ready, launch the page builder:

  1. Go to Pages
  2. Select a Checkout Pages template
  3. Customize the page to match your brand and add your message
  4. Find the Checkout component on the page and hover your cursor over it until orange menu buttons appear
  5. Click the Edit style button in the mini menu
    Edit Style Button on Kartra Page Builder
  6. Page checkout component configuration menu
  7. In the configuration panel (shown above), use the dropdown menu to select the pre-configured product you want to use on this page
  8. Apply changes to the checkout configuration
  9. When the page is finished:
    • To leave it unpublished, click Actions in the top right corner of the page, Save progress, and Return to Dashboard
    • To publish it, click Actions and Publish live

Pro tip

  • Pages are built in three layers: sections, column layouts, and components like text or media.
  • Toggle Edit columns on or off at the top of the page to change the type of elements you can edit. If Edit columns is OFF, you can edit components on the page.
    Toggle between column and component mode for editing
  • When dragging a component into the page, match your cursor to a Drop Here indicator. When the zone turns green, release the component.
  • To change the background color or image for a complete page block, edit Sections.
  • Buttons can be used to link to other pages or pop up active components like checkouts and opt-in forms.
  • Check the Assets in this Page panel in the bottom right of the screen to make sure all the interactive components in the page have been configured.
    Assets in this Page panel shows interactive elements in the page
  • Save your page frequently to protect your content. Autosave can be enabled in each page, but it is still best practice to manually save periodically to make sure none of your ideas are lost.
  • After publishing your page, customize the direct link with a custom domain

Apply your skills

You can add lots of other interactive components to a page that also require linking to a pre-configured asset.

To add an opt-in form, webinar registration form, survey, or calendar to your page, follow the same steps above, but choose the component you want to add instead of a checkout.

In your account