Updating E-Commerce themes for tokenized payments


This article applies to:

Keap is updating how it securely stores credit card information, called tokenization. This will be rolled out to all payment processors integrated with Keap. If you are processing tokenized payments, you will need to review the themes that are active on your Order Forms and Shopping Cart themes. Themes created before April 2023 will not work with tokenized payment methods and a new one will need to be created. You will need to create a new theme and then activate it on your existing order forms.

*Note: Currently tokenized payments are only applicable if you have an active Keap Pay account. As updates roll out, other integrated merchant accounts will also be transitioned to tokenized payment methods. Please see the Help Center article linked here for more information.*


Finding themes that need to be updated

Order form and Shopping Cart themes do not have a timestamp of their creation date. To solve this, we’ve made an update where if an order form or shopping cart theme needs to be updated the payment fields are not visible. This is to reduce the amount of failed payments and to give additional clarity on which themes to update. See below for additional instructions.


Checking Order Form Themes

  1. Navigate to the Sales Page then select E-Commerce Setup


  1. Under Sell online, select Order Forms


  1. Click on the themes column to sort quickly by themes


  1. Click on the preview button next to every order form with a unique theme


  1. Check if the payment fields are missing, if they are, new themes need to be created to replace them.


Checking Shopping Cart Themes

    1. Navigate to the Sales Page then select E-Commerce Setup


2. Under Sell Online, Click on “View Shopping Cart”


3. Select any of the products that’s linked


4. Click the “add to cart” button


5. Once the product is added to your cart, click “Checkout”


6. Check the payment details and if the payment fields are missing, if they are, the shopping cart theme needs to be updated.



For more information on how to create a new Order Form theme, please visit the Help Center Article linked here.

*Important Note: Making a new theme active on an Order Form will remove the HTML content in the HTML Areas tab. We strongly recommend copying any code you have entered into the HTML area to a safe place. Once you've updated the Order Form theme  you can then paste back in the HTML content.*



Updating your Order Form themes

1. Navigate back to the Ecommerce Settings page and click Order Forms


2. Click into the order forms with the older themes


3. Once in the Order Form go to the Theme tab.


4. Locate the theme you created near the bottom of this page and click “Make Active”


5. A pop up informs you that changes to the HTML area will be lost.  Click OK when ready to proceed.


6. You will now see that new theme under the “Default Theme” heading. 


Helpful hack for updating multiple order forms at the same time

Keap users that have multiple order forms connected to the same theme can save time when updating the theme by following these steps. Disclaimer: the following steps will still remove custom HTML content from the order forms that get updated.

  1. Create the new theme that will be used on the order forms.

  2. Set the new theme as the default by clicking on the “Use Theme” link.

  3. Delete the old theme within your Keap application

When a theme is deleted, the Order Forms connected to that theme will then be connected to the default theme in the app. 


NOTE: Making a new shopping cart theme active will remove the HTML content in the HTML areas tab. We strongly recommend copying any code you have entered into the HTML areas and saving them in a safe place for later. Once you’ve updated the Shopping Cart theme you can then add back in the custom HTML content.


Updating your Shopping Cart Theme

1. Go to your Ecommerce setup 


2. Click into Shopping Cart Themes


3. Click Create a New Theme


4. Select the type of theme you want and click “Use this theme.” Choose any theme that is available.


5. Choose a name for your custom theme and click Save


6. Customize your theme and add any custom HTML content you may have


7. Once you're finished customizing the theme, click "Back to Shopping Cart Themes"


8. Find the theme you just created and click "Use Theme" to make it active


Update your Spiffy theme to accept Tokenized payments. 

If you use Spiffy to change the appearance of your Order Forms or Shopping Cart theme in Keap, you will need to take action to enable tokenized payments to operate through your forms. 

  1. When you update your Order Form theme do not choose the Mobile Responsive layout as that will break the Spiffy code.

  2. You will then need to re-publish your Spiffy Order Form. 

  3. After re-publishing those forms the Updated Payment fields will load.

If you are having an issue, please reach out to [email protected] and they will be happy to assist further.