Работа с Порталом - Администрация Петрозаводского

РЕСПУБЛИКА КАРЕЛИЯ
АДМИНИСТРАЦИЯ ПЕТРОЗАВОДСКОГО ГОРОДСКОГО ОКРУГА
ПОСТАНОВЛЕНИЕ
29.11.2010
№ 3906
Об оказании информационной помощи,
технической
поддержки
организациям,
осуществляющим свою деятельность в сфере
управления многоквартирными домами
В соответствии с подпунктом "а" пункта 5 Стандарта раскрытия
информации организациями, осуществляющими свою деятельность в сфере
управления многоквартирными домами, утвержденного постановлением
Правительства Российской Федерации от 23.09.2010 № 731 (далее –
Стандарт), и в целях оказания информационной помощи, технической
поддержки организациям, осуществляющим свою деятельность в сфере
управления многоквартирными домами на основании договора,
заключенного в соответствии со статьей 162 Жилищного кодекса Российской
Федерации, на территории Петрозаводского городского округа (далее –
Управляющие организации) Администрация Петрозаводского городского
округа
ПОСТАНОВЛЯЕТ:
1.
Рекомендовать Управляющим организациям самостоятельно
размещать информацию в соответствии со Стандартом на сайте
«Управляющие организации» (uprorg.petrozavodsk-mo.ru) в сети Интернет. (в
ред.пост.от 21.09.2012 № 4473).
Информационно-аналитическому
управлению
аппарата
Администрации Петрозаводского городского округа предоставить удаленный
доступ Управляющим организациям, обратившимся в Администрацию
Петрозаводского городского округа с соответствующим заявлением для
размещения ими информации, указанной в пункте 1 настоящего
постановления. (в ред.пост.от 01.03.2013 № 813)
3.
Утвердить Инструкцию по размещению информации для
Управляющих организаций, размещающих информацию в соответствии со
Стандартом на официальном сайте Администрации Петрозаводского
городского округа в сети Интернет (прилагается).
2.
4.
Управляющим организациям, размещающим информацию,
указанную в пункте 1 настоящего постановления, на официальном сайте
Администрации Петрозаводского городского округа в сети Интернет, при
выполнении данных работ выполнять требования Инструкции, указанной в
пункте 3 настоящего постановления.
5.
Ответственным со стороны Администрации Петрозаводского
городского округа за взаимодействие с Управляющими организациями по
вопросам,
регулируемым
настоящим
постановлением,
определить
управление жилищного хозяйства комитета жилищно-коммунального
хозяйства Администрации Петрозаводского городского округа.
6.
Ответственность за достоверность, актуальность и полноту
размещаемой информации, своевременность ее размещения и обновления
несут Управляющие организации, размещающие информацию, указанную в
пункте 1 настоящего постановления, на официальном сайте Администрации
Петрозаводского городского округа в сети Интернет.
7.
Информационно-аналитическому
управлению
аппарата
Администрации Петрозаводского городского округа (С.А. Шлыкова)
опубликовать настоящее постановление в источнике официального
опубликования муниципальных правовых актов.
8.
Контроль за исполнением настоящего постановления оставляю за
собой.
Первый заместитель главы Администрации
Петрозаводского городского округа
Е.Б. Журавлев
Разослать: в дело-2, ИАУ, комитеты, нормативно-правовое управление,
аппарат, УЖХ -20, Государственный комитет Республики Карелия по
вопросам развития местного самоуправления, прокуратура г. Петрозаводска.
Примечание:
Постановлением Администрации Петрозаводского городского округа
от 02.04.2012 № 1541 действие постановления от 29.11.2010 № 3906 «Об
оказании информационной помощи, технической поддержки организациям,
осуществляющим свою деятельность в сфере управления многоквартирными
домами» распространено на товарищества собственников жилья, жилищные
кооперативы и иные специализированные потребительские кооперативы,
осуществляющие управление многоквартирным домом без заключения
договора с управляющей организацией.
УТВЕЖДЕНО
постановлением Администрации
Петрозаводского городского округа
от __29.11.2010_ № __3906____
(в ред.пост.от 21.09.2012 № 4473)
ИНСТРУКЦИЯ
по размещению информации для Управляющих организаций, размещающих
информацию в соответствии со Стандартом на сайте "Управляющие
организации" (uprorg.petrozavodsk-mo.ru) в сети Интернет
Петрозаводск
2012
Содержание
1. Основные сведения о системе ................................................................................................ 2
1.1 Что такое Webylon? ........................................................................................................................ 2
1.2 Вход в систему ................................................................................................................................. 2
1.3 Основное окно ................................................................................................................................. 2
2. Базовые возможности............................................................................................................. 4
2.1 Управление структурой разделов сайта ..................................................................................... 4
2.2 Редактирование раздела ................................................................................................................ 6
2.3 Визуальный редактор .................................................................................................................... 7
2.3.1 Работа с таблицами ................................................................................................................................... 9
2.3.2 Работа с изображением ........................................................................................................................... 10
2.3.3 Вставка ссылок ........................................................................................................................................ 12
2.4 Вкладка «Поведение» ................................................................................................................... 14
2.5 Вкладка «Планирование» ........................................................................................................... 15
2.6 Вставка файлов ............................................................................................................................. 16
2.7 Примечание по вставке файлов ................................................................................................. 17
1. Основные сведения о системе
1.1 Что такое Webylon?
Webylon CMS – это полноценная система поддержки сайтов любого уровня сложности,
разработанная в интернет-дизайн студии MediaWeb. Данная программа позволяет в полном
объеме управлять контентом сайта и наполнять его информацией.
Webylon CMS позволяет своим пользователям реализовывать все необходимые
потребности по работе с сайтом. Управление структурой, визуальный редактор, возможность
добавления прикрепленных файлов и прайс-листов, организация галерей изображений – все это и
многое другое предлагает своим пользователям система Webylon CMS.
1.2 Вход в систему
В строке адреса браузера введите адрес системы управления сайтом, как правило оно
состоит из домена Вашего сайта и «/admin», например «http://yoursite.ru/admin»
Для того, чтобы начать работу с системой поддержки, необходимо пройти авторизацию.
На заглавной странице (рис. 1) введите свои логин и пароль, и после загрузки, вы можете
приступить к работе.
Адрес системы управления и логин/пароль выдается заказчику при сдачи проекта.
Рис. 1. Внешний вид входа в систему сопровождения сайта.
1.3 Основное окно
При первом входе в систему загрузка может занять 1-2 минуты. Это требуется для
ускорения дальнейшей деятельности: в этот момент на компьютер загружаются все необходимые
для работы элементы.
После загрузки системы перед вами появится основное окно (рис. 2). Далее приведено
описание каждого из блоков и элементов, обозначенных на рисунке.
Обратите внимание, что не все из представленных ниже блоков могут быть доступны в
Вашем интерфейсе. Их наличие зависит от того, какими правами доступа Вы обладаете.
Рис. 2. Основное окно Webylon CMS.
Номер
Название
Описание
1
Основные разделы
Данное поле содержит список основных разделов
системы управления, разделы специализированного
функционала.
2
Управление
сайта
Служит для управления структурой сайта, создание
разделов сайта. Не доступные для редактирования
разделы выделены серым цветом.
3
Структура сайта
Данный блок представляет собой список разделов сайта,
созданных на сайте, в древовидной форме. Для
редактирования раздела необходимо кликнуть на
соответствующий раздел.
4
Дополнительные
функции
Содержит вкладки «История страницы» и «Отчеты»,
служащая для планирования и отслеживания изменений
страниц
5
Служебные разделы
структурой

