Настройка Panel (админ-панели) Kirby

Настройка Panel (админ-панели) Kirby

Panel — встроенный интерфейс управления контентом Kirby. Работает на Vue.js, открывается по /panel (или настраиваемому пути). Всё поведение панели описывается через Blueprint-файлы в YAML — никаких кликов в настройках, всё версионируется вместе с кодом.

Первоначальная настройка

При первом обращении к /panel без существующих пользователей Kirby показывает форму регистрации администратора. После создания — форма закрывается автоматически. Для отключения ручного создания:

// site/config/config.php
return [
    'panel' => [
        'install' => false, // запрещает создание пользователей через браузер
        'slug'    => 'manage', // /manage вместо /panel
    ],
];

Blueprint для главного сайта

# site/blueprints/site.yml
title: Настройки сайта

tabs:
    general:
        label: Основное
        icon: settings
        fields:
            site_name:
                type: text
                label: Название сайта
                required: true
            site_description:
                type: textarea
                label: Описание
                maxlength: 160
            logo:
                type: files
                label: Логотип
                max: 1
                query: site.files.filterBy("extension", "svg")

    contacts:
        label: Контакты
        icon: email
        fields:
            email:
                type: email
                label: Email
            phone:
                type: tel
                label: Телефон
            address:
                type: textarea
                label: Адрес

    social:
        label: Соцсети
        icon: globe
        fields:
            social_links:
                type: structure
                label: Ссылки
                fields:
                    platform:
                        type: select
                        options:
                            telegram: Telegram
                            vk: VKontakte
                            youtube: YouTube
                            github: GitHub
                    url:
                        type: url

Blueprint страницы с вкладками

# site/blueprints/pages/service.yml
title: Услуга

columns:
    left:
        width: 2/3
        sections:
            content:
                type: fields
                fields:
                    title:
                        type: text
                        label: Заголовок
                        required: true
                    intro:
                        type: writer
                        label: Вводный абзац
                        marks:
                            - bold
                            - italic
                    body:
                        type: blocks
                        label: Содержимое
                        fieldsets:
                            - heading
                            - text
                            - image
                            - list
                            - callout

    right:
        width: 1/3
        sections:
            meta:
                type: fields
                fields:
                    slug:
                        type: slug
                        label: URL
                        sync: title
                    status:
                        type: select
                        label: Статус
                        options:
                            draft: Черновик
                            listed: Опубликовано
                    sort:
                        type: number
                        label: Порядок сортировки
                    icon:
                        type: files
                        label: Иконка
                        max: 1
                    seo_title:
                        type: text
                        label: SEO заголовок
                    seo_description:
                        type: textarea
                        label: SEO описание
                        maxlength: 160

Настройка прав доступа

Роли описываются в site/blueprints/users/:

# site/blueprints/users/editor.yml
title: Редактор

permissions:
    access:
        panel: true
        settings: false
        users: false
    pages:
        create: true
        delete: false
        duplicate: true
        update: true
        changeSlug: false
        changeStatus: true
    files:
        create: true
        delete: true
        update: true
    user:
        changePassword: true
        changeRole: false

Для тонкой настройки прав через код:

// site/config/config.php
return [
    'permissions' => [
        'pages' => [
            'delete' => function (): bool {
                /** @var \Kirby\Cms\User $user */
                $user = kirby()->user();
                // только администраторы могут удалять опубликованные страницы
                if ($this->isListed()) {
                    return $user->isAdmin();
                }
                return $user->role()->id() === 'editor';
            },
        ],
    ],
];

Кастомные разделы панели

Раздел — это список дочерних страниц или файлов с кастомной конфигурацией:

# site/blueprints/pages/blog.yml
title: Блог

sections:
    articles:
        type: pages
        label: Статьи
        template: article
        status: all
        layout: table
        info: "{{ page.date.toDate('d.m.Y') }}"
        columns:
            title:
                label: Заголовок
                width: 1/2
            date:
                label: Дата
                width: 1/4
            tags:
                label: Теги
                width: 1/4
        sortBy: date desc
        empty: Статей пока нет

    drafts:
        type: pages
        label: Черновики
        status: draft
        template: article
        layout: list

Поле «pages» для связей

related_articles:
    type: pages
    label: Похожие статьи
    query: site.find('blog').children.listed
    max: 3
    template: article
    layout: cards
    image:
        query: page.cover.toFile
        cover: true

Кастомизация вида карточки в списке

# в разделе или поле pages
info: "{{ page.date.toDate('d.m.Y') }} · {{ page.readingTime }} мин"
image:
    query: page.cover.toFile
    ratio: 3/2
    cover: true

Переопределение CSS панели

// site/config/config.php
return [
    'panel' => [
        'css' => 'assets/panel.css',
    ],
];

/* assets/panel.css */
:root {
    --color-black: #1a1a2e;
    --color-focus: #e94560;
}

.k-header-logo img {
    height: 32px;
}

Сроки

Базовая настройка панели с blueprints для 5–7 типов страниц и двумя ролями: 1–2 дня. Со сложными структурными полями, кастомными правами и кастомным CSS: 2–3 дня.