Cms cockpit: Представляем CockpitCMS — CMS для разработчиков

Документация

Документация

Начните изучать Cockpit или найдите специальные функции

— Ядро

  • О
  • Требования
  • Установка
  • Конфигурация
  • пользователей
  • Активы
  • Содержание
  • Локализация
  • Роли и разрешения
  • Типы полей
  • пробелов
  • CLI
  • Введение
  • Аутентификация
  • Активы
  • Содержание

Чтение основной документации

— Про аддоны

  • Около
  • Введение
  • Введение
  • API
  • Введение
  • Введение
  • API
  • Введение
  • API
  • Введение
  • Введение

Читать документацию Pro

Готовы начать

?

Получить кабину

Introduction

  • Introduction
  • Core Components
  • Button
  • Grid
  • Heading
  • HTML
  • Link
  • Markdown
  • Richtext
  • Section
  • Spacer
  • Custom Components

Introduction

Макеты — это способ Cockpit для создания контента, структурированного в соответствии с требованиями веб-сайтов и приложений. В качестве безголовой cms Cockpit хранит и обслуживает данные макета через свой API для страниц и контента, таких как коллекции и синглтоны. Клиент, извлекающий данные из API Cockpit, должен обрабатывать компоненты для создания макета, то есть HTML для веб-сайта.

Вообще говоря, самый распространенный вариант использования Layout — страницы, которые позволяют составить макет, содержащий данные, организованные в виде компонентов. Макет Сам по себе на самом деле является просто полем типа Макет, как описано в списке типов полей. По умолчанию Cockpit поставляется со списком компонентов макета, описанных в этом разделе.

Основные компоненты

Значения, хранящиеся для каждого компонента поля макета, описаны в качестве примера в этом разделе документации как Результат примера . При извлечении данных с помощью Cockpit API вы получите эти значения.

Кнопка

Используйте компонент Button всякий раз, когда вы хотите иметь кнопку в макете. Компонент не имеет дочерних элементов. Вы можете предоставить

  • адрес
  • заголовок
  • цель

Пример результата:

 {
    "компонент": "кнопка",
    "label": "Пример кнопки",
    "дети": ноль,
    "данные": {
        "url": "https://www.example.com",
        "заголовок": ноль,
        "цель": "_self"
    }
}

Сетка

Используйте компонент Grid всякий раз, когда вы хотите организовать свой контент в виде сетки из одного или нескольких столбцов. В сетке каждый определенный столбец содержит предоставленные вами компоненты (дочерние элементы). Вы можете предоставить

  • класс
  • colWith

Пример результата:

 {
  "компонент": "сетка",
  "label": "Пример сетки",
  "дети": ноль,
  "данные": {
    "класс": "пример-сетка-css-класс",
    "colWidth": "авто"
  },
  "столбцы": [
    {
      "данные": [],
      "составные части": []
    },
    {
      "данные": [],
      "составные части": []
    }
    // . ..здесь больше столбцов
  ]
}

Товарная позиция

Используйте компонент Заголовок всякий раз, когда вы хотите иметь заголовок в своем макете. Компонент не имеет дочерних элементов. Вы можете предоставить

  • текст
  • уровень

Пример результата:

 {
    "компонент": "заголовок",
    "label": "Пример заголовка",
    "дети": ноль,
    "данные": {
        "текст": "пример h2",
        "1-й уровень"
    }
}

HTML

Используйте компонент HTML всякий раз, когда вы хотите добавить HTML-контент в свой макет. В отличие от компонента Richtext, должен быть написан простой HTML. Компонент не имеет дочерних элементов. Вы можете предоставить

  • HTML

Пример результата:

 {
    "компонент": "html",
    "label": "Пример HTML",
    "дети": ноль,
    "данные": {
        "html": "Привет мир.\n\nЭто пример содержания HTML."
    }
}

Ссылка

Используйте компонент Link всякий раз, когда вы хотите предоставить ссылку в своем макете. Компонент не имеет дочерних элементов. Вы можете предоставить

  • адрес
  • заголовок
  • цель

Пример результата:

 {
    "компонент": "ссылка",
    "label": "Пример ссылки",
    "дети": ноль,
    "данные": {
        "url": "https://www.example.com",
        "заголовок": ноль,
        "цель": "_self"
    }
}

Уценка

Используйте компонент Markdown всякий раз, когда вы хотите обеспечить уценку в своем макете. Предоставление уценки не обязательно означает, что клиент использует контент, предоставленный как уценка, таким же образом. Вы можете использовать уценку для написания своего контента в качестве альтернативы компонентам Richtext или HTML. Клиент, использующий Cockpit API, может отображать его соответствующим образом, например, как HTML для веб-сайта. Компонент не имеет дочерних элементов. Вы можете предоставить

  • уценка

Пример результата:

 {
    "компонент": "уценка",
    "label": "Пример уценки",
    "дети": ноль,
    "данные": {
        "markdown": "**Пример** уценки. \n\nЭто *пример* уценки."
    }
}

Форматированный текст

Используйте компонент Richtext всякий раз, когда вы хотите предоставить HTML в своем макете без написания простого HTML, как с компонентом HTML. Компонент не имеет дочерних элементов. Вы можете предоставить

  • HTML

Пример результата:

 {
    "компонент": "форматированный текст",
    "label": "Пример форматированного текста",
    "дети": ноль,
    "данные": {
        "html": "
Привет, мир.
\n
 
\n
Это HTML, созданный с помощью редактор форматированного текста.
"
    }
}

Секция

Используйте компонент Section всякий раз, когда вы хотите сгруппировать содержимое в макете. Организация контента по разделам может быть очень полезна, если контент связан, т. е. заголовок, текст и изображение принадлежат друг другу. Компонент имеет дочерние элементы. Вы можете предоставить

  • класс

Пример результата:

 {
    "компонент": "раздел",
    "label": "Пример раздела",
    "дети": [],
    "данные": {
        "класс": "пример-раздел-css-класс"
    }
}

Распорка

Используйте компонент Spacer всякий раз, когда вы хотите обеспечить интервал в макете.