Вид страницы
состояния страницы

Профиль – профиль оператора системы, под
аккаунтом которого, в данный момент находится
пользователь в системе.

–
отображение
Выйти – выход из системы
статус
2. Базовые возможности
2.1 Управление структурой разделов сайта
Поле для управления структурой разделов сайта находится слева от основного поля.
Внешний вид вы можете посмотреть на рис. 3
Рис. 3. Управление структурой разделов сайта
Для того чтобы создать новый раздел сайта, необходимо выбрать тот раздел, в котором вы
хотите создать новый. Для этого необходимо кликнуть на имени раздела в структуре разделов
сайта. Выбранный раздел будет выделен серым цветом (см. рис. 3).
Если необходимо создать раздел 1-го уровня, т.е. раздел, который будет выводится сразу
в левой колонке сайта, (там где «О Министерстве финансов РК», «Бюджет Республики Карелии» и
т.д.) необходимо выбрать «Содержимое сайта».
После того как вы выбрали раздел, в котором хотите создать новый раздел, нужно кликнуть
на кнопку «Создать». Перед Вами появится выбор типа страницы. По умолчанию тип страницы
устанавливается, того типа, который определен для данной структуры сайта. На рис. 3 тип «Страницы (Page)». В большинстве случаев, данный тип вам и необходим, поэтому менять тип
страницы на отличный от «По умолчанию» не рекомендуется.
Затем кликнете на «Перейти». После чего создается пустая страница, и будет находиться
в структуре сайта в выбранном разделе последним в списке (рис. 4 - на данном рисунке показан
уже созданный и наполненный раздел, при создании нового раздела данная страница будет
пустой).
Рис. 4. Вид раздела сайта для редактирования
Номер
Название
Описание
1
Вкладки
раздела
(содержимое, поведение,
планирование,
отчеты,
доступ).
На
вкладке
Содержимое
доступны
вкладки Основное, Метаданные,
Фотографии,
Файлы, Настройки.
Вкладки выбранного раздела – предназначены для
работы с содержимым данного раздела сайта.
2
Название
Название раздела сайта:
3
Визуальный редактор

Название страницы – название, выводимое
исключительно
в
системе
сайта,
и
не
отображающееся на сайте.

