DevCraft Документации
УстаревшееMH Admin (Legacy)Front-End

Шаблоны

Документация по плагину шаблоны для DLE.

Все шаблоны расположены по пути engine/inc/maharder/admin/templates и engine/inc/maharder/_templates/ваш_модуль. Для оформления используется шаблонизатор Twig с некоторыми дополнениями.


Структура

📦templates
 ┣ 📂templateIncludes
 ┃ ┣ 📜addCheckbox.html
 ┃ ┣ 📜addInput.html
 ┃ ┣ 📜addSelect.html
 ┃ ┣ 📜addTextarea.html
 ┃ ┣ 📜boxes.html
 ┃ ┣ 📜loader.html
 ┃ ┗ 📜segRow.html
 ┣ 📂_macros
 ┃ ┣ 📜checkbox.twig
 ┃ ┣ 📜input.twig
 ┃ ┣ 📜menu.twig
 ┃ ┣ 📜pagination.twig
 ┃ ┣ 📜search.twig
 ┃ ┣ 📜select.twig
 ┃ ┗ 📜textarea.twig
 ┣ 📜base.html
 ┣ 📜breadcrumb.html
 ┣ 📜footer.html
 ┣ 📜menu.html
 ┗ 📜sidebar.html

Основное

base.html

Основной файл, который отвечает за всё подключение всех стилей и скриптов.

Блоки:

НазваниеОписание
titleБлок заголовка
contentБлок основного содержимого
scriptsБлок содержимого дополнительных скриптов

Автоматическая генерация хлебных крошек


footer.html

Вывод подвала, а так-же генерация ссылок


Вывод верхнего меню


sidebar.html

Вывод бокового меню для маленьких экранов


Подключение шаблонов

Все подключения находятся в папке engine/inc/maharder/admin/templates/templateIncludes.

  • Для общего блага и простоты использование рекомендуется использовать макросы
  • Все элементы выводятся через шаблон engine/inc/maharder/admin/templates/templateIncludes/segRow.html

boxes.html

Важный объект для создания табов.

Пример использования:

<div class="ui segment">
	{{ include('templateIncludes/boxes.html', {
		boxes: {
			main: {
				link: '#',
				name: 'Основные настройки',
				icon: 'home icon'
			},
			cron: {
				link: '#',
				name: 'Настройки крона',
				icon: 'clock outline icon'
			},
			telegram: {
				link: '#',
				name: 'Настройка бота',
				icon: 'universal access icon'
			},
			templates: {
				link: '#',
				name: 'Шаблоны',
				icon: 'pencil alternate icon'
			},
		}
	})
	}}
</div>

Параметры:

{{ include('templateIncludes/boxes.html', {
	boxes: {
		id: {
			link: '#',
			name: 'Название',
			icon: 'Класс'
		}
	}
	})
}}

Важным параметром является свойство boxes. Он перенимает объект в виде массива ссылок. Каждый элемент ссылки содержит четыре главных атрибута.

  • id - Универсальный индикатор, который будет так-же установлен у сегмента или блока. У первого блока обязательно должен быть класс .active.
  • id.link - Если указывается как часть табов, то нужно указывать #. Если же нужна ссылка в прямом смысле этого слова, то указывайте ссылку
  • id.name - Название таба
  • id.icon - Название класса иконки

Сегменты выглядят примерно так:

<form class="ui form segment">
	<div class="ui bottom attached tab active" data-tab="main"></div>
	<div class="ui bottom attached tab" data-tab="cron"></div>
	<div class="ui bottom attached tab" data-tab="telegram"></div>
</form>

segRow.html

Рекомендуется использовать лишь тогда, когда нет альтернативы или возможности вывести доп. информацию

Пример использования:

