124
1С-Битрикс: Управление сайтом Учебный курс «Интеграция»

Integration course

Embed Size (px)

Citation preview

Page 1: Integration course

1С-Битрикс: Управление сайтом Учебный курс «Интеграция»

Page 2: Integration course

2

Содержание: Описание курса ............................................................................................................5

Возможности системы ................................................................................................6

Структура продукта ............................................................................................................... 6

Шаблоны и сайты .................................................................................................................. 9

Использование визуальных компонентов .......................................................................... 11

Включаемые области .......................................................................................................... 14

Управление структурой проекта .............................................................................17

Структура сайта................................................................................................................... 17

Свойства страниц и разделов сайта .................................................................................. 22

Создание свойств страниц и разделов ........................................................................... 22

Управление значениями свойств страницы ................................................................... 23

Управление значениями свойств раздела ..................................................................... 26

Управление шаблоном дизайна сайта ...................................................................29

Шаблон дизайна .................................................................................................................. 29

Управление шаблоном дизайна ......................................................................................... 30

Редактирование шаблона ............................................................................................... 32

Экспорт шаблона ............................................................................................................. 33

Импорт шаблонов ............................................................................................................ 33

Создание шаблона .......................................................................................................... 34

Разработка шаблона дизайна ............................................................................................ 35

Разработка прототипа шаблона дизайна ....................................................................... 35

Создание полнофункционального шаблона дизайна .................................................... 36

Разработка шаблонов страниц ........................................................................................... 37

Использование файлов языковых сообщений .................................................................. 39

Управление служебными данными шаблона .......................................................40

Редактирование служебных областей ............................................................................... 40

Управление кодировкой страниц ........................................................................................ 41

Использование кодировок ............................................................................................... 41

Определение текущей кодировки ................................................................................... 46

Управление метаданными .................................................................................................. 46

Управление значениями метаданных через визуальный интерфейс ........................... 46

Управление метаданными в коде ................................................................................... 48

Управление заголовком документа .................................................................................... 49

Использование заголовка ............................................................................................... 49

Управление заголовком через визуальный интерфейс ................................................. 52

Page 3: Integration course

3

Управление заголовком в коде ....................................................................................... 56

Управление стилями ........................................................................................................... 57

Использование таблиц каскадных стилей ...................................................................... 57

Работа со стилями в визуальном HTML-редакторе ....................................................... 60

Пример таблицы стилей для шаблона сайта ................................................................. 62

Механизм реализации ..................................................................................................... 63

Подключение административной панели .......................................................................... 63

Подключение административной панели ....................................................................... 64

Добавление кнопок в административную панель .......................................................... 64

Файлы языковых сообщений ..................................................................................66

Использование файлов языковых сообщений .................................................................. 66

Механизм реализации......................................................................................................... 67

Локализация ........................................................................................................................ 68

Средства навигации ..................................................................................................72

Управление меню ................................................................................................................ 72

Типы меню ....................................................................................................................... 72

Построение и показ меню................................................................................................ 73

Управление меню ............................................................................................................ 79

Цепочка навигации .............................................................................................................. 83

Управление пунктами навигационной цепочки .............................................................. 83

Управление показом цепочки .......................................................................................... 87

Управление шаблоном навигационной цепочки ............................................................ 89

Включаемые области ................................................................................................92

Использование включаемых областей .............................................................................. 92

Управление включаемыми областями ............................................................................... 93

Размещение включаемой области ................................................................................. 94

Создание и редактирование включаемой области ........................................................ 94

Рекламные области ...................................................................................................98

Как это выглядит ................................................................................................................. 98

Типы рекламы...................................................................................................................... 99

Управление показом рекламы с помощью ключевых слов ............................................. 100

Визуальные компоненты ....................................................................................... 104

Использование компонентов ............................................................................................ 104

Подключение визуальных компонентов ........................................................................... 109

Структура компонентов ..................................................................................................... 111

Кастомизация компонентов .............................................................................................. 112

Page 4: Integration course

4

Пример работы с компонентами (организация показа новостей на сайте) ................... 112

Права доступа .......................................................................................................... 116

Использование прав доступа............................................................................................ 116

Оптимизация сайта .................................................................................................. 118

Оптимизация сайта под поисковые системы ................................................................... 118

Page 5: Integration course

5

Описание курса Данный курс предназначен для разработчиков веб-сайтов на основе программного продукта «1C-Битрикс: Управление сайтом». В курсе подробно рассмотрены следующие вопросы:

• управление шаблоном дизайна сайта;

• работа с включаемыми и рекламными областями;

• управление структурой сайта;

• управление средствами навигации по сайту: меню и цепочкой навигации;

• основные принципы локализации продукта;

• работа с визуальными компонентами;

• оптимизация сайта.

В данном курсе подразумевается, что разработчик владеет базовыми технологиями для разработки веб-сайта, такими как HTML, CSS, PHP.

По итогам курса разработчик получит знания необходимые для разработки сайта на базе продукта «1C-Битрикс: Управление сайтом», а также выполнения интеграции существующего сайта с системой.

Page 6: Integration course

6

Возможности системы Данный раздел содержит информацию о структуре, функциях и возможностях системы «1C-Битрикс: Управление сайтом». Эта информация поможет вам понять общую логику работы продукта, а также основные принципы интеграции сайта с системой.

Структура продукта Система «1C-Битрикс: Управление сайтом» поддерживает четыре режима работы. Три из них - это режимы работы в публичном разделе сайта, а четвертый - в административном разделе. Режимы различаются по своему назначению и набору предлагаемых инструментов управления.

Административный раздел: в этом разделе выполняется управление общими параметрами системы, создание и настройка сайтов, добавление контента и другие подобные операции.

Публичный раздел: в данном разделе выполняется отображение страниц и информационных материалов посетителям сайта:

• режим Просмотр служит не только для просмотра страниц, но и для выполнения типовых операций по сайту (создание и редактирование страниц, разделов; редактирование меню и др.).

Page 7: Integration course

7

• режим Редактирование содержит более расширенный набор действий и операций по сайту (управление доступом, работа с документооборотом, добавление элемента в инфоблок и др.). Режим предназначен для использования редакторами сайта.

• режим Разработка включает все действия, доступные на закладках Просмотр и Редактирование, и содержит дополнительные возможности (управление компонентами, стилями шаблона сайта, запрос отладочной информации). Режим предназначен для разработчиков.

Page 8: Integration course

8

Система «1C-Битрикс: Управление сайтом» состоит из отдельных модулей, каждый из которых отвечает за управление некоторыми данными и выполнение определенных операций. Количество модулей определяется редакцией продукта и используемой лицензией. Более подробная информация по функциональным возможностям модулей системы приведена в документации продукта.

Файловая структура системы «1C-Битрикс: Управление сайтом» организована таким образом, чтобы программные компоненты ядра продукта были отделены от пользовательских файлов, а также файлов, определяющих внешнее представление сайта. Данная особенность позволяет:

• избежать нежелательной модификации ядра продукта при работе с файлами системы;

• исключить возможность изменение публичной части сайта при загрузке обновлений продукта.

Основная программная часть инсталлированного продукта размещается в папке /bitrix/ корневого каталога сайта. Ниже приводится структура данной папки с описанием назначения вложенных каталогов и файлов.

• /bitrix/templates/ - в данном каталоге хранятся шаблоны внешнего вида (дизайна) сайта. Также здесь хранятся индивидуальные визуальные компоненты шаблонов (т.е. компоненты, специально созданные или настроенные для использования с определенным шаблоном дизайна). Основная работа по интеграции существующего дизайна и продукта производится с файлами, находящимися в этой директории.

• /bitrix/admin/ - в данной директории размещаются файлы, относящиеся к интерфейсу административной раздела. В т.ч. здесь хранятся файлы вызова различных форм управления и редактирования, используемых для всех основных

Page 9: Integration course

9

модулей системы (например, форма создания или редактирования пользователя сайта).

• /bitrix/cache/, /bitrix/managed_cache/, /bitrix/stack_cache/ - эти директории предназначены для хранения закешированных страниц, созданных в процессе кеширования динамической информации, прав доступа, курсов валют.

• /bitrix/components/ - директория предназначена для централизованного хранения компонентов 2.0. При этом в подпапке /bitrix/components/bitrix/ хранятся системные компоненты 2.0. В остальных подпапках - пользовательские.

• /bitrix/php_interface/ - дополнительные системные файлы (информация для подключения к базе данных, некоторые другие файлы).

• /bitrix/modules/ - программное ядро системы. В общем случае данная папка содержит библиотеки классов, функций и наборы языковых сообщений для основных модулей системы.

• /bitrix/images/ - картинки, отображаемые на страницах модулей системы.

• /bitrix/tools/ - служебные файлы.

• /bitrix/updates/ - директория, используемая для загрузки обновлений.

• /bitrix/wizards/ - системные (в пространстве имен bitrix) и пользовательские мастера. Системные мастера обновляются системой обновлений и не могут изменяться пользователем.

• /bitrix/ - дополнительные служебные файлы.

Шаблоны и сайты

Одной из главных особенностей системы «1C-Битрикс: Управление сайтом» является поддержка многосайтовости. Это означает, что вы можете создавать произвольное количество сайтов и осуществлять управление ими, используя одну копию продукта.

Количество сайтов в системе ограничивается только условиями лицензионного соглашения. В рамках лицензионного соглашения на основе одного экземпляра продукта можно создать два сайта (с использованием одной копии базы данных). Для создания дополнительных сайтов (т.е. для создания трех и более сайтов на основе одного экземпляра продукта), необходимо приобрести лицензию на дополнительные сайты.

Каждый сайт, работающий под управлением системы, может характеризоваться собственным доменным именем, внешним видом, языком интерфейса и информационным содержанием (контентом).

Внешний вид сайта определяется шаблоном дизайна.

Page 10: Integration course

10

Шаблон дизайна - это внешний вид сайта, в котором определяется расположение различных элементов на сайте, художественный стиль и способ отображения страниц. Включает в себя программный html-код, графические элементы, таблицы стилей, дополнительные файлы для отображения контента. Может так же включать в себя шаблоны компонентов, шаблоны готовых страниц и сниппеты.

Использование шаблонов позволяет проводить гибкую настройку дизайна сайтов, разделов и страниц сайта. Например, возможно использование специального праздничного дизайна в течение указанного периода времени, автоматическое управление внешним видом сайта в зависимости от группы посетителей и т.д.

Условия применения того или иного шаблона дизайна задаются в административном разделе (Настройки > Настройки продукта > Сайты > Список сайтов) отдельно для каждого сайта в форме его редактирования:

Внимание! При настройке условий применения шаблонов обязательно указывайте индекс сортировки. Порядок применения шаблонов к сайту определяется в соответствии с указанной сортировкой. Если для страницы (раздела) может быть применено несколько

Page 11: Integration course

11

шаблонов, то в итоге будет применен шаблон с большей сортировкой. Если индекс сортировки задан не будет, то может быть применен неверный шаблон.

Использование визуальных компонентов Продукт «1C-Битрикс: Управление сайтом» позволяет управлять контентом сайта через интуитивно понятный визуальный интерфейс. Данная возможность реализуется путем использования визуальных компонентов на страницах и в шаблонах дизайна сайта.

Визуальные компоненты представляют собой логически завершенный программный код, выполняющий операции с данными отдельных модулей системы. Практически любой программный код может быть представлен в виде компонента.

Начиная с версии 6.0, для использования доступны компоненты новой версии 2.0. Отличие компонентов версии 2.0 от первой версии состоит в том, что в них разделены логика и представление. Для одной логики может быть создано несколько представлений, в том числе зависящих от шаблона текущего сайта. Нет необходимости изменять логику компонента для изменения особенностей его показа. Поэтому управлять внешним видом информации, выводимой компонентом, стало значительно проще, т.к. для этого разбираться в логике компонента совсем не обязательно. Шаблон вывода существенно проще, чем компонент в целом. Логика - это сам компонент, представление - это шаблон вывода компонента.

Визуальные компоненты могут быть использованы в следующих целях:

• для создания полнофункциональных разделов на сайте, например, новостного раздела, фотогалереи, каталога товаров и т.д. Такие разделы создаются с помощью комплексных компонентов;

• для создания часто используемых областей в шаблоне или на страницах сайта (например, формы авторизации, формы подписки);

• для представления динамически обновляемой информации (например, ленты новостей, случайного фото);

• для выполнения любых других операций с данными.

Page 12: Integration course

12

Использование визуальных компонентов позволяет избавить пользователей системы, не обладающих специальными знаниями в области web-программирования, от необходимости работы непосредственно с программным кодом.

Все компоненты расположены в панели Компоненты 2.0 и сгруппированы по разделам, аналогичными пунктам административного меню.

Для быстрого добавления компонентов на страницы сайта разработан специальный интерфейс на базе визуального HTML-редактора. Каждый визуальный компонент представляется в виде графического изображения. Для добавления какого-либо компонента на страницу, нужно выбрать изображение данного компонента и переместить его в рабочую область страницы.

Page 13: Integration course

13

При установке курсора на значок компонента, размещенный в рабочей области страницы, в нижней части экрана будет выведен список параметров, доступных для данного компонента. Кроме того, параметры компонента могут быть настроены непосредственно в

режиме редактирования исходного кода страницы: кнопка на панели инструментов визуального HTML-редактора.

