Страницы и переменные
Администрирование и управление контентом CMS Zeta Web выполняется в программе 1С: Предприятие.
Zeta Web 2.x
Основные инструменты доступны в панели управления сайтом, которую можно открыть из меню Zeta Web, кликнув на соответствующий пункт меню "Панель управления сайтом".
Zeta Web 3.x
Основные инструменты доступны по ссылке меню Инструменты Zeta Web →Панель управления "Контент".
Области, переменные, страницы
Разделение html-контента на области, страницы и переменные - условно.
Все контейнеры поддерживают хранение статического html-кода, контролов и вложенных контейнеров.
Переменная - это переиспользуемый контейнер, который может быть использован при верстке других переменных, областей и страниц.
Область - определяет контент в определенной части дизайна (шапка, подвал, левая и правая колонки).
Страница - определяет основной контент дизайна.
Добавление нового html-контейнера
Zeta Web 2.x
Для добавления нового html-контента перейдите на вкладку Наполнение сайта и затем на вкладку Страницы / Переменные.
Выберите нужную группу (области, переменные или страницы) и нажмите "Добавить".
Zeta Web 3.x
Перейдите на вкладку Основные и заполните поле Наименование.
Вы можете указать в поле Имя в URL свое значение, в противном случае в это поле будет подставлено значение из поля Наименование переведенное в транслит.
Нажмите кнопку "Записать".
Значение поля Имя в URL должно быть уникальным.
В случае автоматической генерации - это правило соблюдается автоматически (к наименованию добавляется числовой суффикс).
Для областей и переменных - значение этого поля не влияет на формирование URL и не участвует в конечном html-коде страницы.
Для страниц - значение из этого поля будет участвовать в формировании адреса данной страницы.
Разграничение прав доступа к html-контейнеру
После записи вновь-созданного html-контейнера, вы можете настраивать доступность этого контейнера различным группам пользователей.
Для настройки прав перейдите на вкладку Доступ ролей. Установите флажок напротив тех ролей, которым должен быть доступен html-контент и нажмите кнопку Записать.
Для html-контейнера, который установлен в качестве значения области в дизайне сайта не действует настройка разграничения прав при просмотре страницы, но правила работают в штатном режиме, если данный контейнер расположен в другом html-контейнере.
Добавление контента
Zeta Web 2.x
Для добавления/изменения контента, нажмите на кнопку "Редактировать наполнение" или нажмите на окно предварительного просмотра html-контента.
В визуальном редакторе доступны следующие действия:
Ввод и редактирование текста**;**
Добавление / редактирование ссылки;
Добавление / редактирование изображения;;
Добавление вложенного html-контейнера
Добавление контрола.
В редакторе текста:
Ввод и форматирование текста.
Zeta Web 3.x
Для добавления/изменения контента, нажмите на кнопку "Редактировать".
Работа визуальном редакторе
Ввод и редактирование текста в визуальном редакторе
Начните вводить текст непосредственно в окне редактора. Форматировании текста вам доступны быстрые комбинации клавиш, таких как CTRL + B (жирный), CTRL + I (курсив), CTRL + U (подчеркнутый), CTRL + MouseScrol (увеличение / уменьшение размера текста) и т.д.
Мы не рекомендуем использовать визуальный редактор для полноценной верстки. С его помощью легко поправить опечатку или добавить картинку.
Более правильно для других задач использовать "Редактор текста".
Добавление / редактирование ссылки в визуальном редакторе
Вы можете добавить ссылку:
На внутреннюю страницу;
На внешнюю страницу;
- Добавление перетаскиванием:
Перейдите не вкладку HTML Элементы и перетащите элемент Ссылка в окно визуального редактора.
В открывшемся окне выберите адрес назначения нажав на "...":
Строка - добавление ссылки на внешний ресурс, например, https://google.ru;
Картинка (Zeta Web) - добавление ссылки на скачивание файла;
Страницы / переменные (Zeta Web) - добавление ссылки на внутреннюю страницу.
Также, укажите текст / пиктограмму для ссылки в поле Картинка / текст нажав на "...":
Строка - строковое представление ссылки;
Картинка (Zeta Web) - ссылка в виде изображения.
Значение полей Подсказка, Класс и Targe добавится в атрибуты title, class и target соответственно для тега <a>.
- Быстрое добавление:
Выделите текст, который необходимо преобразовать в ссылку и нажмите на значок Ссылка в верхнем меню редактора. В результате откроется окно добавления новой ссылки с заполненным полем Картинка / текст
- Быстрое удаление:
Установите курсор мыши на ссылке и нажмите на значок "Удалить ссылку" в верхнем меню редактора.
- Редактирование ссылки:
Установите курсор мыши на ссылке и нажмите значок Редактировать в верхнем меню редактора. В результате откроется окно редактирования ссылки.
Пример сгенерированного html-кода:
<a title="Переход на гоавную страницу" class="clearfix" href="#" zw="PABQAHIAbwBwAGUAcgB0AGkAZQBzAD4APABUAHkAcABlAEkARAA+AFQAQQBCAHAAQQBHADQAQQBhAHcAQQA9ADwALwBUAHkAcABlAEkARAA+ADwAQwBsAGEAcwBzAD4AWQB3AEIAcwBBAEcAVQBBAFkAUQBCAHkAQQBHAFkAQQBhAFEAQgA0AEEAQQA9AD0APAAvAEMAbABhAHMAcwA+ADwAVABhAHIAZwBlAHQAPgBYAHcAQgB6AEEARwBVAEEAYgBBAEIAbQBBAEEAPQA9ADwALwBUAGEAcgBnAGUAdAA+ADwAVABpAHQAbABlAD4ASAB3AFEAMQBCAEUAQQBFAE4AUQBSAEYAQgBEADQARQBOAEEAUQBnAEEARAAwAEUATQBBAFEAZwBBAEQATQBFAFAAZwBRAHcAQgBEAEkARQBQAFEAUgBEAEIARQA0AEUASQBBAEIAQgBCAEUASQBFAFEAQQBRAHcAQgBEADAARQBPAEEAUgBHAEIARQBNAEUAPAAvAFQAaQB0AGwAZQA+ADwASAByAGUAZgA+AE4AZwBBADAAQQBHAFkAQQBaAFEAQQB6AEEARABRAEEAWgBnAEEAegBBAEMAMABBAE4AUQBCAG0AQQBHAFEAQQBPAFEAQQB0AEEARABFAEEATQBRAEIAbABBAEQAWQBBAEwAUQBBADUAQQBEAFEAQQBaAGcAQQB3AEEAQwAwAEEATQBBAEEAdwBBAEQARQBBAE4AUQBBADEAQQBHAFEAQQBNAFEAQQAxAEEARwBVAEEATQB3AEEAeABBAEQAUQBBADwALwBIAHIAZQBmAD4APAAvAFAAcgBvAHAAZQByAHQAaQBlAHMAPgA="> На главную </a>
Атрибут zw является служебным атрибутом и будет убран из сгенерированного html-кода страницы в процессе ее обработки.
Добавление / редактирование изображения в визуальном редакторе
- Добавление:
- Редактирование:
Выделите изображение курсором мыши и нажмите значок Редактировать в верхнем меню редактора. В результате откроется окно редактирования изображения.
Пример сгенерированного html-кода:
<img width="100" height="100" title="Запасная часть" class="clearfix" alt="Запасная часть" src="C:\Users\tarasovna\AppData\Local\Temp\43bd86a8-c49e-11e9-8970-00155d153b1a" zw="PABQAHIAbwBwAGUAcgB0AGkAZQBzAD4APABUAHkAcABlAEkARAA+AFMAUQBCAHQAQQBHAEUAQQBaAHcAQgBsAEEAQQA9AD0APAAvAFQAeQBwAGUASQBEAD4APABDAGwAYQBzAHMAPgBZAHcAQgBzAEEARwBVAEEAWQBRAEIAeQBBAEcAWQBBAGEAUQBCADQAQQBBAD0APQA8AC8AQwBsAGEAcwBzAD4APABXAGkAZAB0AGgAPgBNAFEAQQB3AEEARABBAEEAPAAvAFcAaQBkAHQAaAA+ADwASABlAGkAZwBoAHQAPgBNAFEAQQB3AEEARABBAEEAPAAvAEgAZQBpAGcAaAB0AD4APABBAGwAdAA+AEYAdwBRAHcAQgBEADgARQBNAEEAUgBCAEIARAAwAEUATQBBAFIAUABCAEMAQQBBAFIAdwBRAHcAQgBFAEUARQBRAGcAUgBNAEIAQQA9AD0APAAvAEEAbAB0AD4APABUAGkAdABsAGUAPgBGAHcAUQB3AEIARAA4AEUATQBBAFIAQgBCAEQAMABFAE0AQQBSAFAAQgBDAEEAQQBSAHcAUQB3AEIARQBFAEUAUQBnAFIATQBCAEEAPQA9ADwALwBUAGkAdABsAGUAPgA8AFMAcgBjAD4ATgBBAEEAegBBAEcASQBBAFoAQQBBADQAQQBEAFkAQQBZAFEAQQA0AEEAQwAwAEEAWQB3AEEAMABBAEQAawBBAFoAUQBBAHQAQQBEAEUAQQBNAFEAQgBsAEEARABrAEEATABRAEEANABBAEQAawBBAE4AdwBBAHcAQQBDADAAQQBNAEEAQQB3AEEARABFAEEATgBRAEEAMQBBAEcAUQBBAE0AUQBBADEAQQBEAE0AQQBZAGcAQQB4AEEARwBFAEEAPAAvAFMAcgBjAD4APABGAG8AcgBtAGEAdAA+AEwAZwBCAHEAQQBIAEEAQQBaAHcAQQA9ADwALwBGAG8AcgBtAGEAdAA+ADwALwBQAHIAbwBwAGUAcgB0AGkAZQBzAD4A" />
Атрибут zw является служебным атрибутом и будет убран из сгенерированного html-кода страницы в процессе ее обработки.
Добавление вложенного html-контейнера в визуальном редакторе
Перейдите не вкладку Переменные и перетащите элемент Ссылка в окно визуального редактора.
Избегайте использование html-контейнера в самом себе (зацикливание).
При изменении html-контента в переменной header-logo изменение текущего html-контейнера не требуется.
Пример сгенерированного html-кода:
<div style="BORDER-TOP: rgb(198,198,198) 1px solid; BORDER-RIGHT: rgb(198,198,198) 1px solid; WIDTH: 150px; BORDER-BOTTOM: rgb(198,198,198) 1px solid; PADDING-BOTTOM: 5px; TEXT-ALIGN: center; PADDING-TOP: 5px; PADDING-LEFT: 5px; BORDER-LEFT: rgb(198,198,198) 1px solid; PADDING-RIGHT: 5px; BACKGROUND-COLOR: rgb(239,239,239)" zw="PABQAHIAbwBwAGUAcgB0AGkAZQBzAD4APABDAG8AbgB0AHIAbwBsAEkARAA+AE8AQQBCAGwAQQBHAEkAQQBaAEEAQgBoAEEARABRAEEATgBBAEIAaQBBAEMAMABBAE4AZwBBAHcAQQBEAFUAQQBPAFEAQQB0AEEARABFAEEATQBRAEIAbABBAEQAWQBBAEwAUQBBADUAQQBEAFEAQQBaAGcAQQB3AEEAQwAwAEEATQBBAEEAdwBBAEQARQBBAE4AUQBBADEAQQBHAFEAQQBNAFEAQQAxAEEARwBVAEEATQB3AEEAeABBAEQAUQBBADwALwBDAG8AbgB0AHIAbwBsAEkARAA+ADwAVAB5AHAAZQBJAEQAPgBWAGcAQgBoAEEASABJAEEAYQBRAEIAaABBAEcASQBBAGIAQQBCAGwAQQBBAD0APQA8AC8AVAB5AHAAZQBJAEQAPgA8AC8AUAByAG8AcABlAHIAdABpAGUAcwA+AA=="> header-logo </div>
Все содержимое тега div с атрибутом zw, а также сам тег div будет заменен на значение html-контента использованного html-контейнера в сгенерированном html-коде страницы в процессе ее обработки.
Добавление контрола в визуальном редакторе
- Добавление перетаскиванием:
Перейдите не вкладку Шабл. контр., выберите нужный контрол и перетащите его в окно визуального редактора.
В результате, откроется окно настройки параметров контрола.
У каждого контрола индивидуальный набор параметров.
Параметры бывают обязательные (отмечены галочкой) и общие (например, размер станицы выводимых контролом данных).
- Редактирование параметров контрола:
Выделите пиктограмму контрола курсором мыши и нажмите значок Редактировать в верхнем меню редактора. В результате откроется окно редактирования параметров контрола.
Пример кода:
<img src="C:\Users\tarasovna\AppData\Local\Temp\ЗетаWEB_zw_ProductSearchByCodeOrText" zw="PABQAHIAbwBwAGUAcgB0AGkAZQBzAD4APABDAG8AbgB0AHIAbwBsAEkARAA+AGUAZwBCADMAQQBGADgAQQBVAEEAQgB5AEEARwA4AEEAWgBBAEIAMQBBAEcATQBBAGQAQQBCAFQAQQBHAFUAQQBZAFEAQgB5AEEARwBNAEEAYQBBAEIAQwBBAEgAawBBAFEAdwBCAHYAQQBHAFEAQQBaAFEAQgBQAEEASABJAEEAVgBBAEIAbABBAEgAZwBBAGQAQQBBAHUAQQBHAEUAQQBjAHcAQgBqAEEASABnAEEAPAAvAEMAbwBuAHQAcgBvAGwASQBEAD4APABUAHkAcABlAEkARAA+AFEAdwBCAHYAQQBHADQAQQBkAEEAQgB5AEEARwA4AEEAYgBBAEEAPQA8AC8AVAB5AHAAZQBJAEQAPgA8AEkAbgBzAHQAYQBuAGMAZQBJAEQAPgBNAEEAQQB3AEEARABBAEEATQBBAEEAdwBBAEQAQQBBAE0AQQBBAHcAQQBDADAAQQBNAEEAQQB3AEEARABBAEEATQBBAEEAdABBAEQAQQBBAE0AQQBBAHcAQQBEAEEAQQBMAFEAQQB3AEEARABBAEEATQBBAEEAdwBBAEMAMABBAE0AQQBBAHcAQQBEAEEAQQBNAEEAQQB3AEEARABBAEEATQBBAEEAdwBBAEQAQQBBAE0AQQBBAHcAQQBEAEEAQQA8AC8ASQBuAHMAdABhAG4AYwBlAEkARAA+ADwAUwBpAHQAZQBUAGUAbQBwAGwAYQB0AGUAcwBJAGQAPgBZAGcAQQA1AEEARwBVAEEATgBRAEIAbABBAEcAUQBBAE0AQQBBAHkAQQBDADAAQQBPAEEAQQA0AEEARABrAEEATgBnAEEAdABBAEQARQBBAE0AUQBCAGwAQQBEAGMAQQBMAFEAQQA0AEEARABnAEEAWQBRAEEAMwBBAEMAMABBAE0AQQBBAHcAQQBEAEUAQQBOAFEAQQAxAEEARwBRAEEATQBRAEEAMQBBAEQATQBBAFkAZwBBAHcAQQBEAE0AQQA8AC8AUwBpAHQAZQBUAGUAbQBwAGwAYQB0AGUAcwBJAGQAPgA8AEkAcwBQAHIAaQBtAGEAcgB5AD4AWgBnAEIAaABBAEcAdwBBAGMAdwBCAGwAQQBBAD0APQA8AC8ASQBzAFAAcgBpAG0AYQByAHkAPgA8AEgAaQBkAGUARgBvAHIAUgBlAGcAaQBzAHQAZQByAGUAZAA+AFoAZwBCAGgAQQBHAHcAQQBjAHcAQgBsAEEAQQA9AD0APAAvAEgAaQBkAGUARgBvAHIAUgBlAGcAaQBzAHQAZQByAGUAZAA+ADwASABpAGQAZQBGAG8AcgBBAG4AbwBuAHkAbQBvAHUAcwA+AFoAZwBCAGgAQQBHAHcAQQBjAHcAQgBsAEEAQQA9AD0APAAvAEgAaQBkAGUARgBvAHIAQQBuAG8AbgB5AG0AbwB1AHMAPgA8AEgAaQBkAGUAQwBvAG4AdAByAG8AbABJAGYARQBtAHAAdAB5AD4AWgBnAEIAaABBAEcAdwBBAGMAdwBCAGwAQQBBAD0APQA8AC8ASABpAGQAZQBDAG8AbgB0AHIAbwBsAEkAZgBFAG0AcAB0AHkAPgA8AEkAcwBTAGEAdgBlAFUAcwBlAHIAVgBhAGwAdQBlAHMAPgBaAGcAQgBoAEEARwB3AEEAYwB3AEIAbABBAEEAPQA9ADwALwBJAHMAUwBhAHYAZQBVAHMAZQByAFYAYQBsAHUAZQBzAD4APABJAHMAQQB1AHQAbwBDAGwAYQByAGkAZgB5AFcAaABlAG4ATwBuAGUAQgByAGEAbgBkAEYAbwB1AG4AZAA+AFoAZwBCAGgAQQBHAHcAQQBjAHcAQgBsAEEAQQA9AD0APAAvAEkAcwBBAHUAdABvAEMAbABhAHIAaQBmAHkAVwBoAGUAbgBPAG4AZQBCAHIAYQBuAGQARgBvAHUAbgBkAD4APABSAGUAbgBhAG0AZQBWAGUAbgBkAG8AcgBOAGEAbQBlAHMAVwBpAHQAaABXAHMAZwBWAGUAbgBkAG8AcgBOAGEAbQBlAHMAPgBaAGcAQgBoAEEARwB3AEEAYwB3AEIAbABBAEEAPQA9ADwALwBSAGUAbgBhAG0AZQBWAGUAbgBkAG8AcgBOAGEAbQBlAHMAVwBpAHQAaABXAHMAZwBWAGUAbgBkAG8AcgBOAGEAbQBlAHMAPgA8AEQAbwBOAG8AdABVAHMAZQBUAGUAYwBEAG8AYwBQAGEAcgB0AHMAPgBaAGcAQgBoAEEARwB3AEEAYwB3AEIAbABBAEEAPQA9ADwALwBEAG8ATgBvAHQAVQBzAGUAVABlAGMARABvAGMAUABhAHIAdABzAD4APABIAGkAZABlAFAAcgBvAGQAdQBjAHQAUwBlAGEAcgBjAGgAZQBkAEIAeQBVAHMAZQByAHMAQwBvAGQAZQBzAD4AWgBnAEIAaABBAEcAdwBBAGMAdwBCAGwAQQBBAD0APQA8AC8ASABpAGQAZQBQAHIAbwBkAHUAYwB0AFMAZQBhAHIAYwBoAGUAZABCAHkAVQBzAGUAcgBzAEMAbwBkAGUAcwA+ADwALwBQAHIAbwBwAGUAcgB0AGkAZQBzAD4A" new="new" />
Тэг img с атрибутом zw будет заменен на тег div с набором служебных атрибутов (cp_...), содержимое которого будет сгенерировано в соответствии с указанным в параметрах шаблона.
Ввод и форматирование текста в редакторе текста
Zeta Web 2.x
В редакторе текста вы можете набирать html-код как вручную, так и вставив его из любого внешнего редактора.
Zeta Web 3.x
Для форматирования текста нажмите кнопку Форматировать в верхнем меню редактора.
<!-- неотформатированный текст --> <table><tr><td>column 1</td><td> column 2</td></table> <!-- отформатированный текст --> <table> <tr> <td> column 1 </td> <td> column 2 </td> </tr> </table>
Переопределение дизайна для конкретной страницы
Если на сайте требуется сверстать страницу в новом дизайне, например, страницу-лендинг, вы можете воспользоваться опцией переопределения дизайна для конкретной страницы.
Zeta Web 2.x
Для этого на вкладке Основные установите нужный дизайн в поле Дизайн и нажмите кнопку Записать.
Zeta Web 3.x
На вкладке Разобрать установите нужный дизайн в поле Дизайн и нажмите кнопку Записать.
См более подробную информацию о дизайне.
Переопределение содержимого области дизайна для конкретной страницы
Для каждой страницы можно переопределить значение области дизайна, например, шапки, а также, очистить значение области. Для этого в дереве отображения значений областей измените / очистите значение html-контейнера и/или стиль.
