#{extends 'Web/layout-with-menu.html'/}
%{title = 'web.admin.doc'.i18n()}%
%{demoPage = models.WebPage.ROOT.children()[0]}%
${title}
Есть два варианта редактирования сайта:
- Для вебмастера, знающего HTML, с прямым доступом к файлам и неограниченными возможностями
- Для редактора, делающего более простые изменения через веб-интерфейс
В любом случае, все изменения производятся в тестовой среде, где можно удостоверится в их правильности.
Затем, и вебмастер и редактор должны опубликовать свои изменения, чтобы они попали в боевую среду.
При этом желательно оставить также комментарий, кратко описывающий причину сделанных изменений.
После публикации изменения появляются в боевой среде в течение 5-10 минут.
Работа через веб-интерфейс
Для изменения сайта и публикации изменений через веб-интерфейс необходимо сделать логин пользователем, у кого есть соответствующие права.
После логина на редактируемых страницах вверху появятся кнопки, позволяющие редактировать.
- Изменение содержимого текущей страницы
-
По умолчанию, режим изменения содержания выключен. Для включения выберите в опциях страницы вверху &{'web.admin.editContent'}.
После этого, изменяемые блоки содержимого будут подсвечены при наводе на них мышью. Для изменения, кликните вовнутрь блока, делайте изменения и затем нажимайте кнопку &{'web.admin.save'}.
Важно: после сохранения одного или нескольких изменений на одной или нескольких страницах, их необходимо опубликовать, иначе они не попадут в боевую среду.
- Публикация изменений
-
Кнопка &{'web.admin'} всегда активна вверху страницы после логина. При нажатии на неё будет показан список текущих неопубликованных изменений с возможностью из опубликовать.
Важно: не забывайте писать комментарий при публикации, чтобы потом было понятно, по какой причине было сделано изменение. Перед публикацией необходимо выбрать также публикуемые файлы.
Внизу страницы выводятся последние опубликованные изменения с комментариями и именами авторов.
- Загрузка файлов и картинок
-
В активном редакторе сожержимого нажмите кнопку &{'web.admin.browse'} слева от &{'web.admin.save'}. Будет открыто окно с файлами в папке текущей страницы.
В этом окне есть возможность загрузить новые файлы. При клике на загруженный файл он будет добавлен в содержимое в виде картинки либо ссылки на файл для скачивания.
Важно: не загружайте файлы с русскими буквами либо другими символами в именах, иначе некоторые пользователи не смогут их скачать. Не загружайте также по возможности
архивные файлы (ZIP, RAR, 7Z) или форматы Microsoft Office - вместо них необходимо использовать стандартизованный формат PDF. Разрешенные форматы изображений: PNG, JPG, GIF.
- Изменение свойств страницы
-
С помощью выбора &{'web.admin.editMetadata'} можно менять свойства страницы (metadata), например, заглавие или описание для поисковых систем. Также, можно спрятать страницу из меню либо поменять порядок отображения.
- Копирование страниц
-
Копирование предназначено для создания новых страниц на базе старых, например, для добавления нового продукта в линейку существующих.
Важно: при копировании будет скопирована также вся иерархия подстраниц, что может привести к нежелательным результатам. Будьте осторожны.
- Удаление страниц
-
Есть возможность удаления страниц, например, ошибочно скопированных либо не имеющих больше смысла.
Важно: при удалении старой страницы удостоверьтесь, что на неё нет ссылок из других мест.
Альтернатива удалению - скрыть страницу с помощью выбора &{'web.admin.editMetadata'}.
- Добавление новостей, партнёров, вакансий
-
Для добавления новостей любого типа, партнёров или вакансий, необходимо перейти в соответсвующий раздел сайта и нажать справа на соответвующую кнопку.
После добавления редактируйте содержание так же, как и другие страницы с помощью выбора &{'web.admin.editContent'}.
Как все устроено
Структура меню сайта описывается с помощью иерархии папок, где каждая папка соответствует странице, адрес которой формируется из пути к этой папке.
Внутри каждой папки располагаются файлы, с помощью которых она отображается. Это файлы .html для содержания, картинки, pdf-файлы для скачивания и т.п.
metadata.properties
В этом файле описываются мета-данные страницы. Возможны следующие параметры (все опциональны):
#{list models.MetadataField.ALL, as:'field'}
- ${field.name}: &{'web.metadata.' + field.name}
#{/list}
Пример содержания файла:
${demoPage.loadFile("metadata.properties")}
Шаблоны
Доступные шаблоны страниц и их заменяемые части:
#{list templates, as:'template'}
-
${template.name} ${template.description} ${template.parts}
#{/list}
Содержание
Содержание страницы формируется с помощью указанного в мета-данных шаблона и последующего замещения его частей на содержание соответствующих .html файлов в папке страницы.
Например, если шаблон не указан либо указан шаблон custom, то он описывает всего одну заменяемую часть - content. Следовательно, в папке надо разместить файл
с названием content.html, содержание которого будет отображено в середине страницы, между шапкой и подвалом. Если поддерживаемые шаблоном части не найдены в папке страницы,
то вместо них ничего не будет вставлено.
Второй пример: если надо поменять главный баннер на странице /individual (использующей шаблон frontpage), то веб-мастер (залогинившись на сайт)
на этой странице может навести мышкой на этот баннер и увидеть название файла с его содержанием красным цветом, в данном случае - main-banner.
Следовательно, изменение баннера происходит в файле /individual/main-banner.html.
Использование HTML/CSS
В большинстве случаев достаточно писать простой HTML и использовать стандартные тэги.
Для базового CSS используется проект Twitter Bootstrap, так что вся типография, описанная там, применима и здесь.
Заголовок 1
Заголовок 2
Заголовок 3 и выделение
Абзац текста и маленькая вставка, в том числе в заголовках.
Некоторый текст можно выделить или наоборот.
Списки
- Элемент списка 1
- Элемент списка 2
- Элемент списка
- Элемент списка
Таблицы
%{tableClass = 'table'}%
#{include 'WebAdmin/demo-table.html'/}
%{tableClass = 'table table-condensed'}%
#{include 'WebAdmin/demo-table.html'/}
%{tableClass = 'table table-bordered'}%
#{include 'WebAdmin/demo-table.html'/}
%{tableClass = 'table table-striped'}%
#{include 'WebAdmin/demo-table.html'/}
%{tableClass = 'table table-bordered table-striped table-condensed'}%
#{include 'WebAdmin/demo-table.html'/}
Ссылки
Обычная ссылка
Ссылка со стрелкой
*{TODO: links, chevron
TODO: files
TODO: images}*
Картинки и файлы для скачивания
В эти же папки можно класть картинки и любые другие файлы и ссылаться на них из содержания только по названию.
<img src="filename.png">
К файлам для скачивания будет автоматически добавлена иконка и размер файла
<a href="report.pdf">Скачайте отчёт</a>
Будет выглядеть так: Скачайте отчёт (PDF, 1.3 Mb)
В данный момент только файлы ${models.WebPage.ALLOWED_FILE_TYPES} будут доступны для скачивания.
Формы
Для создания веб-формы надо создать страницу с шаболоном form и описать поля формы в файле form.html.
Поля описываются с помощью стандартных HTML5 полей, например:
<input type="email" name="Э-почта">
<textarea rows="4" name="Комментарии"></textarea>
Необходимо использовать всегда точный атрибут type (для валидации). Атрибут name будет отображен пользователю и будет использован также при посылке заполненной формы получателю.
Получател(и) формы определяются в metadata.properties, поле email.
Если необходимо добавить к форме также выбор отделения, надо добавить поле branchSelection: true.
Также, можно добавить дополнительных получателей для каждого офиса с помощью поля email.Название-Офиса.