Управляя параметрами компонента, можно легко настроить его на выполнение требуемых операций.

Page 14: Integration course

14

В рабочую область страницы также может быть добавлен произвольный PHP-код, который в режиме визуального редактирования будет отображаться в виде значка . Если установить курсор на этот значок, то в панели Свойства отобразится непосредственно сам код.

Возможность использования программного кода в рабочей области страницы позволяет разместить практически любой PHP-код без ущерба для визуального режима редактирования содержимого страницы.

Каждый визуальный компонент может быть настроен (кастомизирован) под требования конкретного сайта. Например, можно изменить размер и форму кнопок, используемых в компоненте, форматировать шрифт, изменить цвет фона в соответствии с общим дизайном сайта, а также логику работы компонента.

Администратор системы также может создавать собственные визуальные компоненты.

Включаемые области Включаемые области – это области в шаблоне дизайна или страницы сайта для представления графической, текстовой и любой другой информации с возможностью доступа к быстрому редактированию данной информации из публичной части.

Page 15: Integration course

15

В системе поддерживается два вида включаемых областей:

• Включаемые области в шаблоне сайта. Например, в виде редактируемой области могут быть выполнены области с указанием авторских прав, графические ссылки, контактная информация, логотип компании и т.п.

• Включаемые области для страниц сайта. Данные включаемые области служат для размещения на страницах сайта справочной информации, различных форм (подписки, голосования, опросов), новостей и любой другой статической или динамической информации.

Место размещения включаемых областей определяется шаблоном сайта. В демонстрационных шаблонах приведены примеры создания включаемых областей как

Page 16: Integration course

16

для одной конкретной страницы раздела или сайта (включаемая область страницы), так и для всех страниц определенного раздела сайта (включаемая область раздела).

Cистема позволяет настраивать собственные условия, в соответствии в которыми включаемые области будут отображаться на страницах сайта. Для этого нужно выполнить соответствующие изменения в коде шаблона. Например, можно создать включаемую область только для определенных страниц или отображаемую только по определенным дням и т.д.

Для выделения всех включаемых областей текущей страницы в публичном разделе

необходимо перейти на закладку , расположенную на административной панели. Каждая включаемая область выделяется в виде отдельного блока, в верхнем левом углу которого расположены кнопки для перехода к редактированию данной области.

Page 17: Integration course

17

Управление структурой проекта Информация данного раздела дает представление о структуре сайта, работающего под управлением системы «1C-Битрикс: Управление сайтом», инструментах управления страницами и разделами веб-проекта, а также их свойствами.

Структура сайта Сайт представляет собой совокупность разделов и страниц с размещенной на них информацией. По сути, раздел сайта - это каталог (папка), обладающий определенными свойствами и содержащий файлы, относящиеся к данному разделу (страницы, изображения, включаемые области).

Управление разделами и страницам сайта выполняется через административный раздел в модуле «Управление структурой» с помощью менеджера файлов: Контент > Структура сайта.

Менеджер файлов позволяет:

• создавать, редактировать, копировать и удалять папки и страницы сайта;

• выполнять загрузку файлов с локального компьютера;

• управлять доступом пользователей к страницам и разделам (папкам) сайта (см. также руководство Управление правами доступа);

• управлять свойствами разделов (папок) сайта;

• создавать и управлять навигационным меню раздела.

Перейти к созданию и редактированию папок и страниц сайта можно также из публичного раздела сайта с помощью соответствующих кнопок на административной панели:

Page 18: Integration course

18

• Создание новой страницы или раздела в текущем разделе сайта;

• Редактирование текущей страницы и изменение свойств страницы или раздела.

Дополнительную информацию об административной панели читайте в разделе Подключение административной панели данного курса. Описание интерфейса панели представлено в учебном курсе «Элементы управления».

Страницы сайта могут содержать информацию статического и динамического характера:

• Статическая информация – это информация, которая остается неизменной с течением времени. Например, история компании, контактная информация, инструкции и т.п. Статическая информация создается, редактируется, дополняется и удаляется пользователем, обладающим правом на редактирование страниц сайта.

Page 19: Integration course

19

• Динамическая информация размещается в теле страницы с использованием визуальных компонентов. Примером динамической информации может служить лента последних новостей компании, каталог товаров или услуг, фотогалерея, случайное фото и многое другое.

Для быстрой навигации по разделам и страницам, ссылки на них могут быть добавлены в меню сайта:

• ссылки на основные разделы и главную страницу сайта обычно добавляются в основное меню сайта (например, верхнее меню):

• ссылки на подразделы и документы раздела обычно помещаются во второстепенное меню сайта (например, левое меню):

Примечание: ссылка на страницу может быть добавлена в меню следующим образом:

• При создании страницы из публичного раздела с помощью мастера.

Page 20: Integration course

20

• При создании страницы административном разделе с помощью визуального HTML-редактора. Создание пункта меню выполняется на закладке Меню.

Ссылка на раздел может быть добавлена в меню вышележащего раздела:

• При создании раздела из публичного раздела с помощью мастера.

Page 21: Integration course

21

• При создании раздела административном разделе с помощью менеджера файлов.

Аналогичные действия (добавление ссылки на раздел или страницу сайта) также могут быть выполнены в режиме редактирования меню как из публичного раздела, так и из административного.

Page 22: Integration course

22

Свойства страниц и разделов сайта Предлагаемая в продукте возможность задавать свойства страниц и разделов позволяет организовать гибкое управление показом информации на сайте. Управляя значениями свойств страниц сайта, можно:

• устанавливать значения метаданных для различных страниц;

• организовать смену графических элементов дизайна в зависимости от раздела сайта или отдельной страницы;

• управлять показом рекламы;

• и т.д.

Создание свойств страниц и разделов Набор свойств страниц и разделов задается в секции Типы свойств на странице настроек модуля Управление структурой: Настройки > Настройки продукта > Настройки модулей > Управление структурой.

Здесь вы можете:

• создавать новые свойства страниц (разделов);

• удалять уже используемые свойства;

• изменять типы и названия свойств.

Примечание: набор свойств страниц и разделов может быть задан отдельно для каждого сайта, работающего под управлением системы:

Page 23: Integration course

23

В продукте зарезервировано несколько типов свойств, значения которых проверяются и используются некоторыми функциями:

• title - используется для установки дополнительного заголовка страницы;

• adv_desired_target_keywords - используется для установки желательных (desired) ключевых слов для показа рекламы на странице;

• not_show_nav_chain - используется для выключения показа навигационной цепочки на странице или в разделе сайта.

Типы свойств предназначены для использования значений свойств в коде продукта (указываются только латинскими буквами). Изменять типы зарезервированных свойств настоятельно не рекомендуется, т.к. их значения уже могут использоваться в коде продукта.

Названия свойств используются для удобства управления значениями свойств через пользовательский интерфейс.

Управление значениями свойств страницы Задание и изменение значений свойств страницы может выполняться с помощью специальных форм, включенных в интерфейс публичного и административного разделов, а также в коде страницы.

Управление свойствами из административного раздела

Если вы находитесь в административном разделе, то способ задания свойств страницы определяется выбором режима редактирования самой страницы:

Page 24: Integration course

24

• при использовании текстового редактора форма задания и изменения свойств страницы имеет следующий вид:

• в режиме визуального HTML-редактора свойства страницы задаются на закладке Свойства:

• свойства могут быть заданы непосредственно в коде страницы с помощью функции SetPageProperty():

< ? … $APPLICATION->SetPageProperty("keywords", "Сайт, управление сайтом, система управления");

Page 25: Integration course

25

$APPLICATION->SetPageProperty("description", "«1C-Битрикс: Управление сайтом» - система разработки и управление web-проектами"); $APPLICATION->SetPageProperty("NOT_SHOW_NAV_CHAIN", "Y"); … ?>

Кнопка Еще, расположенная в форме редактирования страницы, добавляет пустую строку для создания нового свойства текущей страницы.

Управление свойствами из публичного раздела

В публичном разделе сайта задание свойств для создаваемой страницы выполняется в процессе работы Мастера создания страницы:

Для редактирования свойств существующей страницы необходимо воспользоваться пунктом Свойства страницы меню команд кнопки Изменить, расположенной на административной панели:

Page 26: Integration course

26

Откроется специальная форма для редактирования свойств страницы:

Управление значениями свойств раздела Управление свойствами раздела выполняется в форме настройки свойств соответствующей папки. Перейти к данной форме можно одним из следующих способов:

• из административного раздела:

Контент > Структура сайта > Нужный раздел. Далее с помощью кнопки на контекстной панели Свойства папки вызовите окно свойств.

Page 27: Integration course

27

В результате будет открыта форма управления свойствами текущей папки.

• из публичного раздела сайта с помощью пункта Свойства радела меню команд кнопки Изменить, расположенной на административной панели:

В результате будет открыта форма настройки свойств папки текущего раздела.

Page 28: Integration course

28

Значения свойств раздела, заданные в форме Свойства папки, будут использованы для всех страниц соответствующего раздела сайта, если для них не заданы собственные значение этих свойств.

Набор свойств для конкретного раздела может быть расширен с помощью пустых полей формы Свойства папки.

Примечание: настройка свойств раздела также может быть выполнена в коде файла .section.php:

< ? … $APPLICATION->SetDirProperty("keywords", "дизайн, веб, сайт"); … ?>

Page 29: Integration course

29

Управление шаблоном дизайна сайта Информация данного раздела дает представление о структуре, технологии создания и использования шаблонов дизайна сайта. Также в этом разделе описывается возможность использования шаблонов для рабочей и редактируемых областей страницы сайта.

Шаблон дизайна Шаблон дизайна сайта состоит из набора PHP файлов и файлов каскадных стилей (<имя_файла>.css) и служит для управления представлением публичной части сайта. Шаблон сайта определяет:

• оформление сайта (дизайн, верстку страниц, набор основных каскадных стилей);

• типы меню и их расположение;

• наличие рекламных областей (областей для размещения баннеров);

• наличие включаемых областей в шаблоне и страницах сайта;

• наличие в дизайне сайта формы авторизации, оформления подписки и т.д.

Все используемые в системе шаблоны хранятся в отдельных папках каталога /bitrix/templates/ (например, /bitrix/templates/demo/ или /bitrix/templates/template1/).

Шаблон дизайна сайта обычно состоит из трех основных частей:

• Верхней части дизайна (header);

• Рабочей области страницы (Work area);

Page 30: Integration course

30

• Нижней части дизайна (footer).

Header - верхняя часть дизайна, заголовок. Включает в себя, как правило, верхнюю и левую часть дизайна со статической информацией (логотипом, лозунгом и так далее), верхним горизонтальным меню и левым меню (если они есть в дизайне). Может включать в себя информационные динамические материалы. Хранится в отдельном файле .../<идентификатор_шаблона>/header.php.

Work area - рабочая область страницы, в которой размещаются собственно информационные материалы сайта. Рабочая область - это все создаваемые пользователями документы, хранящиеся в файлах <имя_документа>.php в соответствующих папках сайта.

Footer - нижняя часть дизайна со статической информацией (как правило: контактная информация, сведения об авторе и владельце сайта и так далее), нижним горизонтальным меню и правым меню (если они есть в дизайне). Может включать в себя информационные материалы. Хранится в отдельном файле .../<идентификатор_шаблона>/footer.php.

Сборка типовых страниц сайта выполняется путем подключением верхней и нижней частей дизайна для каждой страницы сайта. В общем случае структура страницы сайта выглядит так:

<? require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php"); $APPLICATION->SetTitle("1C-Битрикс: Управление сайтом"); ?> Тело документа. Содержательная часть. <? require($_SERVER["DOCUMENT_ROOT"]."/bitrix/footer.php"); ?>

Управление шаблоном дизайна

Все шаблоны для системы «1C-Битрикс: Управление сайтом» могут быть загружены в формате <имя_файла>.tar.gz. Также шаблон дизайна может быть добавлен путем копирования папки шаблона в систему.

Управление шаблонами дизайна осуществляется в административном разделе: Настройки > Настройки продукта > Сайты > Шаблоны сайтов.

Page 31: Integration course

31

В указанном разделе вы можете выполнить следующие операции:

• Отредактировать существующий шаблон;

• Создать новый;

• Импортировать шаблон;

• Экспортировать шаблон.

Для наглядного представления шаблона в списке может использоваться его скриншот. Скриншот размещается в папке соответствующего шаблона в файле с именем screen.gif (например, /bitrix/templates/books/screen.gif).

Page 32: Integration course

32

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

Есть возможность редактировать шаблон дизайна как с использованием визуального редактора, так и работая с исходным кодом. Возможность визуального редактирования шаблона определяется настройками Главного модуля.

При отмеченной опции в форме редактирования шаблона будет присутствовать опция Использовать визуальный редактор.

Page 33: Integration course

33

Внимание! Редактирование шаблона дизайна сайта в визуальном режиме будет происходить корректно, если в атрибутах HTML-тегов не содержится php-код, а также, если, например строки и ячейки таблицы не прерываются php-кодом при формировании таблицы. Если в коде шаблона дизайна сайта есть такие особенности, то редактировать его следует только в режиме кода.

При редактировании шаблона в визуальном редакторе отображаются объединенные верхняя и нижняя части дизайна сайта. В HTML-код вставляются компоненты и функции на языке программирования PHP, которые обеспечивают показ различного рода информации: метаданных, заголовка страницы, таблицы каскадных стилей, административной панели и последующее управление этой информацией с использованием визуальных инструментов.