Метка в навигации – выводится на сайте.
Основной инструмент наполнения сайта информацией.
Его функции и внешний вид схож с MS Word
4
Сохранения/удаления
раздела
Сохранить – сохраняет изменения в системе
управления; доступен для просмотра в черновом сайте,
но на самом сайте не отображается.
Сохранить и опубликовать – сохраняются изменения и
публикуются на сайте.
Удалить с тестового сайта – удаление раздела с
чернового сайта, на сайте информация остается.
Отмена публикации – информация удаляется с сайта, но
остается в системе и на черновом сайте.
2.2 Редактирование раздела
После того как вы создадите новый раздел или кликнете по существующему, основное
поле системы примет вид показанный на рис. 4. Теперь вы можете либо наполнить раздел
информацией,
либо
отредактировать
уже
размещенную
информацию.
1.
Пишем/редактируем название раздела сайта в поле «Название
страницы», после того как вы кликните в любое место мышкой, система спросит у
вас «Изменить URL на ….». Под этим подразумевается имя HTML страницы, т.е. то
название которое будет стаять в конце адреса данной страницы в строке браузера.
Данное имя может содержать только латиницу, цифры, подчеркивания и дефисы.
Поэтому система автоматически переводит, то что вы ввели в поле «Название
страницы» в латиницу, поэтому рекомендуется всегда соглашаться с
предложенным вариантом. Если по каким-то причинам вы отказались, то написать
свое название HTML страницы можно буде во вкладке «Мета-данные».
2.
В поле «Метка навигации» пишем название раздела сайта. Для
удобства можно дублировать содержимое поля «Название страницы» и «Метка в
навигации»\
3.
Далее наполняем раздел информацией по средствам визуального
редактора. Описание Визуального редактора см. ниже.
4.
После того как, вы закончили наполнение сайта необходимо для
сохранения данных нажать «Сохранить» (рис 4), после чего все внесенные данные
сохранятся. Но на самом сайте они не будут опубликованы. Вы сможете
посмотреть как будет выглядеть на сайте ваша информация, кликнув по ссылке
«Черновой сайт» (слева внизу, рис. 4). После того как вы убедились в том, что вся
информация размещена правильно, необходимо кликнуть «Сохранить и
опубликовать», после этого Ваша информация появится на самом сайте.
5.
Вставка файлов и изображений описана далее в этом руководстве.
Примечание: Если вы уверены в том, то вся информация внесена верно, и хотите сразу
опубликовать ее на сайте, то можно сразу нажать «Сохранить и опубликовать».
6. Чтобы отменить публикацию информации на сайте кликните «Отмена публикации»
7. Для удаления раздела с сайта сначала кликните «Удалить с тестового сайта», после
чего раздел исчезнет на черновом сайте, а после этого кликнуть «Удалить с опубликованного
сайта», после чего раздел исчезнет и на самом сайте. Так же можно восстановить раздел, если он
удален
только
с
чернового
сайта,
кликнув
на
«Восстановить».
2.3 Визуальный редактор
Визуальный редактор является основным инструментом наполнения сайта информацией. Вид
визуального редактора представлен на рис. 5. Внешний вид и большинство функций схожи с
программой MS Word.
Визуальный редактор позволяет как набирать тексты в ручную, так и копировать уже
набранные тексты из Word.
Для того чтобы приступить к работе с визуальным редактором, необходимо поместить курсор
в рабочую область редактора.
Рис. 5 Визуальный редактор
Иконка
Название
Горячие
клавиши
Описание
Жирный
[Ctrl] + [B]
Выделяют фрагмент текста
жирным, курсивом, делают
подчеркнутым
[Ctrl] + [I]
Курсив
[Ctrl] + [U]
Подчеркивание
Зачеркивание
Предает тексту
зачеркнутый вид
Выравнивание
текста
по левому краю, центру,
правому, по ширине
Служат для
форматирования текста по
ширине
Применить стиль
Придает фрагменту текста
стиль, прописанный в
системе
Применить формат
Придает фрагменту текста
определенный формат,
прописанный в системе
Списки
Создание нумерованных и
не нумерованных списков
Отступы
Увеличение/уменьшение
отступов выделенного
абзаца
Блок цитаты
Выделение фрагмента
текста как Цитаты
Горизонтальная линия
Вставка горизонтальной
линии на всю ширину
экрана
Спец. символы
Вставка специальных
символов
Отменить Повторить
[Ctrl] + [Z]
[Ctrl] + [Y]
Вырезать
[Ctrl] + [X]
[Ctrl] + [C]
Копировать
Отмена последнего
действия, переход к
следующему действию
Вырезает, копирует,
вставляет выделенный
фрагмент текста
[Ctrl] + [V]
Вставить
Вставка текста
Вставка текста из блокнота
Вставка из Word
Вставка из Word
Вставить изображение
Вставка изображения в
текст
Вставить Flash
Вставка flash ролика
Вставить ссылку
Вставка ссылки на другую
страницу сайта, другой
сайт, файл для скачивания,
якорь
Удалить ссылку
Удаление ссылки с текста
Вставка/редактирование
якоря
Вставка якоря на страницу.
Примечание: якорь – метка
на странице,
предназначенная для
возможности размещения
ссылок на конкретное место
страницы сайта, где
размещен якорь.
Редактирование HTML кода
страницы
HTML-код
Выделить все
[Ctrl] + [A]
Выделение всего
содержимого в визуальном
редакторе
Включить/выключить
направляющие
невидимые элементы
Отображение невидимых
элементов, таких как
границы таблиц, если рамка
у таблицы отсутствует
Вставка/редактирование
таблицы
Вставка таблицы и
редактирование таблицы
Редактировать строку
Предназначен для
редактирования свойств
строки и ячейки
Редактировать ячейку
Вставка строки перед
Вставка строки после
Предназначен для
добавления и удаление
строк в таблице
Удаление строки
Вставить столбец перед
Вставить столбец после
Предназначен для
добавления и удаление
столбцов в таблице
Удалить столбец
Склеить ячейки
Разделить ячейки
Предназначен для
склеивания и разделения
склеенных ячеек
2.3.1 Работа с таблицами
Для того чтобы вставить таблицу необходимо либо скопировать ее из Word либо кликнув на
иконку
в панели инструментов визуального редактора. Изначально таблица появится в визуальном
редакторе в произвольном виде, не соответствующим общему стилю сайта. Для того чтобы привести таблицу к
стилю сайта необходимо поставить курсор в любое место таблицы и кликнуть на иконку
. Перед Вами
откроется окно редактирования таблицы (рис. 6)
Рис. 6. Редактирование таблицы.
В данном окне можно задать кол-во ячеек, строк, фиксированную ширину, толщину рамки
(граница), выравнивание и т.д. Во вкладке «Дополнительно» можно задать цвет фона, цвет рамки, и
т.д. Для того чтобы придать таблице стиль сайта, необходимо в поле «Класс» выбрать «tab-style» и
нажать «Вставить».
После чего таблица примет фон, цвет рамок и отступы, предусмотренные дизайном сайта. Для того
чтобы выделить заголовок таблицы, разместите курсор в строку, которая будет являться заголовком
и кликните на иконку «Редактировать строку». В появившемся окошке в поле «Строка в части
таблицы» выберете «Верхняя часть таблицы» и нажмите «Вставить».
После чего таблица примет вид в соответствии с дизайном сайта (рис. 7).
Рис. 7 Таблица
2.3.2 Работа с изображением
Для того чтобы разместить загруженное изображение в визуальном редакторе необходимо:
1. Поставить курсор в место, куда вы хотите разместить изображение в рабочем поле визуального
редактора.
2. Кликнуть на иконку
(Вставка изображение), на панели инструментов визуального редактора, после чего
справа откроется поле вставки изображения (рис. 8).
Рис. 8. Вставка изображения
3. В поле «папка» выбрать папку, в которой находится ваше изображение или в поле «Искать по
имени файла» вписать имя файла. Примечание: создание папок и загрузка изображений происходит
автоматически по именам разделов в которые они загружаются.
4. Содержимое выбранной папки или результатов поиска появится под строкой поиска.
5. Найдите изображение, которое хотите разместить или загрузите новое. После этого кликнете по
нему.
6. В нижней части поля появится размеры загружаемого изображения, при желании данные размеры
можно изменить.
Примечание. Желательно изменять размеры изображений и проводить другие работы с
изображениями в любом отдельном графическом редакторе (Photoshop, Microsoft Photo
Editor и др.)
7. В поле выравнивание/стиль, выбираете вид обтекания текстом изображения.
8. Кликните на кнопку «Вставить изображ.».
Редактирование изображения
1. Выделите изображение в визуальном редакторе.
2. Кликните на иконку
(Вставка изображение), на панели инструментов визуального редактора. В
появившимся справа окне, внесите изменения и кликните «Вставить изображен.».
2.3.3 Вставка ссылок
Для того чтобы разместит ссылку на другой сайт, страницу вашего сайта или на файл для скачивания
необходимо:
1. Выделить фрагмент текста, который будет являться ссылкой.
2. Кликните на иконку
(вставить ссылку) на панели инструментов визуального редактора,
после чего откроется окно справа от визуального редактора (рис. 9).
Рис. 9. Вставка ссылок
3. Для того чтобы размесить ссылку на страницу вашего сайт необходимо:

