Уроки по созданию сайта. Административная страница сайта. Первичное наполнение сайта. Как создать сайт в Интернете без знания web-технологий. Программа для создания личных и бизнес-сайтов.

Уроки По Созданию Сайта, Используя Конструктор Сайтов e-gloryon

Урок 3. Редактор сайта. Как с ним работать.

Автор: Марина Метель
http://design.bizlive.ru

Входим в режим редактирования сайта http://bizlive.ru/form/enter.php , вводим логин и пароль, попадаем на административную страницу управления сайтом. Нажимаем кнопку "Редактировать сайт":

Визуальный редактор - это средство управления информацией, устроен по принципу WYSIWYG – от абревиатуры английского словосочетания What You See Is What You Get (что видишь, то и получаешь). Условно его можно разделить на три части:

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

2. строка состояния - расположена сразу под панелью инструментов. В левой её части находится ссылка «Адм.стр.», которая позволяет вернуться на главную страницу системы управления сайтом. В правой – ссылка «Выход» для безопасного завершения редактирования:

3. собственно сайт - сайт выглядит так, как его будут видеть посетители, только для них не будут видны иконки управления и редактирования сайтом:

Теперь более подробно рассмотрим каждую часть Редактора сайта

1. Панель инструментов

Кнопки на этой панели включают различные режимы работы редактора WYSIWYG. Теперь подробно о каждой кнопке:

В начало - эта ссылка предназначена для перехода на стартовую (заглавную) страницу сайта;

Просмотр - переключает редактор из режима редактирования в режим просмотра;

Изменение - переключает редактор из режима просмотра в режим редактирования;

Отменить - отменяет последнее действие, произведённое с помощью редактора;

Реклама - открывает окна для рекламных частей сайта;

Настройки - эта ссылка вызывает окно редактирования основных настроек сайта: языки, авторизация, статистика, права доступа, поиск, кнопки;

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

Карта сайта - эта ссылка открывает список всех страниц сайта с возможностью управления их порядком и отображением в меню;

Выбрать дизайн - эта ссылка вызывает "Мастер выбора оформления сайта";

Изменить дизайн - эта ссылка вызывает СкинМашину. СкинМашина - это программа, с помощью которой Вы сможете самостоятельно изменить дизайн сайта;

Легенда - открывает окно с расшифровкой условных обозначений, используемых в Конструкторе сайта.

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

2. строка состояния

Адм.стр. - это ссылка выхода из редактора на первую страницу Системы управления сайтом (административную страницу);

Редактирование сайта - название используемого в настоящий момент инструмента системы управления;

админ - эта ссылка содержит имя пользователя, который работает с Конструктором сайта. «Админ» - сокращение от сочетания «Администратор сайта». Для того чтобы войти в Систему управления под другим именем, достаточно нажать на этой ссылке левой кнопкой мышки;

demofree.e-gloryon.com - адрес (URL)Вашего сайта;

Выход - эта ссылка завершает работу пользователя в Системе управления сайтом. И открывает сайт в новом окне.

3. Сайт

В режиме WYSIWYG - редактора сайт выглядит как обычно, только рядом с любым элементом находится специальная иконка. Если нажать на такую иконку, то появляется окно редактирования этого элемента (см. "Легенда").

Принцип работы редактора сайта

Любой сайт состоит из какого-то количества страниц.

Страницы, в свою очередь, состоят из разделов.

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

Вы можете создать на своём сайте любое количество страниц, а на каждой странице - любое количество разделов.

В свою очередь, каждый раздел состоит из различных объектов (товар, услуга, новость)

Например, лента новостей состоит из множества новостей, раздел "Вакансии" из списка вакансий, а прайс-лист из отдельных товаров или услуг.

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

красные иконки - для редактирования страниц;

желтые иконки - для редактирования разделов;

зеленые иконки - для редактирования записей;

синяя иконка - редактирование системных элементов;

серая иконка - для редактирования текста;

иконка с изображением пейзажа - для редактирования изображений.

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

Нам откроется редактор страницы:

Заполняем "Заголовок страницы", "Заголовок окна браузера", "Заголовок сайта". Теперь нажимаем "HTML-редактор", откроется новое окно. В это окно копируем подготовленный в word текст или набираем его здесь же. Редактирование текста происходит по принципу работы в word. Чтобы сохранить запись в левом верхнем углу нажимаем иконку в виде дискеты.

Обратите внимание! Чтобы работать в окнах редактирования, необходимо убрать блокировку всплывающих окон, если таковая на вашем конструкторе установлена, или разрешить всплывающие окна для этого объекта.

Внизу каждого "окна редактирования" находятся несколько кнопок, одну из которых по окончании редактирования следует нажать:

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

Если вы ошиблись при редактировании сайта, например ошибочно удалили какую-то информацию, то вы можете отменить последнее действие нажав на кнопку "Отменить" на панели инструментов.

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

Откроется окно редактирования выбранного элемента:

1 Статусная строка. Содержит название редактируемого элемента.

2 Область управления окном редактора. Содержит элементы, управляющие состоянием окна редактора: вызвать справку и закрыть окно редактора.

3 Область закладок. Содержит закладки, где атрибуты редактируемого элемента сгруппированы по определенным признакам.

4 Область редактирования свойств. Содержит поля, где можно изменить свойства редактируемого элемента.

5 Вызов HTML-редактора. Загружает окно специализированного HTML-редактора.

6 Управляющие элементы. Задают тип управляющего действия над элементом.

Работа в окне редактирования элемента

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

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

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

Внимание: при закрытии окна редактирования все внесенные изменения не сохраняются, если не была нажата кнопка "Применить"!

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

Переключение закладок

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

Редактирование параметров элемента

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

HTML-редактор

Для создания нестандартно оформленных элементов можно воспользоваться встроенным HTML-редактором. Он имеет традиционный для всех офисных программ интерфейс пользователя.

Для вызова HTML-редактора нужно нажать левой кнопкой мышки иконку рядом с полем для редактирования текста

Откроется окно редактирования текста:

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

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

Не забудьте сохранить изменения.