Редактор HTML документов MyEditor.
Руководство пользователя.
Редактор позволяет в достаточно удобной форме создавать, редактировать, сохранять HTML-документы. Для повышения удобства работы, теги языка HTML и их аргументы выделяются цветом, на фоне основного текста. Также имеется набор дополнительных функций, облегчающих редактирование, таких как вставка таблицы, строки или столбца таблицы, вставка изображения. MyEditor позволяет также создавать проект сайта по шаблону.
Скачать редактор можно здесь
Главное окно редактора разделено на две части (рисунок 1). Первая часть, более узкая, находится в левой части экрана. Она представляет собой список тегов языка HTML с их аргументами. Вторая часть, более широкая, является окном редактирования документа. Именно здесь отображается содержимое созданных или загруженных документов. Из рисунка 1 видно, что редактор MyEditor также имеет меню и панель инструментов.
Рисунок 1 - главное окно редактора.
Ввод тегов HTML при редактировании может осуществляться несколькими способами:
- Ввод тега вручную в окне редактора.
- Копирование из другого документа (Ctrl+C, Ctrl+V).
- Ввод тега с помощью редактора.
Первые два способа тривиальны. Рассмотрим подробнее третий способ. Для того, чтобы ввести тег с помощью редактора необходимо:
- Установить курсор в нужное место документа.
- Найти соответствующий тег в списке слева (список отсортирован в алфавитном порядке).
- Выполнить двойной щелчок левой кнопкой мыши на выбранном теге. При этом тег будет вставлен в документ, а в левой части окна, под тегом отобразится список его аргументов.
Вставка аргументов выполняется аналогично.
Панель инструментов редактора MyEditor состоит из 10 кнопок. Слева направо: Создать новый документ, Открыть документ, Сохранить документ, Найти, Обновить цвета, Вставить таблицу, Вставить строку (таблицы), Вставить столбец (таблицы), Вставить изображение, Просмотр в броузере (предпросмотр страницы).
Функционально, панель инструментов дублирует часть пунктов меню редактора.
Главное меню редактора содержит следующие пункты: Файл, Правка, Вид, Вставка, Проект, Сервис (рисунок 1). Рассмотрим меню подробнее.
Файл
Меню Файл предназначено для выполнения основных операций с файлами: создание нового файла, открытие существующего файла, сохранение редактированного файла (рисунок 2).
Рисунок 2 - меню Файл.
Кратко рассмотрим подпункты этого меню.
Новый
При выборе данного пункта будет создан новый документ. При этом все несохраненные данные будут потеряны. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Открыть
При выборе данного пункта, будет вызван стандартный диалог открытия файла. После указания файла на диске, который необходимо открыть, его содержимое отобразится в окне редактирования. В момент открытия документа все несохраненные данные будут потеряны. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Сохранить
Данный пункт позволяет сохранить редактируемый документ. Если документ не был сохранен до выбора данного пункта, то будет вызван диалог сохранения файла на диск. В случае, если файл уже был сохранен, то он будет перезаписан с тем же именем. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Сохранить как
При выборе данного пункта, будет вызван стандартный диалог сохранения файла. После указания имени файла и его местоположения, файл будет сохранен.
Выход
При выборе осуществляется выход из программы. При этом, несохраненные данные будут потеряны.
Правка
Меню Правка предназначено для выполнения основных операций с текстом документа, таких как копирование, вставка, удаление фрагментов (рисунок 3).
Рисунок 3 - меню Правка.
Рассмотрим подпункты этого меню.
Вырезать
При выборе данного пункта происходит удаление выделенного фрагмента текста документа и сохранение его в буфере.
Копировать
Выделенный фрагмент текста документа сохраняется в буфере без удаления его из документа.
Вставить
Ранее сохраненный в буфере (используя Вырезать или Копировать) фрагмент будет вставлен в текущий документ с текущей позиции курсора.
Удалить
Удаляет выделенный фрагмент текста документа без сохранения его в буфере.
Выделить все
Выделяет весь документ.
Найти
Поиск слова в документе. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Вид
Данное меню позволяет выполнить действия по настройке отображения документа (рисунок 4).
Рисунок 4 - меню Вид.
Рассмотрим подпункты этого меню.
Дерево тегов
Определяет, будет ли слева отображаться список тегов языка HTML. По умолчанию – включено. Если отключить данную опцию, то список тегов отображаться не будет, а окно редактирования расширится до границ главного окна.
Обновить цвета
Данный пункт отвечает за принудительную перерисовку окна редактирования, в случае неправильного отображения цветов (например, основной текст выделен синим цветом, хотя обычным для него является черный). Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Просмотр в броузере
Этот пункт позволяет, не выходя из редактора, посмотреть, как будет выглядеть документ в броузере.
Вставка
Данный пункт меню отвечает за вставку в документ целых конструкций языка HTML (рисунок 5).
Рисунок 5 - меню Вставка.
Рассмотрим подпункты этого меню.
Таблица
Пункт отвечает за создание шаблона таблицы в тексте документа. При выборе данного пункта появится окно, в котором необходимо задать параметры создаваемого шаблона, а именно: число строк и столбцов таблицы, ширина таблицы в процентах, толщина рамки таблицы, выравнивание по горизонтали и вертикали(рисунок 6).
Рисунок 6 - задание параметров таблицы.
После нажатия кнопки OK, в окне редактирования, с текущей позиции курсора, будет создан шаблон таблицы с указанными параметрами (рисунок 7). Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Рисунок 7 - сгенерированный код HTML для заданной таблицы.
Вставить строку
Данный пункт отвечает за вставку «строки таблицы», т.е. конструкции tr. Вставка осуществляется с текущей позиции курсора в окне редактирования. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Вставить столбец
Данный пункт отвечает за вставку «столбца таблицы», т.е. конструкции td. Вставка осуществляется с текущей позиции курсора в окне редактирования. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Вставить изображение
Пункт отвечает за создание шаблона изображения в тексте документа. При выборе данного пункта появится окно, в котором необходимо задать параметры создаваемого шаблона, а именно: имя файла-изображения, ширина, высота самого изображения, выравнивание по горизонтали и вертикали, а также строка текста, которая отобразится в броузере при отсутствии изображения. При нажатии кнопки Обзор, будет предложен диалог выбора файла с указанием его местоположения, причем ширина и высота будут определены автоматически (рисунок 8).
Рисунок 8 - задание параметров изображения.
После нажатия кнопки OK, в окне редактирования, с текущей позиции курсора, будет создан шаблон таблицы с указанными параметрами. Данный пункт меню дублируется соответствующей кнопкой на панели инструментов.
Проект
Пункт меню Проект позволяет создать заготовку сайта, с заданием структуры каталогов, по заранее сформированному шаблону (рисунок 9). Шаблоны хранятся в папке template каталога редактора MyEditor.
Рисунок 9 - меню Проект.
Шаблон представляет собой копию структуры сайта, который необходимо создать и еще один файл имя_файла_шаблона.tp (обычный текстовый файл), в котором описана данная структура. Вышеуказанные компоненты должны находиться в одном каталоге (например, в каталоге template). Рассмотрим пример содержимого файла site.tp:
8
Биография
index.htm
Укр. биография
indexu.htm
Анг. биография
indexe.htm
Автореферат
diss/index.htm
Электронная библиотека
library/index.htm
Каталог ссылок
links/index.htm
Отчет о поиске
links/zvit.htm
Индивидуальное задание
ind/index.htm
Первая строка – количество файлов, входящих в шаблон (и соответственно в будущий сайт). Далее идут пары строк:
логическое имя файла (Биография)
физическое имя файла (index.htm)
Число таких пар должно равняться числу, стоящему в первой строке файла.
При выборе подпункта Новый меню Проект будет предложено выбрать файл шаблона (например, файл site.tp).
Рисунок 10 - выбор файла шаблона.
После указания необходимого шаблона, предлагается выбрать местоположение создаваемой заготовки сайта. По умолчанию используется папка work в директории редактора MyEditor.
Рисунок 11 - местоположение создаваемого проекта.
Затем, из представленного списка файлов, необходимо выбрать те, которые действительно войдут в будущий сайт. По умолчанию выделены все файлы шаблона.
Рисунок 12 - выбор файлов, необходимых для создаваемого сайта.
По нажатию кнопки OK, будет предложено заполнить несколько полей, значения которых будут подставлены в рабочий сайт вместо последовательности спецсимволов, находящихся в шаблоне.
Рисунок 13 - заполнение значений для подстановки в шаблон.
После заполнения указанных полей и нажатия OK, будет выведено сообщение, что проект создан. Теперь его можно найти в папке work каталога редактора MyEditor.
Файл шаблона в требуемых местах (где нужно вписать фамилию, дату рождения, указать цвет фона и пр.) содержит последовательность спецсимволов. Данная последовательность имеет следующую структуру: $$$Любой текст$$$. Знаки $, в начале три и в конце три, являются обязательными и постоянны для любой последовательности. Между ними может находиться любой текст. Этот текст используется при создании сайта, в запросе о заполнении полей шаблона.
Сервис
Пункт меню Сервис содержит всего один подпункт Настройки. При выборе этого подпункта откроется окно настроек редактора (рисунок ). Флажок «создавать шаблон HTML автоматически» по умолчанию установлен. Он отвечает за то, что при создании нового документа автоматически генерируется последовательность тегов, включающая html, head и body. Если вышеуказанный флажок отключить, то при создании нового документа будет сгенерирован абсолютно пустой файл.
Рисунок 14 - настройки редактора.
В этом же окне можно выбрать тип обновления раскраски:
- автоматическое;
- оптимизированное;
- только ручное.
По умолчанию используется оптимизированное обновление раскраски.