Выбрать в блоке «Ссылка на» - «Страницу данного сайта» (рис. 9).

В выпадающем списке «Страница» выберите страницу, на которую будет вести ссылка.

Для того чтобы данная ссылка открылась в новом окне, поставте галочку «открыть ссылку в
новом окне?».

Кликните на «Вставить ссылку».
4. Для того чтобы размесить ссылку на другой сайт (рис. 10) необходимо:

Выбрать в блоке «Ссылка на» - «Другой сайт»

В поле «URL» впишите адрес сайта, на который будет вести ссылка.

Для того чтобы данная ссылка открылась в новом окне, поставте галочку «открыть ссылку в
новом окне?».

Кликните на «Вставить ссылку».
Рис. 10. ссылка на другой сайт
5. Вставка ссылки на скачивание файла описана в разделе 2.6.
2.4 Вкладка «Поведение»
Данная вкладка предназначена для назначения свойств раздела сайта (рис.
12).
Рис. 12. Вкладка «Поведение»
Название
Описание
Тип страниц
Определяет тип страницы в структуре сайта. Назначается
автоматически в зависимости от типа раздела, в котором
страница создается.
Page location

Раздел – страница имеет вложенные страницы

Страница – страница не имеет вложенности
Вложенность в раздел
Служит для определения того, в каком разделе будет
находится данная страница, дублирует функцию
перетаскивания мышкой
Показывать в меню?
Если галочка не установлена, то данная страница не
будет выводиться в структуре сайта, но на нее можно
поставить ссылку
Показывать в поиске
Если галочка не установлена, то данная страница будет
не доступна для поиска и не будет выводиться по
поисковым запросам
Автоматически скрывать
поддокумент если нет
своего содержимого
Если галочка установлена, то в случае если у данной
страницы (раздела) нет наполнения, то при клике на эту
страницу (раздел) на сайте, будет открываться первая
вложенная страница (подраздел) данного раздела.
2.5 Вкладка «Планирование»
Вы можете использовать эту вкладку для отслеживания запланированных изменений в содержимом
вашего сайта. Чтобы просмотреть все запланированные изменения на ваших страницах, откройте
слева окно «Отчеты сайта» и выберите «Запланировано» (рис. 13).
Рис. 13. Вкладка «Планирование»
2.6 Вставка файлов
Рис. 14. Вкладка Файлы
Загрузка файла на сервер:
1. перейти на вкладку Файлы редактора документа
2. Нажать кнопку «Добавить файлы»
3. В диалоговом окне выбрать файл или несколько на компьютере
4. Нажать кнопку Upload
5. Внизу страницы нажать «Сохранить и опубликовать»
Данные файлы будут привязаны к выбранному разделу, но могут использоваться и в других.
Вставка файла в визуальном редакторе описана в разделе о вставке ссылок. Для вставки файла в
визуальном редакторе необходимо:
1. Выделить текст, с которого будет создана ссылка на файл
2. Нажать кнопку «Вставить ссылку»
3. В диалоговом окне справа выбрать пункт «Скачивание файлов»
4. В списке «Страница» выбрать необходимый файл. По умолчанию откроется папка файловой
библиотеки соответствующая разделу. Если этого не произошло — см. раздел 2.7.
2.7 Примечание по вставке файлов
В случае, когда при вставке файлов, связанная с документом папка не открылась (как правило при
первом входе в систему) — отображается страница с корневой структурой файловой библиотеки.
Необходимо провести одно из следующих действий:

