1.3. Работа с шаблонами
С помощью этой главы Вы поймете как легко и проще управлять дизайном сайта, CSS и JS сайтами
Из предыдущего параграфа Вы уже знаете как Настроить шаблон и знаете про панель навигации по шаблону в меню справа. Все описанные в данном параграфе относится к разделу Редактирование шаблона. После перехода в настройки шаблона перед Вами область редактирования (Рис.1).
Над областью редактирования Вы увидите иконки. Каждая из них отвечает за свой файл. Начнем по порядку с лева на право. Но сперва небольшое описание работы самого редактора. При переключении между файлами не забывайте про сохранение, кнопка также находится над областью редактирования., можно использовать комбинацию Ctrl + S если поле редактирования находится в фокусе. Также при переключении между файлами, как Вы быстро заметите, последняя позиция скролла внутри файла сохраняется. Таким образом Вам не придется каждый раз пролистывать к нужному мету "киллометры" кода. А теперь по иконкам.
Первая иконка, как Вы уже поняли, это файл структуры HTML документа всего сайта. В силу специфики движка, что является отличительной чертой Online Web Engine, загрузка страницы идет не от файла страницы к ядру движка, а наоборот. Сперва загружается ядро движка, потом шаблон, потом определяется запрашиваемая страница и ее содержимое подставляется внутрь шаблона, в данном случае наша иконка с символом здания внутри. Самое главное в данном файле сохранить все элементы внутри тэга BODY и все переменные. Можно их переставлять относительно друг друга, но при этом не нарушая иерархии.
Следующая иконка отвечает за файл PHP скиптов шаблона. Код из этого файла подключается в ядро перед подключением страниц сайта. Этот файл поможет Вам провести какие-то собственные настройки шаблона и сайта. Все что Вы захотите отобразить на экране в данном файле не будет показываться на экране. Весь вывод в этом файле записывается в переменную $_SESSION['system']['currTemplateScriptEcho'].
Данная иконка отвечает за редактирование файла с CSS переменными. В данном файле CSS переменные перечисляются в формате JSON. Для корректной работы значения должны быть строками (Значения пишутся внутри двойных кавычек). Также значение может ссылаться на другое значение в этом файле. Для этого внутри двойных кавычек пишем "@this/название_ключа_переменной". Чтобы использовать строки в CSS файле, необходимо вместо значения CSS свойства прописать ссылку на переменную, например, width: @string/название_переменной.
Данный файл аналогичен предыдущему, с одним отличием, в этом файле вы перечислеяте только цвета. Если указать не цветовое значение, то результатом будет черный цвет. Цвета можно указывать в формате HEX от 1 до 8 символов: RRGGBBAA, RRGGBBA, RRGGBB, RRGGB, RRGG, RGB, RG, R. Или же в формате массива, например: [34, 101, 255, 255] или [34, 101, 255]. В первом случае вы перечислили значения для красного, зеленого, синего и альфа канала, во втором тоже самое, но без альфа канала. В CSS файле переменные данного цвета указываются следующим образом, background: @color/название_переменной.
Этот файл отвечает за содержимое шапки сайта. Контент из этого блока загружается в тэг HEADER. В файле Структуры HTML документа можете посмотреть где именно этот блок находится. Вы можете писать тут HTML и PHP кодом, можно даже смешанным способом. Весь вывод в этом файле записывается в переменную $_SESSION['system']['html']['parts']['head']. Так же можно писать вывод непосредственно в переменную $_SESSION['system']['html']['parts']['head']. У переменных в шаблоне, кстати, больший приоритет, чем у прямого вывода.
Эти два файла аналогичны и схожи между собой. Относительно содержимого файлов, все аналогично Шапке сайта. Выводятся они в тэги LEFT_CONTENT и RIGHT_CONTENT. Вывод записывается в переменные $_SESSION['system']['html']['parts']['left_content'] и $_SESSION['system']['html']['parts']['right_content'].
Все также как и у Шапки сайта. Вывод в тэг FOOT. Переменная для вывода $_SESSION['system']['html']['parts']['foot'].
Таких иконок может быть несколько и их можно сортировать между собой перетаскиванием. Загружаются на сайт они именно в том порядке, которым выводятся иконки этих файлов.
Таких иконок может быть несколько и их можно сортировать между собой перетаскиванием. Загружаются на сайт они именно в том порядке, которым выводятся иконки этих файлов.
Первая иконка открывает окно создания нового файла. После создания появляется новая иконка с новым файлом. Вторая иконка обновляет список файлов CSS и JS и их порядок.
Каждая из этих иконок открывает каталог на сервере. Первая с картинками, вторая с модулями и третья с AJAX скриптами. Первая и третья особой смысловой нагрузки не несут ни на сайт, ни на сам шаблон, сделаны лишь для удобства использования. Каждой из них соответсвуют следующие каталоги: images, modules и ajax. Второй каталог несет в себе уже влияние на сайт и движок. Из этого каталога подключаются шаблоны модулей в редактировании страниц. При навидении на иконку выплывает список уже имеющихся шаблонов модулей. В этом же списке находится кнопка создания нового шаблона модуля (Рис.2). При нажатии на название шаблона модулей открывается файловый менеджер с файлами шаблона модуля. Эти файлы уже редактируются через редактор файлового менеджера.
С помощью этой главы Вы поймете как легко и проще управлять дизайном сайта, CSS и JS сайтами
Информация необходимая для работы с админ панелью Online Web Engine
"Все с детства знают, что то-то и то-то невозможно. Но всегда находится дурак, который этого не знает. Он-то и делает открытие."