Section Types

In Kajabi there are two types of sections, sections that the user can add to the page and sections that are pre loaded onto the page.

Static Sections

Static sections are generic groupings of settings that you explicitly add to the page in liquid and allow the user to edit the content but not the location of the section.

<div class="header">
  <div class="container">
    <div class="media align-items-center">
      <div>
        <a href="/">
          <img src="{{ section.settings.logo | image_picker_url: 'logo.png' }}" kjb-settings-id="{{ 'logo' | settings_id: section: section }}"/>
        </a>
      </div>
      <div class="media-body text-right">
        <span kjb-settings-id="{{ 'menu' | settings_id: section: section }}">
          <div data-gb-custom-block data-tag="for">

            <a href="{{ link.url }}">{{ link.name }}</a>
          

</div>

        </span>
      </div>
    </div>
  </div>
</div>

<div data-gb-custom-block data-tag="schema">

{
  "name": "Header",
  "elements": [
    {
      "type": "image_picker",
      "id": "logo",
      "label": "Logo Image"
    },
    {
      "type": "link_list",
      "id": "menu",
      "label": "Menu",
      "default": "main-menu"
    }
  ]
}

</div>

You will notice that the schema of this section does not have the preset tag. If a section has a preset tag it automatically gets added to the pickable section list. This section can only be used as a static section.

Static sections can be added to the page with the following


<div data-gb-custom-block data-tag="section" data-0='header'></div>

Dynamic Sections

The only thing you need to do to make a section available for a user to add and reorder on a page is to add a preset to the sections schema. This will give the pickable section a title and a set of settings to start the section off with.

"presets": [
  {
    "name": "Section",
    "category": "Content",
    "blocks": [],
    "settings": {
    }
  }
]

Last updated