Обратите внимание на наличие в коде шаблона разделителя #WORK_AREA#, который используется для указания границы между верхней и нижней частью дизайна. В этом месте будет выполняться подключение рабочей области страницы сайта. В визуальном

режиме редактирования шаблона рабочая область обозначается . Сохранение шаблона без этого разделителя невозможно.

Экспорт шаблона С помощью интерфейса системы используемый на сайта шаблон может быть выгружен в файл формата <имя_шаблона>.tar.gz. Для выгрузки шаблона служит пункт контекстного меню Скачать.

Импорт шаблонов Готовый шаблон можно экспортировать в виде комплекта файлов с помощью менеджера файлов либо с помощью специального интерфейса системы. На странице со списком шаблонов имеется специальная кнопка контекстной панели Загрузить шаблон.

Page 34: Integration course

34

При нажатии на кнопку открывается форма:

После загрузки файлы шаблона будут автоматически распакованы и размещены в директории /bitrix/templates/<идентификатор_шаблона>/.

Создание шаблона Шаблон дизайна сайта может быть создан непосредственно в системе с помощью формы Новый шаблон, для перехода к которой служит кнопка Добавить шаблон, расположенная на контекстной панели.

Page 35: Integration course

35

При создании нового шаблона через интерфейс задается:

• его идентификатор;

• название;

• описание для показа в списке;

• код шаблона внешнего вида сайта;

• таблица стилей;

• набор используемых включаемых компонентов и картинок.

При сохранении шаблона автоматически создается поддиректория /bitrix/templates/<идентификатор_шаблона>.

Все графические элементы, используемые в шаблоне, рекомендуется размещать в директории /bitrix/templates/<идентификатор_шаблона>/images/.

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

Разработка шаблона дизайна

Процесс создания шаблона сайта включает два основных этапа:

• создание прототипа шаблона дизайна;

• создание полнофункционального шаблона.

Разработка прототипа шаблона дизайна Прототип представляет собой сверстанный в html шаблон дизайн сайта. При верстке в шаблоне выделяются функциональные области, например:

Page 36: Integration course

36

• заголовок страницы;

• меню;

• цепочка навигации;

• форма авторизации;

• форма поиска;

• включаемые области и файлы;

• рекламные области;

• и т.д.

Создание полнофункционального шаблона дизайна На данном этапе выполняется замена HTML элементов дизайна на соответствующие функциональные элементы: программный код и вызовы компонентов.

Page 37: Integration course

37

Разработка шаблонов страниц

Система «1C-Битрикс: Управление сайтом» позволяет создавать и использовать шаблоны-заготовки для рабочей и включаемых областей страницы сайта. Использование шаблонов-заготовок особенно полезно и эффективно в тех случаях, когда страницы сайта имеют довольно сложную структуру (верстку).

Page 38: Integration course

38

Шаблоны страниц и редактируемых областей хранятся в папке /page_templates/, находящейся в каталоге соответствующего шаблона сайта или в папке .default, если предполагается использование одинаковых шаблонов страниц для всех шаблонов сайта.

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

Page 39: Integration course

39

Список доступных шаблонов страниц и редактируемых областей создается с помощью файла .content.php, также размещаемого в папке /page_templates/ соответствующего шаблона сайта. Данный файл содержит массив соответствий файлов шаблонов страниц и включаемых областей и их названий для представления в списке.

