Познавательное чтиво

Уж если вы собрались работать с HTML-кодом, то приготовьтесь к тому, что большую часть времени вы будете проводить в текстовом или комбинированном режиме Dreamweaver. Тем более, что некоторые инструменты, как Tag Chooser, допускают работу только с ними. Но это не догма, которой необходимо строго следовать. При желании, можно успешно редактировать исходный код и одновременно находиться в визуальном режиме. Как такое может быть? Ведь визуальный режим предназначен как раз для обратного — чтобы скрыть от дизайнера исходный код.

Но Dreamweaver вовсе не собирается заковывать нас в такие жесткие рамки. В любом режиме можно успешно работать с кодом, используя такие инструменты, как мини-редактор Quick Tag Editor и полноценный текстовый редактор Code Inspector. Первый инструмент представляет из себя маленькое всплывающее окно, в котором можно на скорую руку набить строчку кода. Второй инструмент, по сути, является аналогом текстового режима Dreamweaver в виде отдельного всплывающего окна. Оба инструмента включают в себя поддержку всех функций Dreamweaver для работы с кодом, включая подсказку по тегам Tag Hints и контекстное использование справочной панели Reference. И оба инструмента можно использовать в любое время и в любом режиме работы Dreamweaver — в текстовом, в визуальном и в комбинированном. Вопрос в том, что наибольшая польза от них происходит при работе именно в визуальном режиме, где нет иных средств работы с кодом, кроме них.

Чтобы воспользоваться мини-редактором Quick Tag Editor, следует выполнить следующие действия:

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

2. Вызовите мини-редактор с помощью команды меню Modify | Quick Tag Editor или комбинации клавиш <Ctrl>+<T>.

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

□ Insert HTML — код, введенный в мини-редакторе, просто будет вставлен в исходный код страницы. Для этого, перед тем как запустить Quick Tag Editor, достаточно щелкнуть мышью и поставить курсор в любом месте на странице. Курсор можно поставить в видимом для посетителей тексте, главное, чтобы не был выделен никакой объект или блок текста. Потому что при этом мини-редактор использует один из следующих методов.

□ Edit Tag — если вы щелкнете мышью на каком-нибудь объекте, к примеру, графическом изображении, это приведет к его выделению. Как следствие, в мини-редакторе откроется тег данного объекта (рис. 4.30). Вы можете отредактировать его, изменив или удалив атрибуты. Следует отметить, что вы не сможете удалить весь тег таким образом. Даже если вы выделите его целиком и нажмете клавишу <Delete> или <Backspace>, он как будто исчезнет — в мини-редакторе, но на самом деле все останется без изменений. Вы можете в этом убедиться по тому, что Web-страница даже не шелохнется.

□ Wrap Tag — выделите блок текста на странице (не кода HTML, а именно текста — то, что будут видеть пользователи). При запуске мини-редактора вам надо будет ввести тег, в который будет заключен выделенный текст. Закрывать тег не надо, достаточно ввести один открывающий тег, к примеру, <strong>, и нажать клавишу <Enter> (рис. 4.31). Это действие применимо только к тексту — если в составе выделенного участка будет хотя бы один тег, Quick Tag Editor запустится в режиме редактирования тега Edit Tag.

Как следует работать с мини-редактором? Как обычно — вводите код и используете все приемы для его редактирования. По желанию, положение мини-редактора Quick Tag Editor можно изменить, щелкнув на его заголовке и перетащив его, как обычное окно, куда угодно. Чтобы завершить редактирование, следует нажать клавишу <Enter>. Поэтому мини-редактор можно смело назвать "редактором одной строки". Чтобы выйти из него, не внося никаких изменений, достаточно нажать клавишу <Esc>.

Совет

По умолчанию, подсказка по тегам Code Hints в мини-редакторе Quick Tag Editor работает с большей задержкой, чем в текстовом режиме. Чтобы изменить это, откройте настройки Dreamweaver с помощью команды меню Edit | Preferences, в списке слева выберите категорию Quick Tag Editor, убедитесь, что флажок Enable Tag Hints установлен, и выставите с помощью параметра Delay необходимое время паузы для подсказки в секундах.

Гораздо более мощным средством является всплывающий редактор Code Inspector, который действительно содержит в себе все средства для редактирования кода. Для его запуска следует использовать команду меню Window | Code Inspector или клавишу <F10>.

Это практически аналог текстового режима Dreamweaver, только выполненный в виде независимого окна, которое можно изменять и перемещать как угодно (рис. 4.32). Следует отметить, однако, что настройка просмотра в Code Inspector производится отдельно от аналогичной настройки в текстовом режиме. Чтобы открыть эти настройки, необходимо щелкнуть на кнопке View Options, расположенной на инструментальной панели внутри Code Inspector. Значения параметров аналогичны таким же параметрам для текстового режима, которые описывались в этой главе в разделе про настройку встроенного редактора кода.