{{ include('templateIncludes/segRow.html', {
	id: 'cron_descr',
	name: 'Настройка крона',
	descr: "Если вы не сильны в crontab и не знаете как правильно настроить всё - данная функция для вас",
	html: 'Если у вас нет доступа к крону или SSH, то выполняем этот скрипт: <a href="' ~ dle_config.http_home_url ~ 'cron.php?cronmode=telegram" target="_blank">cron.php?cronmode=telegram</a><br>Если же вы всётаки его имеете, то выполните этот запрос <kbd>crontab -e</kbd> и в самый низ вставьте следующую строчку:<br><kbd>* * * * * /usr/bin/php -f ' ~document_root~ '/cron.php telegram</kbd><br>Простой генератор для крона можно увидеть тут: <a href="https://www.crontabgenerator.com" target="_blank">http://www.crontabgenerator.com</a><br>Замените <kbd>/usr/bin/php</kbd> на путь вашего интерпретатора. Если не знаете где он лежит, то узнаете это с помощью <kbd>which php</kbd>'
	})
}}

Параметры:

{{ include('templateIncludes/segRow.html', {
		type: type,
		id: id,
		name: name,
		descr: descr,
		html: html,
	})
}}

Рекомендуются именно эти параметры для вывода дополнительной информации в сегмент отображения данных.

ПараметрОписание
typeТип строки, для простого текста достаточно указать html
idУникальное значение строки
nameНазвание строки
descrОписание строки
htmlПроизвольная информация

Макросы

Функционал, который помогает в оформлении шаблонов, особенно с рекурсивными значениями.

  • Намерено для них было использование расширение twig, чтобы отличить от вставок
  • Рекомендуется использовать именно макросы, нежели вставки шаблонов из templateIncludes

checkbox.twig

Выводит переключатель

Метод подключения:

{% from "_macros/checkbox.twig" import checkbox %}

Использование:

{{ checkbox('onof', 'Включить модуль?', 'Включает/Выключает модуль', settings) }}

Параметры:

macro checkbox(id, name, descr, opts)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название кнопки
descrОписание кнопки
optsОбъект с настройками плагина

input.twig

Выводит форму простого заполнения текста

Содержит:

  • input - Простой и обычный текстовой ввод
  • tags - Текстовой ввод с поддержкой тегов
  • number - Численный ввод
  • hidden - Скрытое значение
  • file - Тип загрузки файла

Метод подключения:

{% from "_macros/input.twig" import input(, tags, number, ...) %}

Использование:

На примере input

{{ input('field', 'Укажите зависимость', 'Выберите поля зависимости, а так-же укажите значения, по которым будет вестись проверка данных перед отправкой в телеграм.', settings) }}

Параметры:

  • input - Простой и обычный текстовой ввод
  • tags - Текстовой ввод с поддержкой тегов
  • number - Численный ввод
  • hidden - Скрытое значение
macro input(id, name, descr, opts)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название кнопки
descrОписание кнопки
optsОбъект с настройками плагина
macro file(id, name, descr, opts, extra)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название кнопки
descrОписание кнопки
optsОбъект с настройками плагина
extraОбъект с дополнительными параметрами

Содержит макрос для генерации меню

Метод подключения:

{% from "_macros/menu.twig" import item %}

Использование:

{{ items(links, site, 'yes', 'no', 'firstLine') }}

Параметры:

macro item(items, _site, _first, _child, _fclass)
ПараметрОписание
itemsМассив с ссылками
_siteУказывается текущий объект / текущая страница
_firstУказывается первый ли ряд меню или нет. Принимает значения: yes или no. По умолчанию: yes
_childУказывается дочерние эелемнты или нет. Принимает значения: yes или no. По умолчанию: no
_fclassПеречень классов для первого ряда

pagination.twig

Содержит макрос для генерации пагинации

Метод подключения:

{% from "_macros/pagination.twig" import pagination %}

Использование:

{{ pagination(total_pages, page) }}

Параметры:

pagination(total, current, pages_name, first_last_page, active_pages)
ПараметрОписание
totalВсего новостей / объектов
currentТекущая страница
pages_nameНазвание параметра страницы в ссылке страницы, по умолчанию: page
first_last_pageУказывается сколько страниц показывать в начале и конце пагинации, если страниц много. По умолчанию: 2
active_pagesУказывается активный промежуток страниц и сколько страниц в нём должно быть отображено, если страниц много. По умолчанию: 3

search.twig

Содержит макрос для генерации поиска и фильтрации данных

ВНИМАНИЕ!

НАХОДИТСЯ В РАЗРАБОТКЕ!

Метод подключения:

{% from "_macros/search.twig" import search %}

Использование:

{{ search('telegram', 'cron', 'attached' ) }}

Параметры:

search(module, file, _type, _rmenu, _lmenu)
ПараметрОписание
moduleГлавный модуль, поиск будет происходить через ajax контроллер DLE и файл maharder.php
fileФайл, который будет отвечать за запросы
_typeТип меню, название класса
_rmenuДополнительные ссылки на правой стороне меню
_lmenuДополнительные ссылки на левой стороне меню

select.twig

Содержит макрос для выпадающего меню

Метод подключения:

{% from "_macros/select.twig" import select %}

Использование:

{{ select('field', 'Доп. поле со статусом', 'Укажите поле, где на данный момент выводится статус сериала.', settings, xfields) }}

Параметры:

macro select(id, name, descr, opts, vals)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название списка
descrОписание списка
optsОбъект с настройками плагина
valsЗначения для формирования списка, к примеру массив: [name => value]

textarea.twig

Содержит макрос для формы большого количества текста

Содержит:

  • text - Простой элемент ввода большого количества текста
  • editor - Похож на text, но к нему подключается редактор

Метод подключения:

{% from "_macros/textarea.twig" import text(, editor) %}

Использование:

{{ editor('template', 'Шаблон сообщения', 'Настройте свой шаблон для отправки сообщений. Разрешается использовать BB-код и HTML-код.', template_data) }}

Параметры:

text(id, name, descr, opts)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название текстового поля
descrОписание поля
optsОбъект с настройками плагина

filter.twig

Содержит макрос для формы большого количества текста

Содержит:

  • search_and_filter - Вывод поиска и фильтрации таблицы данных

Метод подключения:

{% from "_macros/textarea.twig" import text(, editor) %}

Использование:

{{ editor('template', 'Шаблон сообщения', 'Настройте свой шаблон для отправки сообщений. Разрешается использовать BB-код и HTML-код.', template_data) }}

Параметры:

text(id, name, descr, opts)
ПараметрОписание
idУникальное значение элемента, которое будет использоваться в обозначении самого плагина. Указывать на латинице
nameРусское название текстового поля
descrОписание поля
optsОбъект с настройками плагина

Перечень дополнений

DeclineExtension

В любом месте в шаблоне нужно указать тег decline для склонения. Пример:

{{ decline(count, ['рубль', 'рубля', 'рублей']) }}

Вместо count вставить переменную с количеством.

AdminUrlExtension

Дополнительные и глобальные ссылки и переменные в админпанеле и шаблонизаторе

ТегОписаниеПример вывода
assets_urlПрямая ссылка до папки со стилями и скриптами/engine/inc/maharder/admin/assets/
plugin_urlСсылка текущей страницы, вместе с параметрами/admin.php?mod=main&new=test
dle_login_hashХеш пользователя DLE1234567890ABCDEFGabcdefg
dle_configМассив конфирурации DLE
_serverМассив сервисной информации, аналог $_SERVER
_getМассив отфильтрованногого GET-запроса сервера, либо null
_postМассив отфильтрованногого POST-запроса сервера, либо null
languagesВыводит массив языков в админпанелиПример вывода можно посмотреть в menu.html
selected_langВыводит текущий язык в админпанелиru_RU
lang_dataМассив данных с информацией о текущем языкеoriginal => Русский, english => Russian, iso2 => ru, tag => ru_RU

On this page