<? if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die(); $TEMPLATE["standard.php"] = Array("name"=>"Стандартная страница", "sort"=>1); $TEMPLATE["page_inc.php"] = Array("name"=""Включаемая область страницы", "sort"=>2); $TEMPLATE["sect_inc.php"] = Array("name"=>"Включаемая область раздела", "sort"=>3); ?>

Дополнительно задаются значения сортировки названий шаблонов страниц в выпадающем списке.

Использование файлов языковых сообщений Система «1C-Битрикс: Управление сайтом» позволяет использовать один и тот же шаблон дизайна для нескольких сайтов на разных языках. Данная возможность реализуется с помощью механизма языковых сообщений:

• в HTML верстке шаблона определяются области, в которых должен отображаться тот или иной текст;

• затем в выделенные области вместо текстовых сообщений подставляется код, выполняющий подключение и показ соответствующих языковых сообщений на нужном языке.

Описание механизма использования языковых сообщений приводится в разделе Файлы языковых сообщений.

Page 40: Integration course

40

Управление служебными данными шаблона

Редактирование служебных областей Если для создания (редактирования) шаблона вы используете визуальный редактор, то управление служебными областями можно выполнить в специальной форме. Переход к этой форме осуществляется с помощью кнопки Редактировать служебные области шаблона, расположенной в панели редактора.

Форма редактирования областей состоит из двух закладок: Верхняя часть и Нижняя часть.

На первой закладке выполняется редактирования верхней части шаблона до тега <body>. Вы можете задать содержимое области значениями по умолчанию. Для этого нажмите на кнопку и в форму будут вставлен набор стандартных функций, таких как установка кодировки страниц, вывод заголовка и метаданных страницы, подключение файлов стилей и др. Аналогично, на закладке Нижняя часть выполняется редактирования нижней части шаблона, содержимое которой также может быть задано значениями по умолчанию.

Page 41: Integration course

41

Внимание! Использование функций ShowMeta(), ShowTitle(), ShowCSS() и т.д. позволяет производить инициализацию отдельных элементов непосредственно из скрипта на странице или из компонента. Например, заголовок страницы может быть добавлен уже после вывода результатов работы скрипта. Таким образом, если ранее требовалось производить инициализацию заголовка страницы до подключения основного дизайна, то сейчас можно производить установку заголовка страницы непосредственно из кода в рабочей области страницы.

Управление кодировкой страниц Данный раздел содержит информацию по использованию кодировок для корректного отображения информации на страницах сайта. После изучения раздела вы получите представление об основных принципах использования, а также способах настройки и подключения различных кодировок.

Использование кодировок Одной из важных особенностей продукта «1C-Битрикс: Управление сайтом» является поддержка произвольного количества языков. Система позволяет:

• использовать многоязычный интерфейс в административном разделе;

Page 42: Integration course

42

• создавать произвольное количество сайтов * на различных языках в рамках одной системы;

Page 43: Integration course

43

* - количество сайтов ограничено вашей лицензией.

Примечание: количество используемых в системе языков не зависит от количества сайтов.

Для корректного отображения национальных символов используются соответствующие кодировки. При показе страницы браузер распознает используемую кодировку и на ее основе выполняет отображение символов.

Ниже приводится список таблиц кодов, используемых для отображения символов русского, английского и немецкого языков:

Полный список кодировок, используемых для различных языков, приводится в документации продукта.

Внимание! Начиная с версии 7.0, в продукте (для баз данных MySql и Oracle) поддерживается универсальная кодировка UTF-8. С ее помощью содержимое сайта может быть одновременно представлено на разных языках. Если данная кодировка не используется, но в системе необходимо сочетание разных языков, то для каждого языка нужно определить кодовую таблицу, с использованием которой будут отображаться текстовые сообщения.

Настройка кодировки выполняется отдельно для административного и публичного раздела:

Page 44: Integration course

44

Настройка кодировки, используемой в публичном разделе, выполняется для каждого сайта: Настройки > Настройки продукта > Сайты > Список сайтов. Кодировка задается исходя из языка, используемого на сайте. Также при настройке параметров языка можно задать формат времени и даты, что позволит правильно выводить эти данные в публичном разделе (например, при показе новостей, товаров каталога и т.д.).

Page 45: Integration course

45

Настройка кодировки для административного раздела сайта выполняется через форму управление параметрами языков, используемых в системе: Настройки > Настройки продукта > Языки интерфейса.

Также при настройке параметров языка можно определить формат времени и даты. Указанный формат будет использоваться при отображении даты и времени в административном разделе сайта.

Page 46: Integration course

46

Определение текущей кодировки Текущая кодировка, используемая в публичном разделе сайта, определяется с помощью php-константы LANG_CHARSET, подставленной в область заголовка шаблона сайта.

При применении шаблона к сайту запрашивается значение параметра кодировка, заданное в настройках сайта. Константе LANG_CHARSET присваивается значение, равное значению параметра кодировка.

Пример кода, с помощью которого выполняется установка кодировки страниц, приводится ниже:

< head > … < meta http-equiv="Content-Type" content="text/html; charset=< ?echo LANG_CHARSET? >" > … < head >

Управление метаданными

В данном разделе описываются основные инструменты и способы управления метаданными страниц и разделов, представленные в продукте «1C-Битрикс: Управление сайтом».

Управление значениями метаданных через визуальный интерфейс Как правило, основной целью использования метаданных является оптимизация сайта для поисковых систем. Поисковые системы используют метаданные для индексации документов сайта.

Примером управления метаданными в продукте может служить механизм задания ключевых слов и описаний для страниц и разделов сайта. По умолчанию в дистрибутиве

Page 47: Integration course

47

продукта настроено управление именно этими двумя типами метаданных (по аналогичной схеме список возможных вариантов может быть дополнен).

Для того чтобы иметь возможность управлять значениями метаданных, предварительно необходимо создать соответствующие свойства в настройках модуля "Управление структурой": Настройки > Настройки продукта > Настройки модулей >Управление структурой.

Важно! Названия типов свойств, используемых для управления метаданными страниц, должны совпадать с названиями мета-тегов в языке HTML. Например, типы свойств ключевые слова и описание должны совпадать именами (name) соответствующих мета-тегов: keywords и description.

Примечание: набор свойств может быть задан отдельно для каждого сайта, работающего под управлением системы.

Page 48: Integration course

48

Подробную информацию по настройке свойств страниц и разделов, а также по управлению значениями метаданных вы можете узнать в разделе Свойства страниц и разделов сайта.

Обратите внимание! Значения свойств, заданные для папки, по умолчанию будут использоваться для всех страниц и подразделов соответствующего раздела сайта (если для них не заданы собственные значения этих свойств).

Управление метаданными в коде Для вывода значений метаданных в коде страницы нужно воспользоваться функцией ShowMeta(), размещаемой в прологе шаблона дизайна сайта:

< head > … < ?$APPLICATION->ShowMeta("keywords")?> < ?$APPLICATION->ShowMeta("description")?> … </head>

Предположим, что для страницы заданы следующие значения свойств ключевые слова и описание:

C помощью функции SetPageProperty() значения данных свойств будут применены к странице:

Page 49: Integration course

49

< ? $APPLICATION->SetPageProperty("keywords", "веб, разработка, программирование"); $APPLICATION->SetPageProperty("description", "Система управления сайтом"); ?>

Тогда в результате работы функции ShowMeta() в код страницы будет подставлен следующий HTML-код:

<meta name="keywords" content=" веб, разработка, программирование "> <meta name="description" content=" Система управления сайтом ">

Если для самой страницы значение свойства не задано, то будет взято значение свойства вышестоящего раздела (рекурсивно до корня сайта). Если значение свойства не определено, то значение соответствующего мета-тэга останется не заданным. Свойства страницы могут быть установлены динамически из кода компонентов, расположенных на странице. Например, для страниц показа информации каталога или новостей свойства страницы могут быть установлены в соответствии с определенными свойствами элементов инфоблоков:

$APPLICATION->SetPageProperty( "description",$arIBlockElement["PROPERTIES"] [$META_DESCRIPTION]["VALUE"]);

В данном случае в качестве значения свойства страницы description будет использовано значение свойства элемента информационного блока с кодом meta_description. Таким образом, можно создавать свойства keywords и description для элементов каталога и динамически подставлять их в код страницы.

Управление заголовком документа Данный раздел содержит подробную информацию по настройке и управлению заголовком документов и окна веб-браузера с использованием средств системы.

Использование заголовка Использование заголовка помогает привлечь внимание пользователей к странице сайта, а также создать общее представление о ее содержании и назначении. Кроме того, для того чтобы пользователь мог безошибочно определить, в каком окне открыта интересующая его страница, рекомендуется задавать дополнительные заголовки страниц для отображения в качестве заголовка окна браузера:

• вывод заголовка документа в верхней части браузера:

Page 50: Integration course

50

• вывод заголовка документа в содержательной части документа:

Заголовки страниц также используются при индексации сайтов поисковыми машинами и отображаются в виде ссылок на соответствующие ресурсы сайта.

Система «1C-Битрикс: Управление сайтом» позволяет выполнять следующие операции с заголовком страницы:

Page 51: Integration course

51

• устанавливать одинаковый заголовок для страницы сайта и окна веб-браузера;

• задавать различные заголовки для страницы сайта и окна веб-браузера;

• устанавливать заголовок страницы и окна веб-браузера динамически, например, с использованием:

• названия текущего раздела каталога;

Page 52: Integration course

52

• названия текущего товара или новости;

• и т.д.

Управление заголовком через визуальный интерфейс Создание и изменение заголовка страницы, а также окна веб-браузера может быть выполнено как с помощью средств административного, так и публичного раздела.

Page 53: Integration course

53

Установка дополнительного заголовка окна веб-браузера осуществлятеся с помощью зарезервированого в продукте свойства title.

Для удобного использования свойства следует задать его название (например, Дополнительный заголовок (заголовок окна веб-браузера)) в настройках модуля Управление структурой.

Управление через административный раздел

Если вы находитесь в административном разделе, то способ задания заголовка страницы определяется выбором режима редактирования самой страницы:

• при использовании текстового редактора заголовок содержательной части страницы задается в поле Заголовок страницы, заголовок окна браузера - в свойстве Дополнительный заголовок (указывается в том случае, если он должен отличаться от основного заголовка страницы);

• при редактировании текущего документа в режиме визуального HTML-редактора:

• на закладке Редактирование в поле Заголовок страницы указывается заголовок текущего документа:

Page 54: Integration course

54

• заголовок окна браузера задается на закладке Свойства в поле Дополнительный заголовок:

• заголовок можно задать непосредственно в коде страницы при редактировании режиме Редактировать как PHP:

Page 55: Integration course

55

Примечание: управление свойствами папки позволяет установить дополнительный заголовок окна веб-браузера, который будет использоваться по-умолчанию для всех страниц соответствующего раздела, если для них не задан собственный заголовок окна веб-браузера.

Управление через публичный раздел

В публичном разделе сайта задание основного и дополнительного заголовка создаваемой страницы выполняется в процесссе работы Мастера создания страницы:

Page 56: Integration course

56

Для редактирования заголовков существующей страницы необходимо воспользоваться пунктом Свойства страницы меню команд кнопки Изменить, расположенной на административной панели:

Откроется специальная форма для редактирования свойств страницы:

Управление заголовком в коде Задание и показ заголовка страницы

Заголовок страницы может быть установлен следующими способами.

• При редактировании документа с помощью встроенного редактора (в режиме «Текст», «PHP» или «HTML»). В этом случае заголовок страницы задается путем подстановки в код документа следующей функции:

<? $APPLICATION-> SetTitle("О компании"); ?>

• Заголовок документа может устанавливаться динамически одним из компонентов, расположенным на странице. В приведенном ниже примере в качестве заголовка страницы используется имя текущего информационного блока:

Page 57: Integration course

57

<? $arIBlock = GetIBlock($ID, "news") $APPLICATION->SetTitle($arIBlock["NAME"]); … ?>

Вывод заголовка документа выполняется с помощью размещения функции ShowTitle() в месте показа заголовка страницы:

<H1><?$APPLICATION->ShowTitle()?></H1>

Если при выводе заголовка страницы функция ShowTitle() использует параметр false, это означает, что для установки заголовка страницы не нужно проверять значение свойства title.

<H1><?$APPLICATION->ShowTitle(false)?></H1>

Т.е. в качестве заголовка страницы будет использован заголовок, установленный функцией SetTitle().

Задание и показ заголовка окна веб-браузера

Вывод заголовка окна веб-браузера выполняется с помощью кода ShowTitle(), размещенного в области <head> шаблона дизайна сайта:

<head><title><?$APPLICATION->ShowTitle()?></title></head>

Заголовок окна веб-браузера может быть установлен с использованием различных механизмов. По умолчанию заголовок устанавливается в свойстве страницы title. Если значение данного свойства не указано, то заголовок окна браузера будет установлен равным текущему заголовку страницы.

Управление стилями

Информация данного раздела дает представление об основных целях и способах использование таблиц каскадных стилей (CSS) на сайте.

Использование таблиц каскадных стилей Таблицы стилей представляют собой совокупность правил, применяемых для оформления определенных элементов на страницах сайта. Технология каскадных стилей (CSS) позволяет хранить всю информацию о разметке страницы, используемых на ней шрифтах, цветах, стилях оформления меню и т.д. в определенном месте (одном или нескольких файлах).

Использование CSS упрощает задачу оформления и верстки страниц сайта. Кроме того, при изменении дизайна сайта или его отдельных элементов нет необходимости в

Page 58: Integration course

58

редактировании каждой страницы: достаточно просто изменить соответствующую таблицу стилей.

Так, например, можно изменить оформление форума (шрифт, цвет элементов и др.) В приведенном примере стили форума задаются отдельно от стилей общего шаблона сайта.

.forumborder {background-color:#CACBBD;}

.forumhead {background-color:#EAEBE2;}

.forumbody {background-color:#FBFBF9;}

.forumbodytext {font-family: Arial, Helvetica, sans-serif; font-size:smaller; color:#000000;} .forumheadtext {font-family: Arial, Helvetica, sans-serif; font-size:smaller; color:#000000;} .forumtitletext {font-family: Arial, Helvetica, sans-serif; font-size:smaller; color:#000000;} .postsep {background-color: #9C9A9C; height: 1px} .forumquote {font-family: Arial, Helvetica, sans-serif; font-size:8pt; color: #000000; background-color: #FBFBF9; border : 1px solid Black;padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; text-indent: 2pt;} .forumcode {font-family: Arial, Helvetica, sans-serif; font-size:8pt; color: #333333; background-color: #FBFBF9; border : 1px solid Black; padding-top: 2px; padding-right: 2px; padding-bottom: 2px; padding-left: 2px; text-indent: 2pt;} …

.forumborder {background-color:#96C0FA;}

.forumhead {background-color:#A9CAF7;}

.forumbody {background-color:#D7E6FB;}

.forumbodytext { font-family: Tahoma, Arial, Verdana, sans-serif; font-size: 80%; color:#042A69; } .forumheadtext { font-family: Tahoma, Arial, Verdana, sans-serif; font-size: 80%; color:#011B46;

Page 59: Integration course

59

Таблицы стилей настраиваются отдельно для каждого шаблона сайта, используемого в системе, и размещаются в папках соответствующих шаблонов сайта. Таблицы стилей для представления внутреннего содержания страниц сайта хранятся в файлах вида styles.css папки соответствующего шаблона. Дополнительные таблицы стилей, например, стили форума, могут иметь имена вида: forum.css.

Примечание: в продукте добавлен механизм, позволяющий осуществлять раздельное хранение стилей:

• стили, используемые в шаблоне дизайна, хранятся отдельно в файле template_styles.css.

• стили, используемые при оформлении контента страниц (стили сайта), хранятся в файле styles.css. Стили из этого файла выводятся в выпадающем списке стилей при редактировании страниц в визуальном редакторе.

Формирование таблицы стилей сайта (файл styles.css) выполняется на странице редактирования шаблона дизайна на закладке Стили сайта. Важным элементом при создании таблицы стилей страниц является создание названий стилей. Названия следует создавать только для тех стилей, которые планируется использовать при редактировании страниц в режиме визуального HTML-редактора (секция Описания стилей).

Page 60: Integration course

60

Стили будут доступны в визуальном редакторе из выпадающего списка под именами, определенными в данной форме. Заданные здесь названия будут храниться в файле <идентификатор_шаблона>/.styles.php (файл с именами стилей).

Создание таблицы стилей шаблона дизайна (файл template_styles.css) выполняется на закладке Стили шаблона формы редактирования шаблона сайта:

Работа со стилями в визуальном HTML-редакторе Важным элементом при формировании таблицы стилей является добавление названий стилей. Названия стилей могут быть добавлены непосредственно в файл .styles.php. Данный файл размещается в папке шаблона сайта и имеет следующий формат.

<? $arStyles = Array( "information-block-head" => "Заголовок инфоблока", "content-block-head" => "Заголовок с отступом", "information-block-body" => "Текст элементов инфоблока", "tablehead" => "Таблица - шапка", "tablebody" => "Таблица - тело", ); return $arStyles; ?>

Также названия стилей могут добавляться в форме редактирования шаблона на закладке Стили сайта. В этом случае файл .styles.php создается автоматически.

Page 61: Integration course

61

Названия стилей будут отображаться в визуальном редакторе в выпадающем списке.

Если в форме настроек модуля Управление структурой на закладке Визуальный редактор выбрать опцию Разрешить в визуальном HTML редакторе выводить стили без названий,

то в списке будут представлены все доступные для страницы стили, в том числе те, для которых не заданы названия:

Page 62: Integration course

62

Для обозначений стиля с неустановленным названием будет использоваться имя, заданное при создании стиля: information-block, content-block и т.д.

Также в таблице стилей могут быть созданы стили, применяемые к определенным html-элементам страницы (например, границам таблицы, ячейкам, рисункам и др.). При выделении данных элементов в списке будут выводиться доступные для них стили.

Пример таблицы стилей для шаблона сайта Стили для левого меню:

.leftmenu, .leftmenuact {font-family: Arial, Helvetica, sans-serif; font-size:12px; font-weight: bold; text-decoration: none;} .leftmenu {color: #3F3F3F;} .leftmenuact {color:#FF5235;}

Стили для верхнего меню:

.topmenu {font-family: Arial, Helvetica, sans-serif; font-size:12px; font-weight: bold; color: #FFFFFF; text-decoration: none;} .topmenuact {font-family: Arial, Helvetica, sans-serif; font-size:12px; font-weight: bold; color: #FAC535; text-decoration: none;}

Стили для таблиц:

.tableborder {background-color:#9C9A9C;}

.tablehead {background-color:#D8D9DA;}

.tablebody {background-color:#F8F8F8;}

Page 63: Integration course

63

.tablebodytext, .tableheadtext {font-family: Arial, Helvetica, sans-serif; font-size:12px;} .tablebodytext {color:#000000;} .tableheadtext {color:#000066;}

Механизм реализации Таблицы стилей подключаются к шаблону сайта в области пролога с помощью функции ShowCSS().

<? $APPLICATION->ShowCSS(); ?>

Функция ShowCSS() выполняет подключение файла стилей из текущего шаблона сайта, а также всех дополнительных стилей определенных для данной страницы функцией SetAdditionalCSS().

<? $APPLICATION->SetAdditionalCSS("/bitrix/templates/demo/additional.css"); ?>

Дополнительные стили могут использоваться, например, для оформления форума, веб-форм, таблиц, некоторых типов меню и т.д.

Обратите внимание! При использовании функции ShowCSS() без параметров подключение стилей будет выполнено в виде ссылки на CSS файл:

<LINK href="/bitrix/templates/demo/styles.css" type="text/css" rel="STYLESHEET">

При этом стили, подключаемые с использованием SetAdditionalCSS(), будут включены в код страницы с использованием PHP функции require() (т.е. будут полностью включены итоговый код страницы).

В случае использования функции ShowCSS() с параметром false файл стилей для текущего дизайна будет также включен в код страницы с использованием require():

<? $APPLICATION->ShowCSS(false); ?>

Подключение административной панели

Page 64: Integration course

64

Подключение административной панели После авторизации на сайте для пользователя с соответствующими правами становится доступна панель Административная панель в верхней части страницы. С ее помощью можно:

• управлять параметрами текущего раздела;

• перейти к редактированию текущей страницы и включаемых областей;

• добавить и изменить меню текущего раздела;

• настроить параметры компонентов;

• быстро перейти в административный раздел сайта;

• и многое другое.

Код для подключения административной панели задается в служебной области шаблона дизайна сайта сразу после тега <body> перед началом первой таблицы.

<? $APPLICATION->ShowPanel(); ?>

С подробным описанием интерфейса панели вы можете ознакомиться в Руководстве пользователя, а также с помощью учебного курса Элементы управления.

Добавление кнопок в административную панель Пользователь может самостоятельно добавить кнопки в административную панель. Например, добавим в панель кнопку Редактировать урок, которая отображается при просмотре учебного курса. Для этого выполните следующие действия:

• Создайте файл /bitrix/php_interface/include/add_top_panel.php;

• Добавьте следующий код и сохраните файл:

<? if (($APPLICATION->GetCurPage() == "/communication/learning/course/index.php") && $USER->IsAdmin()) //проверка адреса страницы и //принадлежности пользователя к группе администраторов

Page 65: Integration course

65

{ $main_sort = 100; //сортировка для группы кнопок $alt = "Редактировать урок"; //текст всплывающей подсказки $link = "Y"; //является ссылкой $href = "/bitrix/admin/learn_lesson_edit.php?lang=".LANGUAGE_ID."&ID=". $_GET["LESSON_ID"]."&COURSE_ID=".$_GET["COURSE_ID"]."&CHAPTER_ID=".$_GET["CHAPTER_ID"]; //ссылка на нужную страницу $src = "/bitrix/images/fileman/panel/edit_lesson.gif"; //картинка кнопки $APPLICATION->AddPanelButton(array("LINK"=>$link, "HREF"=>$href,"SRC"=>$src, "ALT"=>$alt, "MAIN_SORT"=>$main_sort, "SORT"=>200)); //добавление кнопки в панель } ?>

• Вызываемая в прологе страницы функция $APPLICATION->ShowPanel() производит проверку наличия указанного файла и выводит в панель описанные в нем кнопки.

С помощью данного кода в административную панель будет добавлена кнопка, которая будет отображаться только администраторам и только на странице просмотра курса.

При нажатии на кнопку будет осуществлен переход в административный раздел для редактирования просматриваемого урока.

Кроме того, для модуля Информационные блоки кнопки в панель добавляются с помощью функции CIblock::ShowPanel(). Количество кнопок может варьироваться, например, в зависимости от того выполняется ли вывод списка элементов информационного блока или детальный показ информации по одному элементу. Компоненты информационных блоков имеют специальную опцию, определяющую, добавлять или нет кнопки в административную панель.

Page 66: Integration course

66

Файлы языковых сообщений Данная глава содержит подробное описание механизма использования файлов языковых сообщений, с помощью которых реализуется многоязычный интерфейс системы.

Использование файлов языковых сообщений

Система «1C-Битрикс: Управление сайтом» позволяет использовать один и тот же шаблон дизайна для нескольких сайтов на разных языках. Данная возможность реализуется с помощью механизма языковых сообщений:

• в HTML верстке шаблона определяются области, в которых должен отображаться тот или иной текст;

• затем в выделенные области вместо текстовых сообщений подставляется код, выполняющий подключение и показ соответствующих языковых сообщений на нужном языке.

Например, с использованием языковых сообщений могут быть созданы заголовки таблиц, надписи на кнопках, сообщения компонентов и т.д.

Механизм языковых сообщений используется в том числе для поддержки многоязычного интерфейса административного раздела системы.

Page 67: Integration course

67

Механизм реализации

• В папке шаблона сайта создается папка с именем /lang/:

/bitrix/templates/< идентификатор шаблона >/lang/

• В папке /lang/ создаются папки с идентификаторами используемых языков: /en/, /de/, /ru/ и т.д. Например:

/bitrix/templates/<идентификатор шаблона>/lang/ru/

• В созданных папках размещаются соответствующие файлы языковых сообщений. Файлы языковых сообщений характеризуются следующими параметрами:

• Имя файла языковых сообщений соответствует имени файла, в котором выполняется его вызов. Например, если предполагается, что вызов файла с языковыми сообщениями будет выполняться в прологе шаблона сайта (файл header.php), то файл языковых сообщений должен быть сохранен с именем header.php;

• Список сообщений в файле хранится в следующем виде:

<? $MESS ['COMPANY_NAME'] = "Company Name"; $MESS ['MAIN_PAGE'] = "Home page"; $MESS ['PRINT'] = "Print version"; $MESS ['AUTH_LOGIN'] = "Authorization"; $MESS ['RATES_HEADER'] = "Currency rates"; $MESS ['SEARCH'] = "Site search"; $MESS ['SUBSCR'] = "Subscription"; ?>

• Затем в начало файла, для которого предусмотрено использование языковых сообщений (например, header.php), добавляется функция:

<? IncludeTemplateLangFile(__FILE__); ?>

Функция IncludeTemplateLangFile(__FILE__) выполняет подключение файла языковых сообщений для текущего языка.

Page 68: Integration course

68

• Далее все текстовые сообщения заменяются на функции вызова соответствующих языковых сообщений:

<font class="search"><?echo GetMessage("SEARCH");?></font>

В качестве параметра функции GetMessage() используется код подключаемого сообщения. Функция проверяет наличие в подключенном языковом файле сообщения с соответствующим кодом и отображает его пользователю.

Локализация Перевод языковых файлов может быть выполнен следующими способами:

• вручную, путем редактирования соответствующих файлов;

• с помощью модуля локализации.

Модуль Локализация предоставляет удобный интерфейс для поиска и перевода языковых сообщений и позволяет:

• просмотреть распределение языковых фраз (доступных для представления в одной кодировке) по файлам системы;

• определить количество непереведенных фраз для каждого файла;

• перейти к переводу необходимых текстовых сообщений.

Для того чтобы просмотреть распределения языковых сообщений по файлам, нужно перейти на страницу Перевод языковых файлов: Настройки > Локализация.

Красным цветом отмечается количество непереведенных фраз, используемых в файле или директории, для каждого языка. Для того чтобы выполнить перевод языковых фраз,

Page 69: Integration course

69

нужно выбрать файл, для которого используются языковые сообщения, и ввести перевод сообщения для нужного языка:

Примечание: в форме будут отображены языковые фразы для языков, доступных для представления в одной кодировке.

Перейти к форме выполнения перевода языковых сообщений можно также непосредственно со страницы, на которой эти сообщения используются (как в публичной, так и административной части сайта). Для этого в адресную строку страницы нужно добавить параметр show_lang_files=Y.

В результате внизу страницы будет отображен список языковых файлов, сообщения которых используются на данной странице.

Page 70: Integration course

70

Названия файлов представлены в виде ссылок, позволяющих перейти к редактированию языковых сообщений, представленных в данных файлах. Также внизу списка отображается поле, позволяющее выполнять поиск языковых фраз по точному совпадению.

Например, найдем языковое сообщение ссылки Новые, используемой на главной странице многопользовательской фотогалерии.

Для этого введем фразу Новые в поле для поиска.

В результате будет получен список файлов, содержащих искомую фразу.

Ссылка с текстом фразы позволяет перейти непосредственно к редактированию текста сообщения.

Page 71: Integration course

71

Примечание: при выполнении локализации на сайте все языковые сообщения могут быть собраны с помощью специального программного скрипта. Собранные языковые файлы могут быть помещены в систему обновления для скачивания другими пользователями.

Page 72: Integration course

72

Средства навигации

Управление меню В данном разделе приводятся основные принципы и правила создания и управления меню на сайте, в том числе описание файла данных и структуры шаблона меню. Также в разделе описывается возможность использования динамических меню.

Типы меню На сайте может быть представлено несколько меню различных типов: верхнее, левое, нижнее и т.п. В самом общем случае на сайте существует одно "основное" меню, соответствующее самому верхнему уровню иерархии и отображаемое во всех разделах сайта.

Также в системе часто используется "второстепенное" меню (или меню второго уровня), включающее ссылки на подразделы и документы текущего раздела.

Типы используемых на сайте меню задаются из административного раздела на странице настроек модуля Управление структурой.

Например, пусть в системе используются два типа меню:

Page 73: Integration course

73

• левое меню – тип "left";

• верхнее (основное) меню – тип "top".\

Тип меню, заданный в настройках модуля Управления структурой, будет использован как префикс файла с шаблоном меню (например, top.menu_template.php), а также для идентификации файлов с пунктами меню (например, .top.menu.php). Кроме того, имя типа меню используется для подключения меню в шаблоне дизайна.

Примечание: типы меню могут быть заданы отдельно для каждого сайта.

Типы меню задаются произвольно (только символами латинского алфавита). Однако для упрощения управления меню рекомендуется давать типам меню значимые имена. Например, top, left, bottom.

Построение и показ меню В общем случае задача формирования меню включает:

• выделение HTML элементов для построения меню;

• создание шаблона меню (создание шаблона компонента Меню);

• включение функции показа меню (вызов компонента Меню) в общем шаблоне ("прологе" и "эпилоге");

• заполнение меню в соответствии со структурой сайта.

Структура меню

Page 74: Integration course

74

Любое меню на сайте строится на основе двух составляющих:

• массива данных, определяющего состав меню, задает названия и ссылки для всех пунктов меню. Управление массивом данных осуществляется через административный интерфейс;

• шаблона внешнего представления меню. Шаблон меню – это PHP код, определяющий внешний вид меню (шаблон компонента Меню). Шаблон меню обрабатывает массив данных, выдавая на выходе HTML-код.

Массив данных меню

Данные для каждого типа меню хранятся в отдельном файле, имя которого имеет следующий формат: .<тип меню>.menu.php. Например, для хранения данных меню типа left будет использоваться файл .left.menu.php, а для хранения данных меню типа top - файл .top.menu.php.

Файлы меню размещаются в папках тех разделов сайта, где требуется показ соответствующих типов меню. Если для данного раздела не создан соответствующий файл меню, система производит поиск файла в каталоге уровнем выше.

Например, т.к. основное меню (в демо-версии продукта, это меню типа top) должно выводиться во всех разделах, то файл данного меню помещается только в корневой каталог сайта:

Page 75: Integration course

75

Соответственно меню второго уровня (в демо-версии продукта, это меню left) выводится отдельно для каждого раздела сайта. Поэтому в папке каждого раздела создается свой файл для данного типа меню:

Система «1C-Битрикс: Управление сайтом» позволяет также создавать меню динамического типа. Т.е. массив данных таких меню генерируется автоматически на основании некоторых данных, получаемых с помощью программного кода. Данный код должен храниться в папке соответствующего раздела сайта в файле с именем .<тип меню>.menu_ext.php.

Примером такого меню может служить левое меню раздела Каталог книг, представленное в демо-версии продукта. Здесь первые два пункта меню Авторы и Рецензии созданы обычным способом, а остальные (Бизнес-литература, Детская литература и т.д.) формируются динамически.

Page 76: Integration course

76

В данном случае в качестве пунктов меню используются названия групп каталога Книги, созданного на основе информационных блоков. Программный код, на основе которого генерируется меню, хранится в файле .left.menu_ext.php в папке /e-store/books/.

Шаблон внешнего представления меню

Выделение HTML элементов для построения меню

Создание шаблонов меню начинается с выделения необходимых HTML областей в шаблоне сайта:

• неизменной верхней и нижней части шаблона;

Page 77: Integration course

77

• повторяющихся элементов. Например, для горизонтального меню – это ячейки таблицы, а для вертикального – строки.

Создание шаблона меню

Все шаблоны меню имеют одинаковую структуру:

• область пролога шаблона меню;

• область с описанием замен для различных условий обработки шаблона;

• область тела шаблона меню;

• область эпилога шаблона меню.

Рассмотрим построение шаблона меню на примере Левого меню, представленного в демо-версии продукта (шаблон .default компонента Меню (bitrix:menu)):

<?if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();?> <?if (!empty($arResult)):?> <ul class="left-menu"> <?foreach($arResult as $arItem):?> <?if($arItem["SELECTED"]):?> <li><a href="<?=$arItem["LINK"]?>" class="selected"> <?=$arItem["TEXT"]?></a></li> <?else:?> <li><a href="<?=$arItem["LINK"]?>"> <?=$arItem["TEXT"]?></a></li> <?endif?> <?endforeach?> </ul> <?endif?>

Повторяющаяся часть меню, выделенная на предыдущем шаге, выносится в тело шаблона меню.

При создании шаблона меню потребуется также создать дополнительные стили в таблице стилей (CSS). Например, для текстового меню: цвет пункта меню и цвет текущего (активного) пункта меню.

Отдельного представления в шаблоне могут потребовать заголовки разделов (например, название текущего раздела при просмотре подразделов). Также можно предусмотреть использование графических или текстовых обозначений, например, того, что данный пункт ссылается на подразделы или документ текущего раздела и т.д.

Page 78: Integration course

78

Все шаблоны меню хранятся в папке компонента:

/bitrix/components/bitrix/menu/templates/.

Быстрый доступ к редактированию шаблона каждого типа меню можно осуществить в режиме Разработка с помощью пункта Редактировать шаблон компонента меню команд кнопки по управлению компонентом.

Организация показа меню

Показ меню на страницах сайта выполняется с помощью компонента Меню (bitrix:menu). Например, вызов верхнего меню на демо-сайте имеет следующий вид:

<?$APPLICATION->IncludeComponent( "bitrix:menu", "horizontal_multilevel", Array( "ROOT_MENU_TYPE" => "top", "MAX_LEVEL" => "3",

Page 79: Integration course

79

"CHILD_MENU_TYPE" => "left", "USE_EXT" => "Y" ) );?>

Данный код помещается в предусмотренные для вывода меню области шаблона сайта.

Построение меню сайта

Построение меню для показа происходит следующим образом:

• в общий шаблон показа включается вызов вывода меню на экран;

• при загрузке компонент проверяет наличие в текущем разделе сайта файла, содержащего массив значений для меню;

• затем компонент вызывает шаблон построения для данного типа меню и выводит HTML меню на экран.

Управление меню Управление меню выполняется как с помощью средств административного, так и публичного раздела.

Создание меню

Перейти к созданию меню раздела можно следующими способами:

• из административного раздела с помощью кнопки Добавить меню, расположенной на контекстной панели Менеджера файлов:

Меню будет создано для раздела, папка которого открыта в данный момент в Менеджере файлов.

• из публичного раздела в режиме Разработка с помощью пункта Создать меню в текущем разделе меню команд кнопки управления компонентом.

Page 80: Integration course

80

Примечание: в результате данных операций создается файл данных меню с именем .<тип_ меню>.menu.php. Однако в менеджере файлов имя файла данных автоматически представляется в виде ссылки Меню типа "<тип_меню>".

Редактирование меню

Примечание: при редактировании меню выполняется изменение файла .<тип_ меню>.menu.php (например, .top.menu.php). Однако работа с данным файлов ведется через специальный интерфейс системы. Это позволяет исключить необходимость работы непосредственно с программным кодом и дает возможность редактировать пункты меню в визуальном режиме.

Перейти к редактированию меню можно следующими способами:

• Из административного раздела, открыв на редактирование файл соответствующего меню в Менеджере файлов.

В системе предусмотрено два режима редактирования меню (переключение между ними выполняется с помощью соответствующей кнопки, расположенной на контексной панели страницы редактирования меню):

• упрощенный режим редактирования;

Page 81: Integration course

81

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

• расширенный режим редактирования.

В этом режиме для управления доступны следующие данные:

• тип редактируемого меню;

• шаблон, на основе которого будет генерироваться меню (поле используется в случае, если создаваемое меню должно генерироваться на основе шаблона, отличного от используемого по умолчанию);

• название пункта меню;

• ссылка для перехода;

• индекс сортировки;

Page 82: Integration course

82

• набор дополнительных ссылок, которые соответствуют этому же пункту меню. В данном поле задается набор ссылок на страницы, при переходе на которые будет также подсвечиваться данный пункт меню. Например, чтобы при просмотре любой страницы раздела Каталог книг подсвечивался пункт меню Каталог книг, в данном поле нужно указать ссылку на папку, содержащую все страницы раздела (или перечислить необходимые страницы): /e-store/books/;

• условия показа. Например, позволяет внести ограничения на показ данного пункта меню пользователям с определенными правами доступа;

• дополнительные параметры – набор произвольных параметров, которые могут быть обработаны в шаблоне показа меню и представлены соответствующим образом. Например, если пункт меню является заголовком секции, это может быть указано в параметрах пункта так: название параметра - SEPARATOR, значение - Y. При разработке шаблона можно проверять значение этого параметра и при показе выделять данный пункт меню разделителем.

• Для редактирования меню из публичного раздела нужно перейти в режим редактирования контента сайта (закладка Редактирование). Затем выбрать пункт Редактировать пункты меню из списка команд кнопки управления меню.

Откроется удобная форма редактирования:

Page 83: Integration course

83

Цепочка навигации

В этом разделе приводится описание структуры шаблона и данных, на основе которых выполняется построение и отображение цепочки навигации, а также приемы управления показом цепочки навигации на страницах сайта.

Управление пунктами навигационной цепочки Цепочка навигации представляет собой последовательный список ссылок на разделы и страницы сайта и показывает уровень "погружения" текущей страницы в структуру сайта. Значения, подставляемые в навигационную цепочку, могут быть заданы как для каждого раздела, так и для отдельного документа.

Цепочка навигации помогает посетителю легко ориентироваться на сайте: быстро вернуться на главную страницу или подняться на один (или более) уровень вверх, т.е. перейти из подраздела в раздел.

Page 84: Integration course

84

Управление через визуальный интерфейс системы

По умолчанию в системе используется механизм управления названиями пунктов навигационной цепочки через свойства разделов. Название ссылки на раздел сайта в навигационной цепочке определяется с помощью поля Заголовок в форме настройки свойств раздела.

Переход к форме настройки свойств раздела можно осуществить:

• из публичного раздела при помощи пункта Свойства раздела меню команд кнопки Изменить:

В результате откроется форма настройки свойств текущего раздела:

Page 85: Integration course

85

• из административного раздела с помощью кнопки Свойства папки, расположенной на контекстной панели Менеджера файлов. В результате будет открыта форма настройки свойств текущей папки.

Чтобы изменить название ссылки на раздел в цепочке навигации, нужно отредактировать Заголовок папки. Название ссылки будет изменено сразу же после сохранения новых свойств раздела.

Примечание: для того чтобы ссылка на какой-либо раздел не выводилась в навигационной цепочке сайта, нужно удалить название раздела из поля Заголовок и сохранить внесенные изменения.

Управление через код страницы

Page 86: Integration course

86

С помощью php функции AddChainItem() в цепочку навигации могут быть добавлены дополнительные пункты. В качестве значений пунктов навигационной цепочки могут использоваться как статические, так и динамические величины:

<? //---Первым параметром функции AddChainItem() задается название, //---которое будет показано в навигационной цепочке, вторым параметром задается //---ссылка для перехода. //---Значения параметров могут быть как статическими, так и динамическими. //---в приведенном примере название раздела задано статической величиной, а //---ссылка формируется динамически. $APPLICATION->AddChainItem("Детальная информация о товаре", "catalog.php?BID=".$arIBlock["ID"]."&ID=".$arSection["ID"]); //---В приведенном ниже примере обе величины формируются динамически. //---В качестве названия подставляется текущее значение раздела каталога. $APPLICATION->AddChainItem($arSection["NAME"], "catalog.php?BID=".$arIBlock["ID"]."&ID=".$arSection["ID"]); ?>

Для того чтобы выводить в навигационную цепочку название текущей страницы, необходимо вставить вызов функции AddChainItem() в файле footer.php, т.е. после вывода содержимого рабочей области.

<?$APPLICATION->AddChainItem($APPLICATION->GetTitle());?>

Некоторые пункты навигационной цепочки могут не содержать ссылки на какой-либо раздел или документ сайта, т.е. могут быть представлены в виде обычного текста (например, название текущей страницы).

Такие пункты создаются путем добавления в шаблон показа навигационной цепочки следующего кода:

if($arResult[$index]["LINK"] <> "")

Page 87: Integration course

87

$strReturn .= '<li><a href="'.$arResult[$index]["LINK"].'" title="'.$title.'">'.$title.'</a></li>'; else $strReturn .= '<li>'.$title.'</li>';

Отдельные компоненты могут также добавлять в навигационную цепочку заголовок текущей страницы сайта или, например, заголовок текущей новости или товара каталога. Так, например, комплексный компонент Новости (bitrix:news) последовательно добавляет в навигационную цепочку названия каталогов и групп новостей по мере погружения вглубь по уровням, если это установлено в его настройках.

Аналогичным образом в навигационную цепочку добавляются названия форумов и тем форумов.

В этом случае значение пункта навигационной цепочки для данной страницы определяется непосредственно в документе. Для этого используется функция AddChainItem().

Управление показом цепочки Показ навигационной цепочки выполняется с помощью специального кода в шаблоне сайта:

<? $APPLICATION->ShowNavChain(); ?>

Функция вызова навигационной цепочки может использоваться не только в шаблоне сайта, но и в коде страницы или отдельных компонентов, представленных на странице. Например, вывод навигационной цепочки используется в компоненте поиска:

Page 88: Integration course

88

Примечание: в демо-версии продукта шаблон цепочки навигации, используемой в компоненте поиска, хранится в каталоге шаблона компонента поиска в файле chain_template.php.

Показ навигационной цепочки может быть отключен на определенных станицах или в определенном разделе сайта. Управление отображением навигационной цепочки также осуществляется с помощью свойств страницы (раздела). Для этого необходимо:

• На странице настроек модуля Управление структурой создать свойство для страниц Не показывать навигационную цепочку с кодом not_show_nav_chain. Данное свойство является предустановленным в системе;

Page 89: Integration course

89

• если навигационная цепочка не должна отображаться на определенной странице или страницах какого-либо раздела, то для этой страницы или раздела нужно установить значение данного свойства равным Y.

Кроме того, значение свойства Не показывать навигационную цепочку может быть задано непосредственно в коде страницы с помощью функции SetPageProperty():

<? require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php"); $APPLICATION->SetPageProperty("description", "«1C-Битрикс: Управление сайтом» - система разработки и управление web-проектами"); $APPLICATION->SetPageProperty("keywords", "Сайт, управление сайтом, система управления"); $APPLICATION->SetPageProperty("NOT_SHOW_NAV_CHAIN", "Y"); $APPLICATION->SetTitle("Пробная версия продукта «1C-Битрикс: Управление сайтом»"); ?>

Подробная информация по управлению свойствами страниц и разделов приведена в разделе Свойства страниц и разделов.

Управление шаблоном навигационной цепочки В текущей версии продукта цепочка навигации на сайте подключается в шаблоне с помощью компонента 2.0 Навигационная цепочка (bitrix:breadcrumb). Для этого компонента может быть создано любое количество шаблонов, т.е. внешних видов. Все они хранятся в папке компонента

/bitrix/components/bitrix/breadcrumb/templates/<название шаблона>/.

Page 90: Integration course

90

Все созданные шаблоны будут отображаться в настройках компонента. Таким образом для каждого шаблона сайта может быть установлен свой шаблон цепочки навигации. Структура шаблона показа навигационной цепочки аналогична структуре шаблона показа меню.

Пример шаблона навигационной цепочки:

<? if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die(); if(empty($arResult)) return ""; $strReturn = '<ul class="breadcrumb-navigation">'; for($index = 0, $itemSize = count($arResult); $index < $itemSize; $index++) { if($index > 0) $strReturn .= '<li><span>&nbsp;&gt;&nbsp;</span></li>'; $title = htmlspecialcharsex($arResult[$index]["TITLE"]); if($arResult[$index]["LINK"] <> "") $strReturn .= '<li><a href="'.$arResult[$index]["LINK"].'" title="'.$title.'">'.$title.'</a></li>'; else $strReturn .= '<li>'.$title.'</li>'; } $strReturn .= '</ul>'; return $strReturn; ?>

Управление навигационной цепочкой и ее шаблоном осуществляется также, как при работе с другими компонентами 2.0. В режиме разработки и настройки сайта (закладка Разработка) с помощью кнопки управления вы можете быстро перейти к форме изменения параметров компонента либо скопировать шаблон компонента, а затем отредактировать его.

При подключении навигационной цепочки с помощью функции ShowNavChain() ее шаблон может быть задан дополнительно для отдельного раздела сайта. Для этого

Page 91: Integration course

91

непосредственно в файле .section.php определяется переменная $sChainTemplate, где задается полный путь к шаблону показа навигационной цепочки. Например:

$sChainTemplate = "/bitrix/templates/demo/chain_template.php"

Шаблон навигационной цепочки может быть также задан при вызове функции ShowNavChain() как один из параметров функции.

$APPLICATION->ShowNavChain("/bitrix/templates/.default/chain_template_bottom.php")

Page 92: Integration course

92

Включаемые области В данном разделе представлена информация по созданию и использованию включаемых областей для шаблонов и страниц сайта.

Использование включаемых областей Включаемая область - это специально выделенная область на странице сайта, которую можно редактировать отдельно от основного содержания страницы.

Включаемые области служат для размещения справочной информации, различных форм (подписки, голосования, опросов), новостей и любой другой статической и динамической информации. Также в виде включаемой области могут быть выполнены области с указанием авторских прав, графические ссылки, контактная информация, логотип компании и т.п.

В системе существует возможность создания различных типов включаемых областей, например:

• включаемая область страницы – выводится только при просмотре определенной страницы;

• включаемая область раздела – выводится на всех страницах определенного раздела сайта;

Page 93: Integration course

93

• включаемый файл – в области выводится информация какого-либо файла (например, название компании, информация об авторских правах и т.д.).

Количество включаемых областей может быть расширено. При этом потребуется некоторая модификация шаблона сайта (например, добавление в шаблон дизайна компонентов или php-кода для подключения дополнительных редактируемых областей).

Кроме того, включаемые области могут отображаться на страницах сайта в соответствии с любыми другими условиями. Например, только на главной странице сайта или только для авторизованных посетителей, и т.д.

Управление включаемыми областями

Включаемые области сохраняются в отдельных PHP или HTML файлах с некоторым суффиксом. Например, в поставке продукта файлах в качестве обозначения включаемой области для страницы используется суффикс _inc, а включаемая область для раздела сайта сохраняется в файле с именем sect_inc.php.

Подключение областей в шаблоне дизайна сайта выполняется с помощью функции IncludeFile() либо место их вставки определяется расположением в шаблоне компонента

Вставка включаемой области.

Page 94: Integration course

94

Суффикс, используемый для обозначения включаемых областей, определяется настройками компонента Вставка включаемой области. Компонент можно размещать не только в шаблоне дизайна, но и страницах сайта с условием, что суффикс файла должен быть задан отличным от того, который используется в шаблоне.

Размещение включаемой области Для размещение включаемой области выполните следующее:

• Откройте для редактирования шаблон сайта или страницу в визуальном редакторе.

• Добавьте компонент Вставка включаемой области в шаблон сайта (или в тело страницы) и настройте его параметры.

Создание и редактирование включаемой области Создание включаемых областей может быть выполнено:

• из административного раздела в Менеджере файлов, создав файл с соответствующим именем;

• из публичного раздела сайта в режиме редактирования контента (закладка Редактирование) или режиме разработки и настройки сайта (закладка Разработка). В тех местах, где предполагается вывод включаемых областей, будут показаны иконки для быстрого перехода к созданию или редактированию этих областей.

Page 95: Integration course

95

После выбора команды Добавить включаемую область для текущей страницы (раздела) будет запущен визуальный редактор для создания содержимого включаемой области.

Включаемые области создаются на основе шаблонов, хранящихся в папках с именем /page_templates/:

• /bitrix/templates/.default/page_templates/ - если данный шаблон включаемой области используется для всех шаблонов дизайна сайта;

• /bitrix/templates/<идентификатор шаблона>/page_templates/ - если для шаблона сайта используются отдельные шаблоны включаемых областей.

Для того чтобы в визуальном редакторе можно было выбирать шаблон, на основе которого создается редактируемая область, список шаблонов для редактируемых областей должен быть добавлен в файл .content.php.

Файл .content.php хранится в папке /page_templates/ в каталоге соответствующего шаблона сайта.

Page 96: Integration course

96

Следует обратить внимание на то, что имя шаблона может быть передано параметром при подключении редактируемой области в шаблоне сайта (см. выделение синим цветом в примере ниже).

Если подключение редактируемых областей выполняется с помощью PHP функции IncludeFile(), помещаемой в соответствующие места шаблона дизайна, то код может иметь такой вид:

<? $APPLICATION->IncludeFile(substr($APPLICATION->GetCurPage(), 0, strlen($APPLICATION->GetCurPage())-4)."_inc.php", Array(), Array("MODE"=>"html", "NAME"=>GetMessage("PAGE_INC"), "TEMPLATE"=>"page_inc.php")); ?> <? $APPLICATION-> IncludeFile($APPLICATION->GetCurDir()."sect_inc.php", Array(), Array("MODE"=>"html", "NAME"=>GetMessage("SECT_INC"), "TEMPLATE"=>"sect_inc.php")); ?>

Важно! Файл с включаемой областью должен быть сохранен в той же директории, что и страница, для которой он был создан. Включаемая область для раздела - в папке этого раздела.

Page 97: Integration course

97

Аналогично перейти к редактированию включаемых областей можно непосредственно из публичного раздела сайта в режиме редактирования контента или режиме разработки и настройки сайта:

либо из административного раздела, открыв для редактирования соответствующий файл в Менеджере файлов.

Page 98: Integration course

98

Рекламные области В данном разделе представлено описание правил и способов создания рекламных областей, размещения рекламных баннеров в этих областях, а также управления показом рекламы (в том числе с помощью ключевых слов).

Как это выглядит На сайте может быть представлено несколько различных видов рекламы. Это может быть как стандартная баннерная реклама, так и текстовые рекламные области. Реклама может быть постоянной или показываться с определенной вероятностью, задаваемой администратором. Показ рекламы может быть регламентирован по определенным разделам сайта и т.д. Создание и управление рекламой осуществляется средствами модуля Рекламы.

Показ рекламы выполняется в специально выделенных областях шаблона дизайна сайта – рекламных областях.

Подключение баннера в рекламной области может выполняться с помощью компонента 2.0 Баннер (bitrix:advertising.banner). Компонент выводит баннер заданного типа.

Данный компонент не учитывает таргетинг по ключевым словам. Если необходимо его учесть, то следует использовать функцию $APPLICATION->ShowBanner().

Код подключения баннера в рекламной области с помощью PHP функции ShowBanner() имеет вид:

<? //---Пример размещения рекламной области в левой части сайта. //---Аналогично производится выбор любого другого типа:

Page 99: Integration course

99

//---TOP, BOTTOM, COUNTER,… (первый параметр функции) //---Могут быть использованы как предустановленные, так и задаваемые //---пользователем типы. //---В качестве двух дополнительных параметров может указываться HTML-код обрамляющий рекламную область сверху и снизу. $APPLICATION->ShowBanner("LEFT", '<div align="center">', '<br></div><br>'); ?>

Для каждой рекламной области определяется, реклама какого типа будет доступна для показа в данной области. В приведенном выше примере это рекламные баннеры типа LEFT и BOTTOM.

Типы рекламы Тип рекламы – это условное название группы рекламных баннеров, обладающих некоторым общим признаком. Например:

• место показа – все баннеры должны показываться в определенном месте страницы сайта;

• тематика (например, рекламируется один товар);

• рекламодатель (реклама определенной компании);

• и т.д.

Название типа рекламного блока задается администратором произвольно. Например, для верхней рекламы может быть установлен тип TOP, LEFT, BOTTOM и т.п.

Важно! Рекомендуется, чтобы баннеры из одной группы имели одинаковый размер. Это позволит избежать деформации страницы при показе рекламы.

Page 100: Integration course

100

Управление типами рекламы выполняется через административный интерфейс модуля Рекламы: Сервисы > Реклама > Типы баннеров.

Приступить к управлению рекламным баннером или списком баннеров выбранной рекламной области можно непосредственно из публичной части сайта. Для этого перейдите в режим Редактирование и воспользуйтесь одной из кнопок управления рекламной областью:

Управление показом рекламы с помощью ключевых слов

Управление показом баннеров с помощью ключевых слов является одной из форм таргетинга рекламы на сайте. Особенность данного метода заключается в том, что он позволяет:

• организовать показ рекламы, нацеленный на конкретную группу пользователей сайта. Т.е. показывать рекламу на страницах, посещаемых

Page 101: Integration course

101

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

• ограничить показ рекламы на страницах сайта, например, исходя из того, насколько содержание рекламы связано с информацией, представленной на странице.

Данный метод управления рекламой включает настройку следующих видов ключевых слов:

• ключевые слова баннера;

• ключевые слова страниц сайта:

• желательные (desired): если для страницы сайта заданы желательные ключевые слова, то для показа на данной странице будут доступны все баннеры, в наборе ключевых слов которых содержится хотя бы одно желательное ключевое слово страницы.

Если такие баннеры не найдены, то на странице будут показаны баннеры, для которых ключевые слова не заданы. Отбор и показ данных баннеров осуществляется на основе стандартного алгоритма системы.

• обязательные (required): если для страницы сайта заданы обязательные ключевые слова, то для показа на данной странице будут доступны все баннеры, в наборе ключевых слов которых содержаться все обязательные ключевые слова страницы.

Если такие баннеры не найдены, то на странице будут показаны баннеры, для которых ключевые слова не заданы. Отбор и показ данных баннеров осуществляется на основе стандартного алгоритма системы.

Ключевые слова баннеров задаются в поле Ключевые слова на странице создание/редактирования баннера: Сервисы > Реклама > Баннеры.

Page 102: Integration course

102

Управление желательными ключевыми словами страницы выполняется с помощью специального свойства adv_desired_target_keywords. Данное свойство является предустановленным, т.е. оно описано в программном коде продукта.

Желательные ключевые слова страницы могут быть заданы с помощью функции SetDesiredKeywords. Данная функция содержит следующие параметры:

• keywords - одно или несколько желательных ключевых слов страницы;

• TIP_SID - тип рекламы, управление показом которой будет осуществляться с помощью указанных желательных ключевых слов. Если данный параметр оставить пустым, то ключевые слова будут заданы для всех типов рекламы.

CAdvBanner::SetDesiredKeywords (array ("Partners", "Cooperation", "Company", "Contacts"), "RIGHT");

Обратите внимание! По умолчанию, если в коде страницы не установлено каких-либо ключевых слов для рекламы, считается что функция SetDesiredKeywords использует в

Page 103: Integration course

103

качестве параметра значение свойства страницы adv_desired_target_keywords. Если оно не задано, то в качестве параметра функции используется значение свойства keywords.

Функция SetDesiredKeywords вызывается автоматически в момент сборки страницы, ее не нужно дополнительно вызывать в файле header.php, если нет необходимости переопределить ключевые слова для показа рекламы.

Обязательные ключевые слова страницы задаются с помощью предустановленной функции системы SetRequiredKeywords. Данная функция содержит следующие параметры:

• keywords - одно или несколько обязательных ключевых сов страницы;

• TYPE_SID - тип рекламы, управление показом которой осуществляется с помощью указанных желательных ключевых слов. Если данный параметр оставить пустым, то ключевые слова будут заданы для всех типов рекламы.

CAdvBanner::SetRequiredKeywords (array("Partners", "Cooperation"), "RIGHT");

В приведенном примере для показа на странице будет доступен баннер, в наборе ключевых слов которого содержаться все обязательные ключевые слова (partners и cooperation), заданные для страницы.

Page 104: Integration course

104

Визуальные компоненты В разделе приводится описание основных принципов и способов создания, использования и настройки визуальных компонентов.

Использование компонентов Визуальные компоненты представляют собой логически завершенный программный код, выполняющий операции с данными отдельных модулей системы. Практически любой программный код может быть представлен в виде компонента.

Начиная с версии 6.0 продукта, доступны компоненты новой версии 2.0. Отличие компонентов версии 2.0 от первой версии состоит в том, что в них разделены логика и представление. Для одной логики может быть создано несколько представлений, в том числе зависящих от шаблона текущего сайта. Нет необходимости изменять логику компонента для изменения особенностей его показа. Поэтому управлять внешним видом информации, выводимой компонентом, стало значительно проще. Компоненты версии 2.0 делятся на два вида: простые и комплексные. Простые служат для создания какой-либо области на одной странице (список новостей, топ элементов каталога, случайное фото).

Комплексные компоненты используются для создания разделов на сайте (например, новостной раздел, фотогалерея, каталог товаров, форум). Их удобство заключается в создании одной страницы на физическом уровне и получении необходимого набора страниц логически.

Page 105: Integration course

105

Для быстрого размещения компонентов на странице разработан специальный интерфейс на базе визуального HTML- редактора. При редактировании страницы можно выбрать подходящий компонент из списка и переместить его в рабочую область страницы.

Визуальные компоненты включают набор параметров, определяющих поведение компонента. Основная особенность компонентов заключается в том, что они позволяют управлять данными параметрами через визуальный интерфейс продукта.

После размещения компонента на странице его параметры могут быть настроены с помощью панели Свойства визуального редактора. Параметры компонентов разделены по группам: шаблон компонента (где устанавливается один из созданных шаблонов вывода для компонента), основные параметры, источник данных и т.д. Например, для компонента Каталог задаются основные параметры, шаблоны ссылок, управление режимом AJAX, настройки кеширования и т.д.

Примечание: система позволяет управлять параметрами компонента из публичной части в режиме разработки и настройки сайта (закладка Разработка). Переход к форме редактирования параметров компонента возможен с помощью пункта Редактировать параметры компонента меню команд компонента:

Page 106: Integration course

106

Откроется форма следующего вида:

Некоторые компоненты могут управлять отдельными элементами шаблона сайта:

• добавлять кнопки в административную панель (например, компоненты информационных блоков);

• добавлять элементы в цепочку навигации (например, компоненты информационных блоков, интернет-магазина);

Page 107: Integration course

107

• устанавливать заголовок документа (например, компоненты информационных блоков, форума, блогов);

• задавать значения метаданных страницы: ключевые слова и описание (например, компоненты информационных блоков).

Примечание: в приведенных примерах управление элементами шаблона сайта осуществляется с помощью специальных параметров визуальных компонентов. Настройка данных параметров может быть выполнена при редактировании страницы в режиме визуального HTML-редактора или из публичной части в форме редактирования параметров компонентов.

Page 108: Integration course

108

Полезная информация:

• Если на странице расположены несколько компонентов, каждый из которых может устанавливать заголовок страницы, то заголовок страницы будет установлен последним компонентом (с помощью функции SetTitle()).

• Если на странице расположено несколько визуальных компонентов, добавляющих свои кнопки в административную панель (например, несколько компонентов информационных блоков), то для того чтобы избежать перегруженности административной панели кнопками, в настройках этих компонентов необходимо снять опцию Добавлять в админ. панель кнопки для данного компонента.

При необходимости пользователь может быстро перейти к редактированию PHP кода вызова компонента. Для этого нужно переключиться в режим редактирования исходного кода страницы:

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

Page 109: Integration course

109

Возможность использования программного кода в рабочей области страницы позволяет разместить практически любой PHP код без ущерба для визуального режима редактирования содержимого страницы.

Подключение визуальных компонентов

Компоненты версии 2.0 подключаются в коде страницы с помощью функции IncludeComponent(). В качестве параметров функции используется:

• название компонента в форме <пространство_имен>:<название_компонента>. Причем название компонента рекомендуется строить иерархически, начиная с общего понятия и заканчивая конкретным назначением компонента. Например, catalog, catalog.element, catalog.section.list и т.п.

• название шаблона. Шаблон компонента "по умолчанию" можно задавать пустой строкой, также можно явно определять .default.

• массив параметров компонента Array(...).

Пример кода вызова компонента Список новостей:

<?$APPLICATION->IncludeComponent( "bitrix:news.list", "", Array( "DISPLAY_DATE" => "Y", "DISPLAY_NAME" => "Y", "DISPLAY_PICTURE" => "N", "DISPLAY_PREVIEW_TEXT" => "Y", "IBLOCK_TYPE" => "news", "IBLOCK_ID" => "33",

Page 110: Integration course

110

"NEWS_COUNT" => "3", "SORT_BY1" => "ACTIVE_FROM", "SORT_ORDER1" => "DESC", "SORT_BY2" => "SORT", "SORT_ORDER2" => "ASC", "FILTER_NAME" => "", "FIELD_CODE" => array(0=>"",1=>"",), "PROPERTY_CODE" => array(0=>"",1=>"",), "DETAIL_URL" => "/content/news/index.php?news=#ELEMENT_ID#", "PREVIEW_TRUNCATE_LEN" => "0", "ACTIVE_DATE_FORMAT" => "d.m.Y", "DISPLAY_PANEL" => "N", "SET_TITLE" => "N", "INCLUDE_IBLOCK_INTO_CHAIN" => "Y", "ADD_SECTIONS_CHAIN" => "Y", "HIDE_LINK_WHEN_NO_DETAIL" => "N", "PARENT_SECTION" => "", "CACHE_TYPE" => "A", "CACHE_TIME" => "3600", "CACHE_FILTER" => "N", "DISPLAY_TOP_PAGER" => "N", "DISPLAY_BOTTOM_PAGER" => "N", "PAGER_TITLE" => "Новости", "PAGER_SHOW_ALWAYS" => "N", "PAGER_TEMPLATE" => "", "PAGER_DESC_NUMBERING" => "N", "PAGER_DESC_NUMBERING_CACHE_TIME" => "36000" ) );?>

Все компоненты находятся в папке /bitrix/components/. Системные компоненты находятся в подпапке /bitrix/components/bitrix/. Содержимое этой папки обновляется системой обновлений и не может изменяться пользователями.

Пользовательские компоненты могут находиться в любых других подпапках папки /bitrix/components/ или прямо в папке /bitrix/components/.

Подробнее о размещении и именовании компонентов см. курс Компоненты 2.0.

Page 111: Integration course

111

Структура компонентов

Папка компонента может содержать следующие подпапки и файлы:

• подпапку help, в которой расположены файлы помощи компонента. Подпапка help может отсутствовать.

• подпапку install, в которой расположены скрипты для инсталляции и деинсталляции компонента. Она может отсутствовать.

• подпапку lang, в которой расположены файлы языковых сообщений (переводов) компонента. Подпапка lang может отсутствовать, если в компоненте нет зависящих от языка фраз.

• подпапку templates, в которой расположены шаблоны вывода (отображения) компонента. Подпапка templates может отсутствовать, если у компонента нет шаблонов вывода.

• файл component.php, который содержит логику (код) компонента. Этот файл должен всегда присутствовать в папке компонента.

• файл .description.php, который содержит название, описание компонента и его положение в дереве логического размещения (для редактора). Этот файл должен всегда присутствовать в папке компонента.

• файл .parameters.php, который содержит описание входных параметров компонента для редактора. Если у компонента есть входные параметры, то этот файл должен присутствовать в папке компонента.

• любые другие папки и файлы с ресурсами, необходимыми компоненту, например, папка images.

Page 112: Integration course

112

Подробнее о структуре компонентов и об их описании см. курс Компоненты 2.0 и Руководство по интеграции 7.xx.

Кастомизация компонентов Кастомизация визуальных компонентов заключается в дополнительной настройке внешнего вида (цвета, размера шрифта, формы кнопок и т.д.), а также при необходимости в изменении программного кода (логики работы) компонентов (например, для изменения способа вывода списка элементов и т.д.).

Для того чтобы кастомизировать компонент 2.0 под определенный шаблон сайта, необходимо скопировать шаблон компонента либо в шаблон сайта по умолчанию, либо в любой другой шаблон. Копирование шаблона компонента производится средствами системы. В режиме разработки и настройки сайта (закладка Разработка) по кнопке Копировать шаблон компонента осуществляется переход к форме копирования шаблона компонента.

После копирования шаблона можно переходить к его редактированию под определенные требования.

Если необходимо изменить логику компонента, то компонент необходимо полностью скопировать в новое пространство имен (подпапку папки /bitrix/components/), предварительно созданное. После этой операции компонент будет отображаться в панели визуального редактора рядом с системным компонентом. Если нужно выделить отдельную область в панели компонентов 2.0 для пользовательских компонентов, то необходимо изменить файл .description.php компонента.

Подробнее о кастомизации компонентов см. курс Компоненты 2.0 и Руководство по интеграции 7.xx.

Пример работы с компонентами (организация показа новостей на сайте)

Создание страниц для показа новостей начинается с заведения соответствующего информационного блока в административном интерфейсе и заполнения его элементов – новостей.

Page 113: Integration course

113

При создании нового информационного блока необходимо указать:

• путь к странице показа списка элементов информационного блока (новостей);

• путь к странице показа списка элементов раздела информационного блока (новостей). Если элементы информационного блока (новости) распределены по группам, то данная страница будет использоваться для вывода списка новостей из одной группы;

• путь к странице детального просмотра элемента (новости).

Для публикации новостного раздела будем использовать комплексный компонент Новости (bitrix:news), поэтому отдельное создание страниц со списком всех новостей, со списком новостей раздела, с детальным показом новости не требуется.

После заполнения информационного блока Новости компании содержимым переходим к созданию страницы в визуальном редакторе. Для создания новостного раздела перетащим комплексный компонент на страницу:

Page 114: Integration course

114

Далее настраиваем параметры компонента:

• Шаблон компонента оставляем по умолчанию. Дополнительные параметры позволяют легко регулировать пожелания вывода: нужна ли дата элемента, изображение для анонса, текст анонса:

• Далее устанавливаем основные параметры компонента:

• Также настройки компонента позволяют установить параметры rss:

Page 115: Integration course

115

• Также с помощью параметров компонента можно определять настройки голосования, настройки вывода материалов по теме, настройки отзывов и т.д.

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

Страница со списком новостей:

Страница детального просмотра:

Page 116: Integration course

116

Права доступа Данная глава содержит примеры использования разграничения прав доступа для управления элементами сайта.

Использование прав доступа

Предусмотренный в системе механизм проверки прав доступа может быть использован в следующих целях:

• Для управления показом пунктов меню

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

• Для управления шаблоном меню

Уровень прав доступа пользователей может влиять на структуру шаблона меню, используемые элементы, изображения и т.д. Пример проверки уровня прав доступа пользователя для шаблона меню приводится ниже:

<?if (!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();?> <?if (!empty($arResult)):?> <div class="blue-tabs-menu"> <ul> <?foreach($arResult as $arItem):?> <?if ($arItem["PERMISSION"] > "D"):?> <li><a href="<?=$arItem["LINK"]?>"><nobr><?=$arItem["TEXT"]?></nobr></a></li> <?endif?> <?endforeach?> </ul> </div> <div class="menu-clear-left"></div>

Page 117: Integration course

117

<?endif?>

Важно! Условия, включающие проверку значения переменной $PERMISSION, используются только для меню сайта.

• Для управления шаблоном сайта

Для каждого шаблона дизайна может быть настроено условие его применения к сайту. Данная настройка выполняется на странице управление параметрами сайта: Настройки системы > Сайты > Изменить.

Например:

В приведенном примере условие определяет, что шаблон Версия для печати будет применяться, если в URL параметр print=Y.

Примеры php-условий для показа шаблона сайта:

• Для управления элементами шаблона дизайна

Управление показом элементов шаблона сайта, их формой, цветом и другими параметрами, может осуществляться также исходя из уровня прав доступа пользователей сайта.

• Управление отдельными элементами сайта

Использование механизма проверки прав доступа позволяет организовать управление отдельными элементами сайта (страницами, разделами, рекламой, форумами и т.д.) различными пользователями.

Page 118: Integration course

118

Оптимизация сайта

Оптимизация сайта под поисковые системы Оптимизация под поисковые системы является одним из самых важных элементов продвижения сайта в Интернете. Система "1C-Битрикс: Управление сайтом" обеспечивает владельцев сайта всеми необходимыми инструментами для решения данной задачи:

Метаданные

Метаданные – это специальные теги (метатеги), используемые для задания ключевых слов и описаний страниц сайта.

Управление метаданными для статических страниц

Для статических страниц сайта значения метаданных задаются через предусмотренный в системе механизм управления свойствами страниц. Подробная информация приведена в главах Свойства страниц и разделов (глава Управление структурой проекта) и Управление метаданными (глава Управление служебными данными шаблона).

Управление метаданными для динамического контента страниц

Специальные свойства элементов информационных блоков (товаров, новостей, элементов фотогалереи и т.д.) могут быть использованы для задания значений метаданных страниц. Таким образом, любой товар торгового каталога, новость, вакансия, опубликованные на вашем сайте, будут проиндексированы со своими собственными ключевыми словами и описаниями.

Заголовок окна веб-браузера

Для управления заголовком окна веб-браузера, отображаемым при просмотре страницы, используется специальный тег title. При индексации страниц поисковые роботы проверяют значение именно этого тега.

Система "1C-Битрикс: Управления сайтом" предлагает различные способы управления значением тега title. По умолчанию для этой цели в системе используется предустановленное свойство страниц типа title. Значение данного свойства может быть задано отдельно для каждой страницы либо для всех страниц определенного раздела сайта.

Вывод заголовка окна веб-браузера выполняется с помощью функции ShowTitle(), размещаемой в области <head> шаблона дизайна сайта.

<head><title><?$APPLICATION->ShowTitle()?></title></head>

Page 119: Integration course

119

• Если функция ShowTitle() используется без параметров, то в качестве заголовка окна веб-браузера будет использовано значение свойства title;

• Если значение свойства title не указано, то заголовок окна браузера будет установлен равным текущему заголовку страницы.

• Если при выводе заголовка страницы функция ShowTitle() использует параметр false, это означает, что для установки заголовка окна веб-браузера значение свойства title проверяться не будет.

<H1><?$APPLICATION->ShowTitle(false)?></H1>

Т.е заголовок окна браузера будет установлен равным текущему заголовку страницы.

Заголовок окна веб-браузера может зависеть от динамической информации, просматриваемой на странице. Например, в заголовке окна браузера может выводиться название просматриваемой новости, раздела каталога товара или самого товара, и т.д.

Стили заголовков страницы (H1, H2, H3)

Управление заголовками на странице осуществляется при редактировании страницы в режиме HTML-редактора. В выпадающем списке можно выбрать заголовок нужного уровня (например, Heading1, Heading2 и т.д.) и применить его к выделенному тексту.

Соответствующие метатеги будут подставлены в код страницы автоматически:

Page 120: Integration course

120

<h1>Сайт </h1> … <h2>Материалы сайта </h2>

Для каждого проекта можно выполнить отдельную настройку внешнего представления заголовков. Для этого нужно выполнить настройку стилей и переопределить соответствующие теги в файле styles.css для конкретного шаблона сайта.

/* Headers */ H1, H2, H3, H4 {font-family: Verdana, Arial, Helvetica, sans-serif; color:#3A84C4; font-size:13px; font-weight:bold; line-height: 16px; margin-bottom: 1px;} H2 {color:#346BA0; font-size:13px; line-height: 18px;} H3 {font-size:12px; color: #1C1C1C;} H4 {font-size:12px; color: #1C1C1C;}

Исключение CSS из кода страницы

В системе "1C-Битрикс: Управление сайтом" все таблицы каскадных стилей (CSS) хранятся в отдельных файлах. Например, основные стили, используемые в шаблоне сайта хранятся в файле styles.css в папке соответствующего шаблона. Подключение файлов со стилями к странице может быть выполнено двумя способами:

• в виде ссылки на CSS файл:

В результате работы функции ShowCSS() без использования параметров в итоговый код страницы будет подставлена строка следующего вида:

<LINK href="/bitrix/templates/demo/styles.css" type="text/css" rel="STYLESHEET">

Т.е. в код страницы будет подставлена ссылка на файл с подключаемыми каскадными стилями.

Недостаток данного метода заключается том, что при использовании медленных каналов страница может искажаться. Это происходит из-за того, что при отображении страницы браузер не успевает получить информацию об используемых стилях.

• включением таблицы стилей в код страницы:

В случае использования функции ShowCSS() с параметром false файл стилей для текущего дизайна будет включен в код страницы с использованием PHP функции require():

<?$APPLICATION->ShowCSS(false);?>

Page 121: Integration course

121

В этом случае браузер будет получать страницу со встроенными (добавленными в код страницы) стилями.

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> … <style type='text/css'> /* Statistics :: public css */ .smalltextw {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 12px; color: #696C72; text-decoration: none} a.smalltextw:hover {text-decoration: underline;} .smalltextws {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; line-height: 12px; color: #FF7979; text-decoration: none} a.smalltextws:hover {text-decoration: underline;} </style> <style type='text/css'> /*Small text*/ .smalltext, .smalltextwhite, .smalltextblack {font-family: Arial, Helvetica, sans-serif; font-size:11px; font-weight:normal;}/*Small text*/ .smalltext {color: #333333;}/*Small text blue*/ .smalltextwhite {color: #60605E;}/*Small text white*/ .smalltextblack {color: #000000;}/*Small text black*/ …

Дополнительные каскадные стили, подключаемые с помощью функции SetAdditionalCSS() (например, в компонентах форума), также полностью включаются в код страницы с использованием PHP функции require().

Никаких ограничений на внешний вид сайта

Система "1C-Битрикс: Управление сайтом" не накладывает никаких ограничений на внешний вид сайта: шаблон сайта может быть разработан как на основе таблиц, так и с использованием слоев. Таким образом, может быть выбран любой, наиболее подходящий для поисковой оптимизации способ верстки шаблона.

Понятные пользователю URL (ЧПУ)

Обычно при выводе на страницах сайта динамической информации, в URL страницы добавляются специальные параметры (например, ID новостей, товаров и т.д.). Например, mysite.com/news/index.php?ID=23.

Page 122: Integration course

122

Стандартная функция системы "1C-Битрикс: Управление сайтом" позволяет преобразовать данные URL в стандартный, удобный для восприятия пользователями вид (без использования mod_rewrite). Например, mysite.com/news/23.php.

Преобразование URL выполняется с помощью механизма обработки 404 ошибки. Имя страницы может быть сформировано, например, с использованием ID или мнемонического кода отображаемого на ней элемента, и т.п.

Определение поисковых фраз, используемых пользователями для перехода на сайт

Специальные средства модуля Статистика позволяют проанализировать поисковые фразы, по которым пользователи переходят из поисковых систем на сайт: Веб-аналитика > Поисковые фразы > Список фраз.

Полученная информация может быть использована для задания ключевых слов страниц сайта, а так же при оптимизации системы навигации сайта, для облегчения доступа пользователей к интересующим их ресурсам.

Ограничение активности поисковых роботов

В случае, если некоторые поисковые роботы показывают слишком высокую активность на сайте, они могут быть блокированы с помощью встроенных средств системы на определенный период. Для этого:

• на странице настроек модуля Статистики определяются параметры ограничения активности:

Page 123: Integration course

123

• на странице настроек параметров того или иного поисковика устанавливается флаг в поле Проверять лимит активности:

Page 124: Integration course

124

Возможность удаления идентификатора сессии из адреса URL страницы

Добавление ID сессии в URL страницы мешает индексации сайта поисковыми машинами. Вы можете запретить отображение ID сессии в URL страницы, добавив соответствующую строку в файл .htaccess, либо в файл настроек сервера php.ini:

#php_flag session.use_trans_sid off