Раздел «Настройки вида сайта» — различия между версиями
м (Andrey Polyak переименовал страницу Настройка внешнего вида сайта в Раздел «Настройки вида сайта») |
|||
(не показаны 7 промежуточных версий 2 участников) | |||
Строка 1: | Строка 1: | ||
− | + | <!-- In progress — to complete --> | |
− | [[Image:Sm9.png]] | + | [[Image:Sm9.png|700px]] |
− | На этой вкладке указывается заголовок сайта, логотип сайта, а также настраивается описание и ключевые слова (для SEO). | + | === Вкладка «Основное» === |
+ | На этой вкладке указывается заголовок сайта, логотип сайта, а также настраивается описание и ключевые слова (для SEO). В следующей таблице эти параметры описываются более подробно. | ||
− | + | {|class="wikitable" | |
+ | !Параметр!!Описание | ||
+ | |- | ||
+ | | '''Название сайта''' | ||
+ | | В этом поле задается название сайта, которое отображается в заголовке окна браузера. На вкладках можно задать различные названия для локализованной и английской версий сайта. Если это русская локализация, то вкладки носят названия '''Русский вариант''' и '''Английский вариант''' позволяют задать различные названия для русской и английской версий сайта соответственно. В других локализациях название вкладки языка, отличного от английского, могут называться иначе. Вкладка для английского варианта присутствует всегда. Обязательно введите или отредактируйте текст для всех версий сайта, которые планируется использовать. | ||
+ | |- | ||
+ | | '''Блок SEO''' | ||
+ | | Текстовые поля в этом блоке предназначены для размещения информации для поисковой оптимизации сайта, то есть повышения позиции сайта в результатах поисковых систем, таких как Google или Yandex. | ||
+ | |- | ||
+ | | '''Description''' | ||
+ | | В этом поле указывается информация, размещаемая в мета-теге <tt>description</tt>. | ||
+ | |- | ||
+ | | '''Keywords''' | ||
+ | | В этом поле указываются ключевые слова для продвижения сайта. | ||
+ | |- | ||
+ | | '''Логотип''' | ||
+ | | В этом разделе задается графический файл в формате JPG с печатью агентства. Логотип может использоваться в разных печатных документах, например для формирования PDF-файла маршрут-квитанции и при выписке билетов в ГРС «Сирена-Трэвел». Если агентство не пользуется ГРС «Сирена-Трэвел», то логотип добавлять не обязательно. На вкладках можно задать различные логотипы для локализованной и английской версий сайта. | ||
+ | |- | ||
+ | | '''Использовать экспресс-меню при малом разрешении''' | ||
+ | | Этот флажок управляет отображением упрощенной панели перелетов в верхней части сайта для быстрого доступа к поиску нового варианта перелета. | ||
− | + | <!-- | |
− | + | Для обеспечения возможности гибкой настройки полей данной формы все блоки размещены в контейнер DIV с уникальными идентификаторами, что позволяет отредактировать видимость любых частей экспресс-формы с помощью описанных заново свойств DIV-модулей в CSS. | |
− | + | ||
− | + | Экспресс-меню также можно разместить в iFrame, ссылка для экспрес-меню в этом случае будет выглядеть следующим образом: | |
+ | <nowiki>http://<имя_ сайта>.ru/ru/express.html''</nowiki> | ||
+ | --> | ||
+ | |} | ||
− | + | === Вкладка «Таблица стилей» === | |
− | + | На этой вкладке можно задавать свойства CSS сайта по умолчанию, используя стандартные средства HTML. | |
− | + | Заданные в этом разделе свойства CSS заменяют собой свойства по умолчанию, что позволяет изменять внешний вид сайта в очень широком диапазоне. Далее приведены примеры настройки внешнего вида сайта. | |
− | + | ||
− | + | Пример изменения цвета фона кнопки и цвета текста на активной кнопке меню: | |
+ | .breadcrumbs .current { | ||
+ | background: none repeat scroll 0 0 #FF0000 !important; /* цвет фона кнопки */ | ||
+ | color: #000000 !important; /* цвет фона текста */ | ||
+ | } | ||
− | + | Пример изменения цвета фона кнопки, цвета текста и размера текста '''не'''активной кнопки меню: | |
− | + | .breadcrumbs .step { | |
− | + | border-right: 1px solid #999999; /* цвет правой границы кнопки */ | |
+ | color: #38ec52; /* цвет текста кнопки */ | ||
+ | cursor: pointer; | ||
+ | float: left; | ||
+ | font-size: 12px; /* размер шрифта */ | ||
+ | font-weight: bold; /* стиль шрифта ("жирность") */ | ||
+ | height: 30px; /* высота кнопки */ | ||
+ | line-height: 30px; | ||
+ | padding-left: 7px; | ||
+ | padding-right: 7px; | ||
+ | background: #6540ed; /* цвет фона кнопки */ | ||
+ | } | ||
− | + | Пример изменения цвета текста кнопки "Поиск вариантов": | |
+ | .ui-button { | ||
+ | color: #FF9600; | ||
+ | } | ||
− | + | Пример изменения цвета кнопки "Поиск вариантов" (изменения рисунка - укажите полный путь к вашему рисунку) | |
− | + | .ui-state-default { | |
− | + | background: url(<nowiki>"http://ibe.gridnine.com/common/galleries/images/ | |
− | + | ui-bg_highlight-hard_100_blue_1x100.png"</nowiki>); | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | Пример изменения цвета, размера и типа начертания текста заголовков на страницах с подсказками: | |
− | + | .content_dialog h4 { | |
− | + | padding: 10px 0; | |
+ | text-decoration: underline; /* подчеркивание текста */ | ||
+ | font-weight:bold; /* "жирный" шрифт */ | ||
+ | } | ||
− | + | Пример изменения цвета, размера и типа начертания основного текста на страницах с подсказками: | |
+ | .content_dialog p { | ||
+ | color: #FF0000; /* цвет текста */ | ||
+ | padding: 5px 0; | ||
+ | } | ||
− | Пример изменения цвета | + | Пример изменения цвета, размера и начертания текста списков на страницах с подсказками: |
− | + | .content_dialog li { | |
− | + | font-style:italic; /* наклонный текст */ | |
− | + | padding: 5px 0; | |
− | + | } | |
− | Пример изменения цвета | + | Пример изменения цвета ссылок: |
− | + | a:link, a:visited, a:hover { | |
− | + | color: #1200FF; | |
− | + | } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | Пример изменения цвета | + | Пример изменения цвета заголовка календаря: |
− | + | .ui-widget-header { | |
− | < | + | background: url(<nowiki>"http://ibe.gridnine.com/common/galleries/images/ |
− | + | ui-bg_highlight-hard_100_blue_1x100.png"</nowiki>) repeat-x scroll 50% 50%; | |
+ | border: 1px solid #5C5FE2; /* Цвет бордюра заголовка */ | ||
+ | color: #5C5FE2; /* Цвет текста заголовка */ | ||
+ | } | ||
− | + | Также можно добавить ссылку на внешний CSS-файл, который можно редактировать, даже не имея доступ к Менеджеру сайта, например: | |
− | < | + | <nowiki>@import "http://www.адрес_ сайта/ibecss/ibe.css"</nowiki> |
− | < | + | |
− | < | + | === Вкладка «Блоки» === |
+ | На этой вкладке редактируются блоки в верхней, правой, левой и нижней частей страницы сайта. Блоки неизменны на всех шагах бронирования. В коде можно использовать JavaScript и HTML, но не серверные скрипты. | ||
+ | |||
+ | {{ warn |Скрипты, написанные на языках, требующих их обработки со стороны сервера (Perl, PHP и аналогичные) не поддерживаются. }} | ||
+ | |||
+ | {|class="wikitable" | ||
+ | !Параметр!!Описание | ||
+ | |- | ||
+ | | Флажок '''Верхняя часть страницы''' | ||
+ | | Этот флажок управляет отображением блока, расположенного в верхней части страницы сайта. Если этот флажок установлен, верхний блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство. | ||
+ | |||
+ | В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. ''Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются.'' | ||
+ | |||
+ | Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. | ||
+ | |||
+ | На вкладках '''Русский вариант''' и '''Английский вариант''' вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. | ||
+ | |- | ||
+ | | Флажок '''Заменять переводы строки на <nowiki><br></nowiki>''' | ||
+ | | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <nowiki><br></nowiki>. | ||
+ | |||
+ | Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. | ||
+ | |- | ||
+ | | Флажок '''Левая часть страницы''' | ||
+ | | Этот флажок управляет отображением блока, расположенного в левой части страницы сайта. Если этот флажок установлен, левый блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство. | ||
+ | |||
+ | В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. ''Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются.'' | ||
+ | |||
+ | Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. | ||
+ | |||
+ | На вкладках '''Русский вариант''' и '''Английский вариант''' вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. | ||
+ | |- | ||
+ | | Флажок '''Заменять переводы строки на <nowiki><br></nowiki>''' | ||
+ | | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <nowiki><br></nowiki>. | ||
− | + | Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. | |
− | + | |- | |
− | + | | Флажок '''Правая часть страницы''' | |
− | + | | Этот флажок управляет отображением блока, расположенного в правой части страницы сайта. Если этот флажок установлен, правый блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство. | |
− | + | ||
− | + | ||
− | + | В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. ''Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются.'' | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | На вкладках '''Русский вариант''' и '''Английский вариант''' вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. | |
− | + | |- | |
− | < | + | | Флажок '''Заменять переводы строки на <nowiki><br></nowiki>''' |
− | < | + | | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <nowiki><br></nowiki>. |
− | + | Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. | |
− | + | |- | |
− | + | | Раздел '''Нижняя часть страницы''' | |
− | + | | В расположенном ниже текстовом поле вводится HTML-код блока, расположенного в нижней части страницы сайта. Это обязательный блок и его отображением управлять нельзя. Кроме того, в этом блоке обязательно должна присутствовать переменная '''${Copyright}''' — без этой переменной сохранить изменения настроек будет невозможно. | |
− | + | ||
− | + | ||
− | + | В коде можно использовать HTML, JavaScript и CSS. ''Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются.'' | |
− | + | Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. | |
− | + | На вкладках '''Русский вариант''' и '''Английский вариант''' вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. | |
− | + | |- | |
− | + | | Флажок '''Заменять переводы строки на <nowiki><br></nowiki>''' | |
+ | | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <nowiki><br></nowiki>. | ||
− | + | Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. | |
− | + | |} | |
+ | == Ссылки по теме == | ||
+ | * [[Раздел «Мое агентство»]] | ||
+ | * [[Раздел «Общие настройки»]] |
Текущая версия на 16:54, 12 мая 2017
Содержание |
[править] Вкладка «Основное»
На этой вкладке указывается заголовок сайта, логотип сайта, а также настраивается описание и ключевые слова (для SEO). В следующей таблице эти параметры описываются более подробно.
Параметр | Описание |
---|---|
Название сайта | В этом поле задается название сайта, которое отображается в заголовке окна браузера. На вкладках можно задать различные названия для локализованной и английской версий сайта. Если это русская локализация, то вкладки носят названия Русский вариант и Английский вариант позволяют задать различные названия для русской и английской версий сайта соответственно. В других локализациях название вкладки языка, отличного от английского, могут называться иначе. Вкладка для английского варианта присутствует всегда. Обязательно введите или отредактируйте текст для всех версий сайта, которые планируется использовать. |
Блок SEO | Текстовые поля в этом блоке предназначены для размещения информации для поисковой оптимизации сайта, то есть повышения позиции сайта в результатах поисковых систем, таких как Google или Yandex. |
Description | В этом поле указывается информация, размещаемая в мета-теге description. |
Keywords | В этом поле указываются ключевые слова для продвижения сайта. |
Логотип | В этом разделе задается графический файл в формате JPG с печатью агентства. Логотип может использоваться в разных печатных документах, например для формирования PDF-файла маршрут-квитанции и при выписке билетов в ГРС «Сирена-Трэвел». Если агентство не пользуется ГРС «Сирена-Трэвел», то логотип добавлять не обязательно. На вкладках можно задать различные логотипы для локализованной и английской версий сайта. |
Использовать экспресс-меню при малом разрешении | Этот флажок управляет отображением упрощенной панели перелетов в верхней части сайта для быстрого доступа к поиску нового варианта перелета. |
[править] Вкладка «Таблица стилей»
На этой вкладке можно задавать свойства CSS сайта по умолчанию, используя стандартные средства HTML.
Заданные в этом разделе свойства CSS заменяют собой свойства по умолчанию, что позволяет изменять внешний вид сайта в очень широком диапазоне. Далее приведены примеры настройки внешнего вида сайта.
Пример изменения цвета фона кнопки и цвета текста на активной кнопке меню:
.breadcrumbs .current { background: none repeat scroll 0 0 #FF0000 !important; /* цвет фона кнопки */ color: #000000 !important; /* цвет фона текста */ }
Пример изменения цвета фона кнопки, цвета текста и размера текста неактивной кнопки меню:
.breadcrumbs .step { border-right: 1px solid #999999; /* цвет правой границы кнопки */ color: #38ec52; /* цвет текста кнопки */ cursor: pointer; float: left; font-size: 12px; /* размер шрифта */ font-weight: bold; /* стиль шрифта ("жирность") */ height: 30px; /* высота кнопки */ line-height: 30px; padding-left: 7px; padding-right: 7px; background: #6540ed; /* цвет фона кнопки */ }
Пример изменения цвета текста кнопки "Поиск вариантов":
.ui-button { color: #FF9600; }
Пример изменения цвета кнопки "Поиск вариантов" (изменения рисунка - укажите полный путь к вашему рисунку)
.ui-state-default { background: url("http://ibe.gridnine.com/common/galleries/images/ ui-bg_highlight-hard_100_blue_1x100.png"); }
Пример изменения цвета, размера и типа начертания текста заголовков на страницах с подсказками:
.content_dialog h4 { padding: 10px 0; text-decoration: underline; /* подчеркивание текста */ font-weight:bold; /* "жирный" шрифт */ }
Пример изменения цвета, размера и типа начертания основного текста на страницах с подсказками:
.content_dialog p { color: #FF0000; /* цвет текста */ padding: 5px 0; }
Пример изменения цвета, размера и начертания текста списков на страницах с подсказками:
.content_dialog li { font-style:italic; /* наклонный текст */ padding: 5px 0; }
Пример изменения цвета ссылок:
a:link, a:visited, a:hover { color: #1200FF; }
Пример изменения цвета заголовка календаря:
.ui-widget-header { background: url("http://ibe.gridnine.com/common/galleries/images/ ui-bg_highlight-hard_100_blue_1x100.png") repeat-x scroll 50% 50%; border: 1px solid #5C5FE2; /* Цвет бордюра заголовка */ color: #5C5FE2; /* Цвет текста заголовка */ }
Также можно добавить ссылку на внешний CSS-файл, который можно редактировать, даже не имея доступ к Менеджеру сайта, например:
@import "http://www.адрес_ сайта/ibecss/ibe.css"
[править] Вкладка «Блоки»
На этой вкладке редактируются блоки в верхней, правой, левой и нижней частей страницы сайта. Блоки неизменны на всех шагах бронирования. В коде можно использовать JavaScript и HTML, но не серверные скрипты.
Скрипты, написанные на языках, требующих их обработки со стороны сервера (Perl, PHP и аналогичные) не поддерживаются. |
Параметр | Описание |
---|---|
Флажок Верхняя часть страницы | Этот флажок управляет отображением блока, расположенного в верхней части страницы сайта. Если этот флажок установлен, верхний блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство.
В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются. Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. На вкладках Русский вариант и Английский вариант вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. |
Флажок Заменять переводы строки на <br> | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <br>.
Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. |
Флажок Левая часть страницы | Этот флажок управляет отображением блока, расположенного в левой части страницы сайта. Если этот флажок установлен, левый блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство.
В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются. Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. На вкладках Русский вариант и Английский вариант вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. |
Флажок Заменять переводы строки на <br> | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <br>.
Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. |
Флажок Правая часть страницы | Этот флажок управляет отображением блока, расположенного в правой части страницы сайта. Если этот флажок установлен, правый блок отображается на странице сайта. Если этот флажок не установлен, блок удаляется со страницы сайта, а остальные блоки растягиваются, заполняя освободившееся пространство.
В расположенном ниже текстовом поле вводится HTML-код блока. В коде можно использовать HTML, JavaScript и CSS. Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются. Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. На вкладках Русский вариант и Английский вариант вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. |
Флажок Заменять переводы строки на <br> | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <br>.
Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. |
Раздел Нижняя часть страницы | В расположенном ниже текстовом поле вводится HTML-код блока, расположенного в нижней части страницы сайта. Это обязательный блок и его отображением управлять нельзя. Кроме того, в этом блоке обязательно должна присутствовать переменная ${Copyright} — без этой переменной сохранить изменения настроек будет невозможно.
В коде можно использовать HTML, JavaScript и CSS. Заметьте, что серверо-ориентированные скрипты, такие как Perl, PHP или CGI, не поддерживаются. Если в блоке нужно отображать рисунки и графические элементы, графические файлы следует размещать там, где они доступны из Интернета, например на собственном сайте агентства или на бесплатном хостинге. На вкладках Русский вариант и Английский вариант вводится код отдельно для русской и английской версий сайта. Обязательно введите или отредактируйте HTML-код для всех версий сайта, которые планируется использовать. |
Флажок Заменять переводы строки на <br> | Если этот флажок установлен, все переводы строки в HTML-коде блока, введенном в текстовом поле, веб-сервер на лету преобразует в тег <br>.
Устанавливайте этот флажок, если нужно, чтобы текст отображался на странице точно так же, как в текстовом поле. В противном случае при отображении в браузере все строки, не разделенные тегами будут отображаться как единый абзац текста. |