Обновить страницу нажатием соответствующей кнопки браузера или кнопки F5.

Нажать на ссылку «Содержимое сайта».
При любом варианте необходимо сохранить данные страницы до одного из этих действий.
Рис. 15. Структура файловой библиотеки
ИНСТРУКЦИЯ
по размещению информации для Управляющих организаций, размещающих
информацию в соответствии со Стандартом на официальном сайте
Администрации Петрозаводского городского округа в сети Интернет
Петрозаводск
2010
Работа с Порталом
Официальный сайт Администрации Петрозаводского городского округа (далее –
Портал) доступен в всемирной сети Интернет по адресу:
http://portal.petrozavodsk-mo.ru/
Настоящая инструкция описывает методику работы по созданию содержания Портала
(контента) – создание статей, подлежащих публикации на страницах Портала и их привязка к
структуре Портала.
Для клиентского места конечного пользователя Портала необходимо программное
обеспечение (браузер):
Microsoft Internet Explorer версии 6.0 и выше
Для начала работы по созданию контента пользователю необходимо получить доступ к
административной консоли Портала.
Административная консоль портала доступна по адресу:
http://portal.petrozavodsk-mo.ru/admin/
Откройте в браузере (Internet Explorer) этот адрес и введите полученные от
администратора Портала данные Вашей учетной записи (логин и пароль).
Работа с контентом
Информация, размещаемая на страницах, называется контентом. Для хранения
контента в системе отводится специальная папка, которая стандартно называется «Контент»
(при желании можно назвать иначе). В ней хранятся статьи сайта, изображения,
размещаемые на страницах портала, каскадные таблицы стилей, другие объекты файловой
системы.
Внешний вид библиотеки «Контент» приведен на Рис. 1.
Рис. 1. Библиотека «Контент».
Подготовка статей. Работа в HTML – редакторе
Для создания или редактирования статьи и подготовке ее к публикации нужно выбрать
на панели ресурсов папку библиотеки «Контент», в которой находится статья для
редактирования и щелкнуть на иконке
статей на панели объектов
в строке, содержащей нужную статью в списке
Форма редактирования текста статьи представлена на Рис. 2.
Рис. 2. Форма редактирования статьи.
Описание полей формы редактирования статьи представлено в Таб. 1.
Таб. 1. Описание полей формы редактирования статьи.
Название
Описание
Заголовок
Заголовок статьи.
Текст статьи
Текст статьи. Вы можете редактировать текст (тело) статьи с
помощью встроенного редактора или копировать его из других
приложений
(например, MS
Word),
используя операции
«Копировать» и «Вставить».
Публиковать
Флаг, определяющий допущена статья к публикации или нет.
Резюме
Резюме статьи.
Дата
Дата создания статьи.
Рис. 3. Панель HTML-редактора.
Ниже описаны все операции, которые можно выполнить с помощью HTML-редактора.
Вырезать, копировать, вставить
В редакторе предусмотрены операции по работе с буфером обмена, аналогичные
операциям MS Office:
Вырезать – выделите часть текста и нажмите кнопку
фрагмент будет перенесен из тела статьи в буфер обмена.
. При этом выделенный
Копировать – выделите часть текста и нажмите кнопку
фрагмент будет скопирован в буфер обмена.
. При этом выделенный
Вставить – установите курсор в позицию, в которую должен быть вставлен
фрагмент, помещенный ранее в буфер обмена, и нажмите кнопку
.
Вставить как текст
– аналогично операции «Вставить», рекомендуется
использовать при копировании текста из MS Word. Размещает текст из буфера обмена в
позицию, выбранную курсором, полностью удалив форматирование.
Вставить из Word
– аналогично операции «Вставить», рекомендуется
использовать при копировании текста из MS Word, если форматирование должно быть
сохранено.
Отправка на печать
Для того, чтобы распечатать текст статьи, следует нажать на кнопку
статья будет отправлена на принтер, установленный по умолчанию.
. После этого
Проверка грамматики
Кнопка
запускает функцию поиска грамматических ошибок в тексте статьи.
Найти
Для поиска фрагмента текста нажмите кнопку «Найти»
, появится окно, показанное
на Рис. 4. Введите в поле «Найти» искомый текст (или слово), при необходимости отметьте
флажками поля «Только слово целиком» и «Учитывать регистр», задайте направление
поиска в поле «Направление» (стандартно выбрано «вниз»).
Рис. 4. Форма поиска фрагмента текста.
Отменить, вернуть
Для отмены последней выполненной команды нажмите кнопку «Отменить»
Кнопка «Вернуть»
.
выполняет отмену действия последней команды «Отменить».
Выделить все
Для выделения всего текста и графики в теле редактируемой статьи нажмите кнопку
«Выделить все»
.
Удалить формат
После копирования текста из MS Word с сохранением форматирования для удаления
форматирования во всем теле статьи нажмите кнопку «Удалить формат»
.
Вставка ссылок
Под ссылкой в системе понимается URL, который может быть размещен в теле статьи.
В статью можно вставлять ссылки следующих типов:
внешняя ссылка (гиперссылка);
ссылка на файл;
Для вставки ссылки нужно в редакторе статьи выделить часть текста, которая должна
быть ссылкой, и щелкнуть мышкой на кнопке «Создать ссылку»
окно вставки ссылки (см. Рис. 5).
, после чего появится
Рис. 5. Вставка ссылки.
После вставки ссылки текст, к которому приписана ссылка, выделяется цветом и
подчеркиванием. В тексте статьи появится следующий HTML-код:
<A href=”____”>выделенный текст</A>.
Создаваемая ссылка на сайте может быть открыта как в новом, так и в текущем окне.
Чтобы определить способ открытия ссылки, выберите нужный вариант в выпадающем окне
ячейки «Размещение» (Target). Возможные варианты открытия ссылки приведены в Таб. 2.
При выборе типа открытия ссылки в текст статьи добавляется target=_размещение (в
зависимости от типа ссылки). В результате выделенный текст будет обрамляться
следующими тегами: <A href="_________" target=_размещение>выделенный текст </A>.
Таб. 2. Описание полей окна вставки ссылки.
Тип ссылки
Новое
(_blank)
Описание полей
окно
Открытие ссылки в новом окне. target=_blank
Родительское
(_parent)
Открытие ссылки в родительском окне (если страница сайта имеет
фреймовую структуру). target=_parent
Текущее (_self)
Открытие ссылки в текущем окне. target=_self
Тип ссылки
Описание полей
Самое
(_top)
Открытие ссылки в самом верхнем окне (если страница сайта имеет
фреймовую структуру). target=_top
верхнее
В ячейке «Название» вводится название, которое будет проставляться в заголовке
открываемого окна. В тексте статьи появится следующий HTML-код: <A title=Заголовок
href="ссылка" target=_размещение>выделенный текст </A>.
Для удаления ссылки необходимо выделить текст со ссылкой и щелкнуть мышкой на
кнопке «Удалить ссылку»
.
Внешняя ссылка
Для размещения ссылки на внешний веб-сайт необходимо в ячейке URL окна вставки
ссылки указать адрес, на который должен осуществляться переход при клике на ссылку.
Адрес
должен
http://www.andproject.ru).
указываться
в
формате
http://_______
(например,
В результате выделенный текст будет обрамляться следующими тегами: <A
href="http://______">выделенный текст </A>.
Ссылка на файл
Под файлом в Системе понимается документ любого формата, размещенный в
файловой системе, ссылка на который может быть опубликована на странице сайта в теле
статьи.
Для размещения ссылки на файл необходимо в окне вставки ссылки (Link – web page
dialog) щелкнуть на кнопку «Просмотр» (Browse) и выбрать в открывшемся окне навигатора
нужный файл:
Установив курсор на нужный файл, нажмите кнопку «Открыть» (Open), после чего
путь к файлу отобразится в поле «Файл» окна вставки ссылки. Щелкните на кнопку
«Отправить на сервер», затем на кнопку «ОК».
Важно!
Имя файла может содержать только символы латинского алфавита, стандартные
европейские цифры – 0,1,2,…, а также знаки подчеркивания "_", дефис "-".
Не допускаются символы кириллицы, пробелы и остальные символы, не указанные
выше.
В наименовании файла необходимо соблюдать следующий формат –
"xxx_yyy_name.raz", где
xxx - краткое (сокращенное до 3-5 символов) наименование Вашей организации
(подразделения);
yyy – текущая дата (4-8 символов);
name - краткое (сокращенное до 4-8 символов) название документа, содержащегося в
файле;
raz – расширение файла, например doc для файлов формата Microsoft Word, pdf –
текстовые файлы Adobe Reader и т.д.
В результате выделенный текст будет обрамляться следующими тегами: <A href="/путь
к файлу" target=_размещение>выделенный текст </A>.
Вставка изображений
Для вставки изображения в статью, нужно в редакторе статьи установить текстовый
курсор в то место статьи, куда Вы хотите поместить изображение, и щелкнуть мышкой на
иконке «Вставить изображение»
6).
, после чего появится окно выбора изображения (см. Рис.
Рис. 6. Вставка изображения.
Действия по выбору и вставке изображения аналогичны вставке ссылки на файл.
Дополнительно можно задать следующие параметры (см. Таб. 3):
Таб. 3. Описание полей окна вставки изображения.
Параметр
Описание
Альтернативный текст
Текст, всплывающий радом с картинкой при наведении на нее
курсора мыши.
Width
Ширина изображения в пикселях.
Height
Высота изображения в пикселях.
Сохранять пропорцию
Сохранение пропорций изображения при изменении одного из
параметров
Border
Толщина линии границы в пикселях
HSpace
Отступ по горизонтали
Параметр
Описание
VSpace
Отступ по вертикали
Align
Выравнивание изображения по горизонтали
Выбрав файл с изображением и определив необходимые параметры, нажмите на
кнопку «Отправить на сервер» для загрузки изображения на сервер, затем нажмите кнопку
«OK».
В результате, перед местом расположения курсора мыши в HTML-источнике
помещается строчка:
<IMG height=высота alt=альтернативный текст hspace= _____ src=”/путь к рисунку”
width=______ align=выравнивание vspace=___ border =толщина>
Вставка таблицы
Для вставки таблицы в статью нужно в редакторе статьи установить текстовый курсор
в то место статьи, куда Вы хотите поместить таблицу, и щелкнуть мышкой на иконке
«Добавить таблицу»
.
В появившемся окне свойств таблицы (см. Рис. 7) введите число строк и столбцов
таблицы. В поле «Параметры таблицы» можно ввести параметры таблицы и в поле
«Параметры ячеек» –ячеек. Поле «Заголовок» позволяет задать название таблицы, которое
будет располагаться в верхнем правом углу над таблицей.
Рис. 7. Окно вставки таблицы.
По умолчанию создается таблица размером 3 на 2 шириной 200 пикселей с рамкой
толщиной в 1 пиксель.
Для изменения таблицы или определенной ячейки установите курсор в ячейку и
щелкните правой кнопкой мыши. Появится меню редактирования таблицы в котором можно
выбрать опции удаления и вставки строки, столбца или ячейки, разбиения ячейки, слияния
ячеек (если выделено несколько ячеек таблицы) и редактирования свойств всей таблицы или
ячейки, в которой установлен курсор (см. Рис. 8). Работа с этими функциями аналогична
функциям работы с таблицей в MS Word.
Рис. 8. Меню работы с таблицей.
Для редактирования свойств ячейки выберите в меню функцию «Свойства ячейки».
Появится окно «Свойства ячейки» (см. Рис. 9).
Рис. 9. Окно редактирования свойств ячейки.
Описание атрибутов ячейки, которые можно редактировать в этой форме, даны в Таб. .4
Таб. 4. Описание атрибутов ячейки.
Название
Описание
Ширина
Ширина ячейки (в пикселях или процентах).
Высота
Высота ячейки (в пикселях или процентах).
Перенос слов
Определяет перенос слов в ячейке
Гориз. выравнивание
Горизонтальное выравнивание текста в ячейке.
Верт. выравнивание
Вертикальное выравнивание текста в ячейке
Между строками
Ширина разделяющей линии между строками
Между столбцами
Ширина разделяющей линии между столбцами
Цвет фона
Цвет фона таблицы.
Цвет границ
Цвет рамки.
Название
Описание
Class name
Выбор стиля шрифта в таблице
Для задания свойств таблицы выберите в меню работы таблицы операцию свойства
таблицы или выделите всю таблицу и нажмите правую кнопку мыши. Появится окно,
приведенное на Рис. 10.
Рис. 10. Меню редактирования таблицы.
При выборе функции «Свойства таблицы» (Table Properties) появится окно,
приведенное на Рис. 11, при этом значения в окнах «Строки» (Rows) и «Столбцы» (Columns)
соответствуют количеству строк и столбцов выделенной таблицы и являются не
редактируемыми.
Рис. 11. Окно редактирования свойств таблицы.
Описание атрибутов таблицы, которые можно редактировать в этой форме, даны в Таб.
11.
Таб. 5. Описание атрибутов таблицы.
Название
Описание
Ширина
Ширина таблицы (в пикселях или процентах).
Высота
Высота таблицы (в пикселях или процентах)
Размер границы
Толщина границы в пикселях
Выравнивание
Горизонтальное выравнивание таблицы.
Между ячейками
Расстояние между ячейками (в пикселях).
Поля ячеек
Размер полей ячеек
Заголовок
Заголовок таблицы
Вставить горизонтальную линию
Для размещения горизонтальной линии нажмите кнопку «Вставить горизонтальную
линию»
, что будет соответствовать размещению в HTML-источнике строки <HR>.
Вставка специального символа
Нажатие на кнопку вставки специального символа
приводит к открытию окна
«Специальные символы» (см. Рис. 12). Наведение курсора на символ в окне приводит к его
укрупненному отображению в окошке просмотра (правый верхний угол окна). Щелчок по
нужному символу приведет к его вставке в теле статьи в позиции, где был установлен курсор
до нажатия кнопки.
Рис. 12. Окно выбора специального символа.
В HTML-источнике эти действия аналогичны размещению символа.
Изменение гарнитуры текста
Для изменения гарнитуры текста выделите нужную часть текста и щелкните мышкой
по одной из иконок:
– «Полужирный»,
– «Надстрочный»,
выделенному тексту.
– «Курсив»,
–
– «Подчеркнутый»,
– «Перечеркнутый»,
«Подстрочный». Эта операция применяется только к
В HTML-источнике выделенный текст обрамляется тегами <strong> </strong>, <em>
</em>, <u> </u>, <strike> </strike>, <sup> </sup> и <sub> </sub> для полужирного, курсива,
подчеркнутого, перечеркнутого, надстрочного и подстрочного текста соответственно. Для
удаления форматирования нужно выделить текст и повторно щелкнуть мышкой
соответствующую иконку.
Изменение цвета текста и фона
Для изменения цвета текста выделите нужную часть текста и щелкните мышкой по
иконке
. В появившемся диалоговом окне «Выбор цвета» («Color») выберите нужный Вам
цвет текста (см. Рис. 13). Эта операция применяется к выделенному тексту.
Рис. 13. Выбор цвета текста.
При этом в HTML-источнике выделенный текст обрамляется тегами <font color=..>
</font>.
Аналогично устанавливается цвет фона выделенного фрагмента текста при нажатии на
иконку
– «Цвет фона».
Создание списков
Для создания списка выделите нужные абзацы и щелкните мышкой по одной из
иконок:
– «Нумерация» или
выделенным абзацам.
– «Маркеры» (см. Рис. 14). Эта операция применяется к
Рис. 14. Создание списков.
При этом в HTML-источнике
выделенные
<ol><li>…</li>…<li>…</li></ol> для нумерованного
<li>…</li></ul> для маркированного списка.
абзацы
списка
обрамляются тегами
и <ul><li>…</li>…
Выравнивание текста абзаца
Для выравнивания текста установите курсор на абзаце и щелкните мышкой по одной из
иконок:
– «По левому краю»,
ширине» (см. рис. 14).
– «По центру»,
– «По правому краю»,
– «По
В HTML-источнике абзац обрамляется тегами <p align=left> </p>, <p align=center> </p>,
<p align=right> </p> и <P align=justify> </p> для выравнивания по левому краю, по центру, по
правому краю и по ширине соответственно.
Уменьшение и увеличение отступа абзаца
Для уменьшения или увеличения отступа поместите курсор на нужный абзац и
щелкните мышкой по одной из иконок:
– «Уменьшение отступа» или
отступа». Эта операция применяется к выделенному абзацу.
–«Увеличение
При этом перед выделенным абзацем в HTML-источнике помещается строчка:
<BLOCKQUOTE style="MARGIN-RIGHT: 0px">.
Границы таблиц
Включение/выключение разметки таблицы производится с помощью кнопки
удобно использовать тогда, когда у таблицы ширина границ равняется нулю.
. Этот режим
Стиль
Задание стиля позволяет применить к выделенному тексту предопределенных
параметров форматирования. Выделите фрагмент текста и выберите в выпадающем списке
необходимый стиль (см. Рис. 15).
Рис. 15. Задание стиля для фрагмента текста.
В HTML-источнике помещается строка <FONT class=стиль> текст </FONT>
Формат
Данная операция позволяет определить стиль для всего абзаца, в котором установлен
курсор. Выбор формата происходит в выпадающем окне (см. Рис. 16).
Рис. 16. Задание формата.
Шрифт
Выделите необходимый текст и задайте шрифт в поле «Шрифт», выбрав его в
выпадающем окне (см. Рис. 17). Либо установите курсор в позицию, определите шрифт и
введите текст, отображение которого будет происходить в соответствии с выбранным
шрифтом.
Рис. 17. Задание шрифта.
В HTML-источнике
face=”шрифт”> </FONT>
перед
выделенным
текстом
появится
строка
<FONT
Изменение размера шрифта
Для изменения размера шрифта выделите часть текста и выберите из выпадающего
меню «Размер шрифта» нужный Вам размер шрифта (см. Рис. 18). Эта операция применяется
только к выделенному тексту.
Рис. 18. Изменение размера шрифта выделенного текста.
При этом в HTML-источнике выделенный текст обрамляется тегами <font size=..>
</font>.
Масштаб
Выберите нужное значение масштаба в выпадающем окне (см. Рис. 19), которое
позволяет в соответствии с выбранным значением увеличить или уменьшить изображение
тела статьи.
Рис. 19. Изменение масштаба изображения тела статьи.
Переключение в режим редактирования HTML
Для переключения в режим редактирования в кодах HTML в редакторе статьи нужно
поставить флажок «Разметка» в панели с кнопками (см. Рис. 20).
Рис. 20 Переключение в режим работы с HTML-источником.
После переключения в режим редактирования HTML в поле редактирования текста
статьи появиться HTML-источник для данной статьи. Переключение в обычный режим
редактирования осуществляется снятием флажка в ячейке «Разметка».
Специальные знаки
Кнопка
предназначена для отображения непечатаемых символов, как знаки абзацев,
переносов и т.д.
Кнопки создания и редактирования форм
HTML – редактор предоставляет возможности создания и редактирования форм. Эти
функции реализуются с помощью ряда кнопок. Их описание приведено в Таб. 6.
Таб. 6. Кнопки, используемые в HTML – редакторе.
Кнопка
Назначение
Создание формы
Кнопка множественного выбора
Кнопка единичного выбора «Да»/«Нет»
Создание поля ввода типа «Текст» или «Логин»
Создание текстового поля
Создание кнопки с названием
Скрытое поле ввода
Общие навыки работы с дизайном
Работа с изображениями
Графические файлы, содержащие изображения, предназначенные для размещения на
страницах портала, хранятся в файловой системе. Ссылки на них размещены в папке
«Изображения». Чтобы поместить в эту папку ссылку на новое изображение, необходимо
создать в ней новый объект. Форма создания нового объекта приведена на Рис. 21.
Рис. 21. Форма создания/редактирования объекта.
Описание полей данной формы приведено в Таб. 7.
Таб. 7. Описание полей формы создания объекта файловой системы.
Поле
Описание
Название
Имя файла в системе. Если данное поле не заполнить, то
имя файла будет таким же, как и имя файла, на который
выбрана ссылка. Если есть необходимость задать имя
файла, то в данном поле необходимо ввести его с
расширением, например «picture.gif».
Родитель
Выбор родительской папки для хранения изображения
Файл
В данном поле можно выбрать нужный файл с помощью
навигатора.