Kajabi Code Editor (2024): How to Add Custom Code to Kajabi Sites and More

Kajabi Code Editor - Blog Image

Kajabi is known for its user-friendliness. That’s what makes it ideal for online business owners who hate dealing with complex coding.

But how about advanced users who want more customization options? This platform has them covered too.

With the Kajabi code editor, you can make custom changes to the code of your site and pages in a few clicks.

In this blog post, we’ll discuss the Kajabi custom code editor in detail, who it is for, and where you can use it.

What Is Kajabi Code Editor

The Kajabi code editor is a simple yet powerful tool that allows you to modify code inside your site and pages. It works together with the Kajabi website builder.

If you’re comfortable working with HTML, CSS, and Javascript, you’ll be able to use this feature easily.

It’s a great tool for creating a website that matches your branding perfectly.

The custom code editor access was initially only available for the Kajabi Pro plan. So users needed to pay $399/month just to use it.

But a few months ago, the platform introduced Kajabi Access, an add-on allowing Basic and Growth plan users to get the custom code editor for an extra $99/month.

Now, everyone can use it regardless of the plan they’re on.

Who Is It For?

This feature is excellent for:

  • Advance users who want more control over the design of their website.
  • Web developers who want to make changes to a Kajabi site for their clients.
  • Designers who want to create a unique site.

If you’re one of those people, the Kajabi custom code editor is a good investment.

Where Can You Use Kajabi Code Editor

Kajabi uses Liquid syntax, a type of code or computer language used by Shopify. The dynamic part of your website is written in Liquid.

Accessing the custom code editor allows you to edit the themes, structure, blocks, files, and assets directories in your Kajabi account.

They can be found inside the following:

  • Site themes
  • Landing page themes
  • Product themes

How to Use Kajabi Code Editor

The custom code editor is accessible in just a few clicks. But you must first identify which part of your online site you want to edit.

Here’s a step-by-step guide:

Site Themes

  • Click the “Website” tab from your Kajabi dashboard.
kajabi website tab on its dashboard
  • On your “Website” tab, add the theme you want to edit or choose from your “Saved Themes.”
Kajabi Design button on Website Tab to add the theme
  • Select the Ellipsis icon (…) on the theme and choose “Modify Code.”
choosing theem and selecting ellipsis icon in kajabi theme page
  • Modify your code and select “Preview” to see the changes.
sample of modifying code in kajabi theme and preview to see changes
  • Once done, press “Save.”

Landing Pages

  • Click “Pages” under the “Website” tab.
Kajabi Pages button under website tab
  • Click the “Landing” tab.
kajabi landing pages
  • Choose which page you’d like to edit. All landing pages are adjustable, including your sales, opt-in, thank you, and about pages.

sample of landing pages you can edit on kajabi pages
  • Select the Ellipsis icon (…) on your chosen page and click “Modify Code.”
kajabi pages under landing tab with arrow on ellipsis button and modify code
  • Customize your page and select “Preview.”
  • Click “Save.”

Product Theme

  • Click the “Products” tab on the right side of your Kajabi dashboard.
kajabi products tab
  • Choose which product you’d edit.
kajabi products page and sample of products to choose from
  • Click “Customize” next to the “Edit Details.”

kajabi products under online course feature and customize tab
  • Press the Ellipsis icon (…) and click “Edit Code.”
ellipsis icon and edit code on kajabi products, online courses under theme tab
  • Modify your Product theme and click “Save.”

Kajabi Page/Site

  • Click “Design” under your “Website” tab.
kajabi design button under website tab
  • Select the theme code editor.
  • Choose the directory and then the file you wish to modify.
kajabi directories under encore site feature of design tab
  • Edit the code and click “Save.”
clicking save button after editing the code on kajabi code editor

Conclusion

Kajabi custom code editor is one of the platform’s best features. Besides being flexible, it’s accessible and easy to use. If you have the time and skills, it can help you save a lot of money.

So instead of purchasing a new theme or template, you can edit the code and create a perfect design for your brand.

Try the custom code editor now by subscribing to the Pro plan or the Kajabi Access.

Kajabi Frequently Asked Questions:

Resources:

Scroll to Top

Wait! Test Drive Kajabi FREE for 30-Days!

(Our Readers Get 30 Days Instead of a 14 Day Trial!)