Чтобы создать uni-каркас, воспользуйтесь мастером создания компонента http://components-creator.prologue-uni.ru/
Группа компонента обязательно должна быть Каркасы / Wireframes
2. Нажмите на кнопку Создать компонент
После нажатия на кнопку, архив с компонентом начнет скачиваться
3. Переместите компонент в проект
Откройте архив и переместите папку с компонентом в /extensions/Components/
4. Установите каркас на пустую страницу
5. Подключите стили и скрипты
В файле: /extensions/Components/Компонент/Views/Шаблон/static/dependencies.php - находится описание зависимостей css и js
<?php
return [
'css' => [
'this.component.template/static/css/style.css',
],
'js' => [
'this.component.template/static/js/script.js',
],
];
В подключенные файлы нужно добавить css и js код компонента. Если требуется, то нужно подключить дополнительные css и js файлы из библиотеки.
6. Подключите svg иконки
В файл /extensions/Components/Компонент/Views/Шаблон/components/icons.swg.php нужно добавить svg иконки если они есть в проекте
7. Подключите образ Каркаса в контроллер
В файл /extensions/Components/Компонент/Controllers/ИмяКомпонентаКаркасаController.php
подключите
use Modules\SiteSettings\App\Frame\FrameImage;
и перед рендером шаблона, подключите
$this->view->data['frame'] = FrameImage::loadImage(
[
'pageId' => Request::get('pageId')
]
);
Теперь в template.php и во всех ic() подключаемых компонентах будет доступен массив $data['frame'] с образом каркаса для использования.
8. Вывод данных из персонализации
На сайте используются данные которые относятся к персонализации сайта такие как: Номера телефонов, логотип, название компании, адрес и д.р.
Все эти данные редактируются в админ-панели и доступны в методе FrameImage::loadImage() в массиве personalization
9. Настройка вывода контента страницы
Для вывода контента страниц, используйте pageContent()
<? $this -> pageContent() ?>
10. Адаптация под текущую тему
Для адаптации, используйте инструкцию: https://dev.prologue-uni.ru/d/adaptaciya-komponenta-pod-tekuschuyu-dizayn-temu.html
11. Создание превью
Для того, чтобы наш каркас имел свое превью, необходимо сделать скриншет каркаса, ужать его до 400px по ширине и заменить им файл /extensions/Components/Компонент/Views/Шаблон/preview.png