Подробнее о
Fireworks
Вставка изображения
Fireworks
Dreamweaver и Fireworks распознают и совместно используют многие
процедуры редактирования файла, включая изменение ссылок, карты ссылок,
фрагменты таблицы и многое
другое. Вместе оба приложения обеспечивают хорошо налаженный процесс
редактирования, оптимизации и
размещения файлов веб- графики на HTML страницах.
Можно поместить экспортированную графику из Fireworks непосредственно в
документ Dreamweaver с помощью команды «Вставить изображение», либо
создать новое изображение
Fireworks из шаблона изображения Dreamweaver.
1 В документе Dreamweaver поместите курсор вставки туда, где должно
появиться изображение, и выполните одно из следующих действий.
• Выберите «Вставка» >
«Рисунок».
• В категории «Общие»
панели «Вставка» нажмите кнопку
«Изображение» или
перетащите ее в пределы документа.
2 Перейдите к необходимому экспортируемому файлу Fireworks и нажмите
кнопку «ОК» (Windows) или «Open» (Macintosh).
Примечание. Если файла Fireworks нет на текущем сайте Dreamweaver, то
появляется запрос на копирование файла в корневую папку. Нажмите кнопку
«Да».
Редактирование изображения
Fireworks или таблицы из Dreamweaver
При открытии и редактировании изображения или фрагмента изображения,
который является частью таблицы Fireworks, Dreamweaver запускает
Fireworks, где открывается
PNG-файл, из которого, в свою очередь, было экспортировано изображение
или таблица.
Примечание. Для этого необходимо, чтобы Fireworks был установлен как
основной внешний графический редактор для PNG файлов. Кроме того,
Fireworks часто бывает редактором
по умолчанию для JPEG- и GIF- файлов, хотя в качестве редактора по
умолчанию для этих типов файлов
можно задать Photoshop .
См.
Использование
внешнего графического редактора
Если изображение является частью таблицы Fireworks, можно открыть всю
таблицу Fireworks для редактирования, так как в HTML-коде есть
комментарий <!--fw
table-->. Если исходный PNG-файл был экспортирован из Fireworks на
сайт Dreamweaver с помощью настройки
«Стиль HTML и изображений» Dreamweaver, то комментарии к таблице
Fireworks автоматически
добавляются в HTML-код.
1 В программе Dreamweaver откройте инспектор свойств (Окно >
Свойства), если он еще не открыт.
2 Чтобы выбрать изображение или фрагмент изображения, щелкните его.
При выборе изображения, которое было экспортировано из Fireworks,
инспектор свойств определяет его как изображение или таблицу Fireworks
и отображает имя исходного PNG-файла.
3 Чтобы запустить Fireworks для редактирования, выполните одно из
следующих действий.
• В инспекторе свойств нажмите
кнопку «Изменить».
• Дважды щелкните выбранное изображение, удерживая клавишу «Control»
(Windows) или «Command» (Macintosh).
• Щелкните выбранное изображение правой кнопкой мыши (Windows) или
щелкните его, удерживая клавишу «Control» (Macintosh), и выберите в
контекстном меню пункт
«Изменить с помощью Fireworks».
Примечание. Если приложению Fireworks не удается определить
расположение исходного PNG-файла, необходимо указать его. В процессе
работы над исходным файлом Fireworks
изменения сохраняются в исходном и экспортируемом файлах. В других
случаях обновляется только
экспортируемый файл.
4 Отредактируйте исходный PNG-файл в Fireworks и нажмите кнопку
«Готово».
Fireworks сохраняет изменения в PNG-файле, экспортирует обновленное
изображение (или HTML и изображения) и возвращает фокус приложению
Dreamweaver. В Dreamweaver появляется обновленное изображение или
таблица.
Вверх
Оптимизация изображения
Fireworks в Dreamweaver
С помощью Dreamweaver можно быстро внести изменения в изображения и
анимацию Fireworks. В Dreamweaver можно изменять настройки оптимизации,
параметры анимации,
размер и область экспортируемого изображения.
1 В Dreamweaver выделите нужное изображение и выполните одно из
следующих действий.
• Выберите меню «Команда» >
«Оптимизировать изображение»
• Нажмите кнопку «Изменить параметры изображения» в инспекторе свойств.
2 Укажите параметры в диалоговом окне «Просмотр изображений»:
• Для редактирования настроек
оптимизации выберите вкладку «Параметры».
• Для изменения размера и области экспортируемого изображения выберите
вкладку «Файл».
3 По окончании нажмите кнопку «ОК».
См. также:
Настройка
параметров в диалоговом окне «Просмотр изображения
Изменение заполнителей
изображений Dreamweaver с помощью
Fireworks
В документе Dreamweaver можно создать местозаполнитель
изображения,
запустить Fireworks и создать там изображение или таблицу, а затем
заменить этот заполнитель.
Чтобы создать новое изображение из местозаполнителя, необходимо, чтобы
были установлены оба приложения: как Dreamweaver, так и Fireworks.
1 Убедитесь, что Fireworks установлен в качестве графического редактора
для PNG-файлов.
2 Чтобы выбрать местозаполнитель, щелкните его в окне «Документ».
3 Чтобы запустить Fireworks в режиме «Редактирование из программы
Dreamweaver», выполните один из следующих шагов.
• В инспекторе свойств нажмите
кнопку «Создать».
• Нажмите клавишу «Control» (Windows) или «Command» (Macintosh) и затем
дважды щелкните местозаполнитель изображения.
• Щелкните местозаполнитель правой кнопкой мыши (Windows) или щелкните
его, удерживая клавишу «Control» (Macintosh), затем выберите «Создать
изображение в Fireworks».
4 Использование параметров Fireworks при создании изображения.
Fireworks распознает следующие параметры местозаполнителя изображения,
которые были установлены в Dreamweaver: размер изображения (которое
соответствует размеру холста
Fireworks), идентификатор изображения (который Fireworks использует как
имя документа по
умолчанию для создаваемых исходного и экспортируемого файлов) и
выравнивание текста. Кроме того, Fireworks
распознает ссылки и некоторые варианты поведения (такие как замена
изображений, всплывающее меню и
задание текста), которые присоединены к заполнителю изображения при
работе в Dreamweaver.
Примечание. Хотя Fireworks не отображает ссылки, добавленные в
местозаполнитель изображения, эти ссылки сохраняются. При рисовании
активной области и добавлении ссылок
в Fireworks, ссылки, добавленные в местозаполнитель изображения в
Dreamweaver, не удаляются.
Однако если
вырезать фрагмент в Fireworks и вставить его в новое изображение, то
ссылки в документе Dreamweaver
будут удалены.
Fireworks не распознает следующие параметры заполнителя изображения:
выравнивание изображения, цвет, вертикальный и горизонтальный отступы и
карты. Они отключены в
инспекторе свойств местозаполнителя изображения.
5 По завершении нажмите кнопку «Готово», чтобы отобразить диалоговое
окно сохранения.
6 В текстовом поле «Сохранить в» выберите папку, указанную в качестве
папки локального сайта Dreamweaver.
Если при вставке местозаполнителя изображения в документ Dreamweaver
указано его имя, то Fireworks поместит его в поле «Имя файла». Это имя
можно изменить.
7 Нажмите кнопку «Сохранить», чтобы сохранить PNG-файл.
Появится диалоговое окно «Экспорт». С помощью этого окна выполняется
экспорт изображений в формат GIF или JPEG, или, в случае
фрагментированных изображений, в формат
«HTML и изображения».
8 В поле «Сохранить в» укажите папку локального сайта Dreamweaver.
В поле «Имя» автоматически отобразится указанное имя PNG-файла. Это имя
можно изменить.
9 В поле «Сохранить как тип» укажите тип файла или файлов, в который
необходимо экспортировать: например, «Только изображения» или «HTML и
изображения».
10 Для сохранения экспортированного файла нажмите кнопку «Сохранить».
Файл будет сохранен, фокус вернется к Dreamweaver. В документе
Dreamweaver экспортируемый файл или таблица Fireworks заменяет
местозаполнитель изображения.
См. также:
Вставка
изображения
Вверх
О всплывающих меню Fireworks
Fireworks позволяет быстро и просто создать всплывающие меню на основе
CSS.
В дополнение к расширяемости и быстрой загрузке всплывающие меню,
созданные с помощью Fireworks, дают следующие преимущества:
• Пункты меню доступны для индексации поисковым системам.
• Пункты меню доступны для программ чтения с экрана, что обеспечивает
странице специальные возможности.
• Код, сформированный Fireworks, удовлетворяет стандартам, и его можно
проверять.
Можно редактировать всплывающее меню Fireworks с помощью Dreamweaver
или Fireworks, но не одновременно. Изменения, внесенные в Dreamweaver,
не сохраняются в
Fireworks.
Редактирование всплывающего меню
Fireworks в Dreamweaver
Можно создать всплывающее меню в Fireworks 8 или более поздней версии и
затем отредактировать его с помощью Dreamweaver или Fireworks
(используя двунаправленное
редактирование), но не одновременно.
При редактировании меню в Dreamweaver, а затем в Fireworks, все
предыдущие изменения будут потеряны, за исключением содержимого текста.
Если вы предпочитаете редактировать меню с помощью Dreamweaver, то
можно создать его в Fireworks, а затем использовать Dreamweaver только
для редактирования и настройки
меню.
Если вы предпочитаете редактировать меню в Fireworks, то можно
использовать возможность
двунаправленного редактирования в Dreamweaver, но не редактировать его
непосредственно в Dreamweaver.
1 В Dreamweaver выберите таблицу Fireworks, которая содержит
всплывающее меню, и нажмите кнопку «Изменить» в инспекторе свойств.
Исходный PNG-файл откроется в Fireworks.
2 В Fireworks отредактируйте меню с помощью редактора всплывающих меню
и нажмите кнопку «Готово» на панели инструментов. Fireworks.
Fireworks отправляет отредактированное всплывающее меню обратно в
Dreamweaver.
Если всплывающее меню создано в Fireworks MX 2004 или более ранней
версии, то его можно редактировать в Dreamweaver с помощью диалогового
окна «Отображение всплывающего
меню», доступного на панели «Поведение».
Редактирование всплывающего
меню, созданного в Fireworks MX 2004 или более ранней версии
1 В Dreamweaver выберите активную область или изображение, которое
вызывает всплывающее меню.
2 На панели «Поведение» (Shift+F3) дважды щелкните «Показать
всплывающее контекстное меню» в списке «Действия».
3 Внесите необходимые изменения в диалоговом окне «Всплывающее меню» и
нажмите кнопку «OК».
Дополнительные разделы справки
«Применение поведения «Показать всплывающее контекстное меню»» на
странице 387
Вверх
Настройка установок запуска
и
редактирования исходных файлов
Fireworks
При использовании редактировании изображений в Fireworks графика на
веб-страницах обычно экспортируется с помощью Fireworks из исходного
PNG-файла. При открытии
файла для редактирования в Dreamweaver Fireworks автоматически
открывает исходный PNG-файл или
запрашивает его расположение, если он не найден.
При необходимости можно установить параметры в
Fireworks, чтобы вставленное изображение уже было открыто в
Dreamweaver, либо приложение Fireworks
предлагало выбрать варианты использования вставленного изображения или
исходного файла Fireworks
каждый раз при открытии изображения в Dreamweaver.
Примечание. Dreamweaver распознает установки запуска и редактирования
Fireworks только в отдельных случаях. В частности, необходимо открыть и
оптимизировать изображение,
которое не является частью таблицы Fireworks и содержит верный путь в
заметках разработчика к
исходному PNG-файлу.
1 В Fireworks, выберите пункт «Правка» > «Настройки» (Windows) или
«Fireworks» > «Настройки» (Macintosh) и выберите вкладку «Запуск и
редактирование» (Windows) или
пункт «Запуск и редактирование» из всплывающего меню (Macintosh).
2 Установите параметры, которые будут использоваться при помещении
редактируемых или
оптимизируемых изображений Fireworks во внешние приложения:
Всегда использовать исходный PNG
автоматически открывает PNG-файл Fireworks, указанный в заметках
разработчика как источник помещаемого изображения. Обновления
применяются к исходному PNG-файлу и соответствующему изображению.
Не использовать исходный PNGавтоматически
открывает помещенное изображение Fireworks независимо от того,
существует ли исходный PNG-файл. Обновления применяются только к
помещенным изображениям.
Спрашивать при запуске Отображает
сообщение, запрашивающее открытие исходного PNG-файла. Кроме того, в
этом сообщении можно указать глобальные установки запуска и
редактирования.
Вверх
Вставка HTML-кода Fireworks
в
документ Dreamweaver
С помощью команды «Экспорт» в Fireworks можно экспортировать и
сохранять оптимизированные изображения и HTML-файлы внутри папки сайта
Dreamweaver. Затем можно
добавить файл в Dreamweaver.
Dreamweaver позволяет вставлять сформированный Fireworks HTML-код,
включающий связанные изображения, фрагменты и сценарии JavaScript, в
документ.
1 В документе Dreamweaver поместите курсор вставки в том месте, где
следует вставить HTML-код Fireworks.
2 Выполните одно из следующих действий.
• Выберите меню «Вставка» >
«Объекты изображения» > «Fireworks
HTML».
• В категории «Общие» панели «Вставка» нажмите кнопку «Изображение» и
выберите параметр «Вставить HTML Fireworks» из всплывающего меню.
3 Чтобы выбрать HTML-файл Fireworks, нажмите кнопку «Обзор».
4 Если файл в дальнейшем не понадобится, выберите меню «Удалить файл
после вставки». Выбор этого параметра не оказывает никакого влияния на
исходный PNG-файл, связанный
с HTML-файлом.
Примечание. Если HTML-файл находится на сетевом диске, он будет
безвозвратно удален без перемещения в «Корзину» или папку «Мусор».
5 Нажмите кнопку «ОК», чтобы вставить в документ Dreamweaver HTML-код
вместе со связанными изображениями, фрагментами и сценариями JavaScript.
Вставка HTML-кода Fireworks
в
Dreamweaver
Быстрый способ поместить сформированные Fireworks изображения или
таблицы в Dreamweaver — это копирование и вставка HTML-кода Fireworks
непосредственно в документ
Dreamweaver.
Копирование и вставка HTML-кода
Fireworks в Dreamweaver
1 В Fireworks, выберите «Правка» > «Копировать код HTML».
2 Следуйте указаниям мастера, который поможет установить параметры для
экспорта HTML и
изображений. При запросе укажите папку сайта Dreamweaver в качестве
целевой для экспортируемых изображений.
Мастер экспортирует изображения в указанное место назначения и копирует
HTML-код в буфер обмена.
3 В документе Dreamweaver поместите курсор вставки в том месте, где
следует вставить HTML-код, и выберите команды «Правка» > «Вставить
Fireworks HTML».
Весь код HTML и JavaScript, связанный с экспортируемыми файлами
Fireworks, копируется в документ Dreamweaver, все ссылки на изображения
обновляются.
Экспорт и вставка HTML-кода
Fireworks в Dreamweaver
1 В Fireworks выберите «Файл» > «Экспорт».
2 Укажите папку сайта Dreamweaver в качестве целевой для экспортируемых
изображений.
3 Во всплывающем меню «Экспорт» выберите «HTML и изображения».
4 Во всплывающем меню HTML выберите пункт «Копировать в буфер обмена» и
нажмите кнопку «Экспорт».
5 В документе Dreamweaver поместите курсор вставки в то место, куда
следует вставить экспортируемый HTML-код, и выберите «Правка» >
«Вставить Fireworks HTML».
Весь код HTML и JavaScript, связанный с экспортируемыми файлами
Fireworks, копируется в документ Dreamweaver, все ссылки на изображения
обновляются.
Обновление HTML-кода Fireworks,
помещенного в Dreamweaver
В Fireworks команда «Файл» > «Обновить HTML» является альтернативой
обновления файлов Fireworks, помещенных в Dreamweaver путем запуска и
редактирования. С помощью
команды «Обновить HTML» можно отредактировать исходное изображение
формата PNG в Fireworks и затем
автоматически обновить экспортируемые HTML-код и файлы изображений,
помещенные в документ
Dreamweaver.
Эта команда позволяет обновить файлы Dreamweaver, даже когда
Dreamweaver не запущен.
1 В Fireworks откройте исходный PNG-файл и внесите изменения.
2 Выберите «Файл» > «Сохранить».
3 В Fireworks выберите «Файл» > «Обновить HTML».
4 Перейдите в файл Dreamweaver, содержащий HTML-код, который необходимо
обновить, и нажмите кнопку «Открыть».
5 Перейдите в целевую папку, в которую следует поместить обновленные
файлы изображений, и нажмите кнопку «Выбрать» (Windows) или «Choose»
(Macintosh).
Fireworks обновит код HTML и JavaScript в документе Dreamweaver. Кроме
того, Fireworks экспортирует обновленные изображения, связанные с
HTML-кодом, и поместит изображения
в указанную целевую папку.
Если приложению Fireworks не удастся найти соответствующий HTML-код для
обновления, то в документ Dreamweaver можно будет вставить новый
HTML-код. Fireworks помещает
JavaScript-фрагмент нового кода в начало документа, а таблицу HTML или
ссылку на изображение — в конец.
Вверх
Создание веб-фотоальбома
Начиная с Dreamweaver CS5, функция «Создать веб-альбом фотографий»
устарела.
Веб-альбомы (фотогалереи) создаются в Photoshop.
Дополнительно:
Руководство по интеграции Dreamweaver и
Fireworks (видео, англ. язык)
Вернуться к: Работа с другими приложениями