Начало работы

Тема Pano определяет, как выглядит ваш сайт: цвета, шрифты и макет. Сложные части (вход, плагины, загрузка данных, сборка) за вас делает движок @panomc/theme-core. Ваша тема лежит поверх него и меняет только внешний вид.

Эта страница ведёт от нуля до работающей темы с вашим цветом. Это три шага, и до цвета вы не пишете ни одного файла вручную.

Быть экспертом не нужно

Каждый шаг можно скопировать и вставить. Немного HTML, CSS, JavaScript и Svelte помогает, но для старта не обязательно. Бесплатные руководства: svelte.dev/tutorial и MDN Web Docs.

Что вам нужно

Вам нужно	Что это
Bun	Устанавливает и запускает фронтенды Pano. Скачайте на bun.sh.
Работающий Pano	Ваш сервер или Pano на вашем компьютере. Если его нет, см. Установку. Тема общается с ним, пока вы работаете.
Редактор кода	Любой, например VS Code.

Быстрый старт

bunx @panomc/theme-core new              # задаёт четыре вопроса, затем устанавливает
cd my-theme && bun run dev:ui            # печатает одно поле панели, которое задаётся один раз

Затем в панели откройте Настройки → Платформа, включите Режим разработчика и впишите в появившееся под ним поле Сервер разработки темы адрес, который напечатала команда (http://localhost:3000). Сохраните и откройте адрес вашего Pano. Тема работает.

Вот и всё: три шага (каркас, dev, одно поле панели). Вы не правите конфиг Pano и не перезапускаете Pano, поэтому панель остаётся доступной во время работы.

Если bun install завис

Если он застрял на «Resolving...», остановите его (Ctrl + C) и запустите в папке bun install --backend=copyfile.

Имя темы в командной строке

bunx @panomc/theme-core new my-theme с именем ничего не спрашивает и не устанавливает. Перед bun run dev:ui выполните bun install в папке. Первая установка также генерирует маршруты, языковые файлы и мосты, отдельного шага синхронизации нет.

Заходите через Pano, а не через порт темы

Тема всегда работает за Pano. Откройте адрес Pano (например http://localhost:8088, когда Pano запущен с --dev). Собственный порт темы перенаправит вас туда.

Что делает поле панели

Пока поле Сервер разработки темы задано, режим фронтенда THEME, а режим разработчика включён: Pano не запускает собственный процесс темы и проксирует сайт на ваш dev-сервер. Панель, установка и UI плагинов работают как обычно. Очистите поле, и Pano вернётся к установленной теме.

Первое изменение

Откройте src/styles/tokens.scss. Это закомментированное меню всех токенов. Включите один:

$primary: #10b981;

Сохраните. Страница обновится сама. Тема, отличающаяся от vanilla, это четыре шага: три выше и эта правка.

bun run dev:ui также пересобирает стили при каждом сохранении. Просто bun run dev запускает только сервер, и правки стилей не будут видны.

Куда дальше

• Структура темы: какие файлы ваши, а какие сгенерированы.
• Кастомизация: токены, переменные --pano-* и ваш CSS.
• Представления: меняйте разметку, перерисовывайте представление плагина, размещайте блоки, переименовывайте маршруты, выбирайте главную.
• Локализация: переведите тему.
• Сборка и Публикация: выпустите её.

Та же страница, но короче, лежит в репозитории движка как QUICKSTART-THEME.md, а подробный справочник это THEME-AUTHOR-GUIDE.md.