Customizing the appearance of your offer checkout page

This guide will show you how to customize the appearance of your offer checkout page by adding a theme, header & footer, testimonials, video, images, and more.

After creating an offer, the next step is to customize the appearance of its checkout page. Voma simplifies this process by providing an appearance editor, which allows you to see your changes in real-time.

 


More about the the appearance editor

The appearance editor displays your changes in real-time as you make them. On the right side of the screen, there is a clickable live preview window, and on the left, there's an editable template where you can make your adjustments.

You can either copy your content from existing or previous offers into Voma, or create new content from scratch. When you paste existing content into the appearance editor, Voma will preserve its basic formatting.

Our appearance editor is mobile-friendly, allowing you to switch between desktop and mobile previews by simply clicking the icons shown below.

How to use the Offer Appearance Editor:

  1. First, head over to your offer and click on the Appearance tab.
    Appearance 1

  2. The offer appearance editor will open. Click on Page Settings at the top of your screen to access a page where you can select either a 1-Step or 2-Step checkout process and customize the accent color and fonts.
    Customizing the appearance 2

  3. Next, you can hover over and click any section of your checkout page to choose which section you want to edit. Make your changes in the left panel, and view your changes live in the right panel. When you're done, click Save.

    You'll be able to add, customize, or change the:

    Header

    Appearance Editor 1
    Here you can choose between displaying:
        • Logo only
        • Logo & Secure badges
        • Logo & Custom text
        • No Header

  4. HeadlineAppearance Editor 2
  5. Here you can add your offer headline and description. These are vital because they capture attention and convey key information, directly influencing the effectiveness of your marketing and the likelihood of conversions. 
  6. Order Summary

    Appearance Editor 10
  7. You can modify the headline, title, and optional image of your order summary, and decide whether to display or hide the discount code field.
  8. Content

    Appearance Editor 3
  9. There are various rich text content blocks where you can add:
    • Product Information or Descriptions
    • Images
    • Links
    • Video (We currently support YouTube, Wistia, Vimeo, and Loom Videos)
    • Bullet Points
    • Testimonials
    • and more
  10. Contact Information

    Appearance Editor 4
  11. You can mark certain fields as required and hide those that arenโ€™t applicable, allowing you to choose which fields customers need to complete.
    • Company Name
    • Email address
    • Password - If you need to create a user account with login details for your new customer, you can require customers to create a password at checkout. The password field is accessible via Zapier.
    • Phone number
  12. Order Bump Appearance Editor 5

  13. You can also customize the image, headline, description, and product name of your order bump in the appearance editor. 
  14. Billing Address, Shipping Address, and Tax ID/VAT

    Appearance Editor 6
  15. Here you can choose to show or hide the billing address, shipping address and Tax ID/VAT.
  16. Buy Button

    Appearance Editor 8
  17. The "Buy Now" button is crucial because its visibility and appeal directly influence how likely customers are to complete their purchase.

  18. Here you'll be able to change your button text, color and text color.

    Footer

    Appearance Editor 9
  19. You can add multiple footer links like your privacy policy, terms and conditions, etc. You can also put an affiliate program link in your footer.    

 

  1. ๐Ÿ”Ž  Sneak Peek: 
  2. Customizing the appearance 4

๐Ÿ”—  Next you can head over to Managing the settings of your offer.

 


 
 

โ”  If you have any questions, please let us know at help@voma.ai or in our live chat at the bottom right of your screen.