Skip to main content

Add and manage blocks on pages

Add text, image, form, video, and other blocks to a section, then rename, duplicate, hide, remove, or reorder them.

A block is the content you add to a page — text, an image, a form, a video, and more. Every block sits inside a section, which groups related blocks together and controls how they are arranged.

Sections organize and break up a page for your visitors. blocks hold what those visitors actually read, watch, and click.


Block types

The blocks available to you depend on your page template. Settings vary by block type.

Block

What it does

Accordion

Shows content in collapsible dropdowns. Each has an always-visible heading and a body that expands on click. Good for FAQs and instructions.

Assessment

Displays one of your Assessments (a test or survey) in a section. Visitors are prompted to subscribe with name and email when they finish.

Audio

Plays an audio file. You can offer a download and set the title, subtitle and player accent color.

Blog post

Shows your most recently published blog posts and links visitors to your Blog.

Call to action

A button that prompts an immediate response, like subscribing or buying an Offer.

Card

Shows an image with a click action and messaging (description, button and footer text).

Coaching scheduling widget

Lets customers book a session with you from your site, landing and product pages.

Countdown

A timer counting down to an existing Event, to create urgency. It can trigger an action when it ends or hide its section.

Course outline

Not documented as a page block. The only match is a course-admin article, so I haven’t mapped it.

Custom code

Embeds your own code in a block on one page, such as a calendar widget. The same article also covers page-level and site-wide code.

Custom widget

Adds third-party functionality with no code, through a Common Ninja integration.

Event

Displays a selected Event, with options for date format, year, time and timezone.

Event video

A video whose visibility depends on an Event’s date and time. It generates four blocks (before, at start, during, after). Editors see all four, and visitors see only the current one.

Feature

Highlights content with an image, text and an optional button.

Form

Displays one of your Forms, which can subscribe, grant an Offer, register for an Event or segment contacts.

Image

Shows a single image, or a group of images through an Image Gallery Section.

Link list

A navigation menu of your chosen links, in a row or column layout.

Multi-video launch

An interactive image for launch-style video pages, such as teasers, past and future videos, or thumbnails. Its states are Clickable, Active and Locked.

Offer

Shows an Offer, meaning the price and checkout page for a Product.

Pricing card

Presents an Offer with its feature list and a call to action. You can put several in a section for plans or bundles.

Social Icons

Links to your social profiles, such as Facebook, Instagram, YouTube and TikTok.

Social share

Lets visitors share your page to social platforms, by email, or by copying the link.

Text

Adds formatted text, with a CTA option and typography settings.

Video

Puts a video on the page, either uploaded to Kajabi or embedded from YouTube, Vimeo or Wistia.

Video embed

Embeds a video from an external host by pasting its embed code into the Embed Code field.


Add a block to a section

  1. From the Dashboard, click Website, then Website Pages or Landing Pages.

  2. Click the Title of a page to open it in the editor.

  3. In the sidebar, select the section you want to edit, or click Add section to create a new one.

  4. Click Add block at the bottom of the section editor.

  5. Search for or select the block type you want to add.

  6. Click Save to keep your changes.

Add block to a section

Your new block generates at the bottom of the section with a default name and default settings.


Rename, duplicate, hide, or remove a block

All four actions live in the same place. In the page editor sidebar, find the block you want to change and click the more options (...) icon, then choose your action. Click Save to keep your changes.

Rename, duplicate, hide, remove block

Rename a block

block names are visible only to you, inside the editor. Renaming helps you tell apart several blocks of the same type as a section grows.

Duplicate a block

Duplicating copies a block's content and its settings. It is the fastest way to repeat a design element, or to build one version of a block for desktop and another for mobile.

A duplicate is always placed on the same page as the original. You cannot duplicate a block onto a different page.

Note: A duplicated block generates at the bottom of its section, not directly beneath the original. Reorder it to place it where you want.

Hide a block

Hiding removes a block from the live page but keeps it in the sidebar, where you can keep editing it. Use it to build a block ahead of an event, announcement, or launch and reveal it when you are ready. A hidden block keeps its content and settings.

Remove a block

Removing a block deletes it and everything in it. To remove a block, from the more options (...) menu, click Delete, or click Remove block at the bottom of the block settings page.

Note: Some blocks cannot be removed. A block the section requires, or one that can only appear once in a section, has no remove option.

Warning: Remove block deletes all of the block's content. Once you click Save, the action cannot be undone. If you remove a block by mistake, before you save, return to your list of pages and confirm you want to leave without saving. Keep in mind this discards any other unsaved changes too.


Reorder blocks in a section

  1. From the Dashboard, click Website, then Website Pages or Landing Pages.

  2. Click the Title of a page to open it in the editor.

  3. In the sidebar, select the section holding the blocks you want to reorder.

  4. Hold the drag handle beside a block and drag it to the position you want.

  5. Release the block, then click Save to keep your changes.

reorder block


Align blocks in a section

Line up the blocks in a row so your section looks even on desktop. Use Equal height blocks to match block heights, Vertical alignment or Horizontal alignment to anchor blocks in different directions of the row.

Match block heights with Equal height blocks

Enable Equal height blocks to make every block in a row as tall as the tallest block in that row.

  1. From the Dashboard, click Website, then Website Pages or Landing Pages.

  2. Click the Title of a page to open it in the editor.

  3. In the sidebar, select the section you want to edit.

  4. Scroll to Section Settings, then click Desktop Layout.

  5. Toggle Equal height blocks. If the section has multiple rows, repeat for each row you want to align.

  6. Click Save to keep your changes.

Note: Equal Height blocks doesn't change the height of uploaded images, so they keep their original ratio. Images align to the top of the tallest block in the row. For best results with Text blocks, use the same number of text lines in each block.

Align blocks vertically in a row

Set Vertical alignment to place every block at the top, bottom, or center of the tallest block in the row. Vertical alignment won't be visible if Equal height blocks is toggled on.

  1. From the Dashboard, click Website, then Website Pages or Landing Pages.

  2. Click the Title of a page to open it in the editor.

  3. In the sidebar, select the section you want to edit.

  4. Scroll to Section Settings, then click Desktop Layout.

  5. Open the Vertical alignment dropdown and select Top, Center, or Bottom. If the section has multiple rows, repeat for each row you want to align.

  6. Click Save to keep your changes.

Align blocks horizontally in a row

Set Horizontal alignment to position the blocks to the Left, Center, Right, Space Between, or Space Around of the section. Horizontal alignment won't be visible if each block width all add up to 12 columns. This leaves no room to shift around the section.

  1. From the Dashboard, click Website, then Website Pages or Landing Pages.

  2. Click the Title of a page to open it in the editor.

  3. In the sidebar, select the section you want to edit.

  4. Scroll to Section Settings, then click Desktop Layout.

  5. Open the Horizontal alignment dropdown and select Left, Center, Right, Space Between, or Space Around.

  6. Click Save to keep your changes.

Did this answer your question?