В окне документа переключитесь на представление «Дизайн» и выделите фрагмент документа, который нужно сохранить в качестве элемента библиотеки.
- Руководство пользователя Dreamweaver
- Введение
- Dreamweaver и Creative Cloud
- Рабочие среды и представления Dreamweaver
- Настройка сайтов
- О сайтах Dreamweaver
- Настройка локальной версии сайта
- Подключение к серверу публикации
- Настройка тестового сервера
- Импорт и экспорт параметров сайта Dreamweaver
- Перенос существующих веб-сайтов с удаленного сервера в корневой каталог локального сайта
- Специальные возможности в Dreamweaver
- Дополнительные настройки
- Настройка установок сайта для передачи файлов
- Задание параметров прокси-сервера в Dreamweaver
- Синхронизация настроек Dreamweaver с Creative Cloud
- Использование Git в Dreamweaver
- Управление файлами
- Создание и открытие файлов
- Управление файлами и папками
- Получение файлов с сервера и размещение их на нем
- Возврат и извлечение файлов
- Синхронизация файлов
- Сравнение файлов
- Скрытие файлов и папок на сайте Dreamweaver
- Включение заметок разработчика для сайтов Dreamweaver
- Предотвращение использования уязвимости Gatekeeper
- Макет и оформление
- Использование средств визуализации для создания макета
- Об использовании CSS для создания макета страницы
- Создание динамичных веб-сайтов с помощью Bootstrap
- Создание и использование медиазапросов в Dreamweaver
- Представление содержимого в таблицах
- Цвета
- Гибкий дизайн с использованием «резиновых» макетов
- Extract в Dreamweaver
- CSS
- Общие сведения о каскадных таблицах стилей
- Создание макетов страниц с помощью конструктора CSS
- Использование препроцессоров CSS в Dreamweaver
- Установка настроек стиля CSS в Dreamweaver
- Перемещение правил CSS в Dreamweaver
- Преобразование встроенного CSS в правило CSS в Dreamweaver
- Работа с тегами div
- Применение градиентов к фону
- Создание и редактирование эффектов перехода CSS3 в Dreamweaver
- Форматирование кода
- Содержимое страницы и ресурсы
- Задание свойств страницы
- Задание свойств заголовка CSS и свойств ссылки CSS
- Работа с текстом
- Поиск и замена текста, тегов и атрибутов
- Панель DOM
- Редактирование в режиме интерактивного просмотра
- Кодировка документов в Dreamweaver
- Выбор и просмотр элементов в окне документа
- Задание свойств текста в инспекторе свойств
- Проверка орфографии на веб-странице
- Использование горизонтальных линеек в Dreamweaver
- Добавление и изменение сочетаний шрифтов в Adobe Dreamweaver
- Работа с ресурсами
- Вставка и обновление даты в Dreamweaver
- Создание и управление избранными ресурсами в Dreamweaver
- Вставка и редактирование изображений в Dreamweaver
- Добавление мультимедийных объектов
- Добавление видео Dreamweaver
- Добавление видео HTML5
- Вставка файлов SWF
- Добавление звуковых эффектов
- Добавление аудио HTML5 в Dreamweaver
- Работа с элементами библиотеки
- Использование текста на арабском языке и иврите в Dreamweaver
- Создание ссылок и навигация
- Графические элементы и эффекты jQuery
- Написание кода веб-сайтов
- О программировании в Dreamweaver
- Среда написания кода в Dreamweaver
- Настройка параметров написания кода
- Настройка цветового оформления кода
- Написание и редактирование кода
- Подсказки по коду и автозавершение кода
- Свертывание и развертывание кода
- Повторное использование фрагментов кода
- Анализ Linting для проверки кода
- Оптимизация кода
- Редактирование кода в представлении «Дизайн»
- Работа с содержимым заголовков для страниц
- Вставка серверных включений в Dreamweaver
- Использование библиотек тегов в Dreamweaver
- Импорт пользовательских тегов в Dreamweaver
- Использование вариантов поведения JavaScript (общие инструкции)
- Применение встроенных вариантов поведения JavaScript
- Сведения об XML и XSLT
- Выполнение XSL-преобразования на стороне сервера в Dreamweaver
- Выполнение XSL-преобразования на стороне клиента в Dreamweaver
- Добавление символьных сущностей для XSLT в Dreamweaver
- Форматирование кода
- Процессы взаимодействия продуктов
- Установка и использование расширений в Dreamweaver
- Обновления в Dreamweaver, устанавливаемые через приложение
- Вставить документы Microsoft Office в Dreamweaver (только для Windows)
- Работа с Fireworks и Dreamweaver
- Редактирование содержимого на сайтах Dreamweaver с помощью Contribute
- Интеграция Dreamweaver с Business Catalyst
- Создание персонализированных кампаний почтовой рассылки
- Шаблоны
- О шаблонах Dreamweaver
- Распознавание шаблонов и документов на их основе
- Создание шаблона Dreamweaver
- Создание редактируемых областей в шаблонах
- Создание повторяющихся областей и таблиц в Dreamweaver
- Использование дополнительных областей в шаблонах
- Определение редактируемых атрибутов тега в Dreamweaver
- Создание вложенных шаблонов в Dreamweaver
- Редактирование, обновление и удаление шаблонов
- Экспорт и импорт XML-содержимого в Dreamweaver
- Применение или удаление шаблона из существующего документа
- Редактирование содержимого в шаблонах Dreamweaver
- Правила синтаксиса для тегов шаблона в Dreamweaver
- Настройка предпочтений выделения для областей шаблона
- Преимущества использования шаблонов в Dreamweaver
- Мобильные и многоэкранные устройства
- Динамические сайты, страницы и веб-формы
- Общие сведения о веб-приложениях
- Настройка компьютера для разработки приложений
- Устранение неполадок подключений к базам данных
- Удаление сценариев подключения в Dreamweaver
- Дизайн динамических страниц
- Обзор динамических источников содержимого
- Определение источников динамического содержимого
- Добавление динамического содержимого на страницы
- Изменение динамического содержимого в Dreamweaver
- Отображение записей баз данных
- Введение интерактивных данных и устранение неполадок с ними в Dreamweaver
- Добавление заказных вариантов поведения сервера в Dreamweaver
- Создание форм с помощью Dreamweaver
- Использование форм для сбора информации от пользователей
- Создание и включение форм ColdFusion в Dreamweaver
- Создание веб-форм
- Расширенная поддержка HTML5 для компонентов формы
- Разработка формы с помощью Dreamweaver
- Визуальное построение приложений
- Создание главной страницы и страницы сведений в Dreamweaver
- Создание страниц поиска и результатов поиска
- Создание страницы для вставки записи
- Создание страницы обновления записи в Dreamweaver
- Создание страниц удаления записей в Dreamweaver
- Применение ASP-команд для изменения базы данных в Dreamweaver
- Создание страницы регистрации
- Создание страницы входа
- Создание страницы с доступом только для авторизованных пользователей
- Защита папок в ColdFusion с помощью Dreamweaver
- Использование компонентов ColdFusion в Dreamweaver
- Тестирование, просмотр и публикация веб-сайтов
- Устранение неполадок
Изучите этот раздел, чтобы узнать, как создавать элементы библиотеки в Dreamweaver, а также как вставлять и редактировать их в документах.
Библиотека представляет собой специальный файл Dreamweaver, в котором содержится набор отдельных ресурсов или копий ресурсов, используемых для создания веб-страниц. Ресурсы, содержащиеся в библиотеке, называются элементами библиотеки. В библиотеке сохраняют следующие элементы: изображения, таблицы, звуки и файлы, созданные при помощи Adobe Flash. При изменении какого-либо элемента библиотеки можно автоматически обновить все страницы, в которых используется такой элемент.
Например, задание на разработку объемного сайта компании предусматривает наличие рекламного девиза на каждой странице. Для этой цели можно создать элемент библиотеки, содержащий рекламный девиз компании, и использовать созданный элемент на всех страницах. Если девиз со временем будет изменен, для автоматического обновления всех страниц, в которых он используется, потребуется только изменить соответствующий элемент библиотеки.
Dreamweaver содержит элементы библиотеки в папке «Библиотека» в локальной корневой папке сайта. Каждый сайт имеет свою собственную библиотеку.
Элемент библиотеки можно создать из любого другого элемента, содержащегося в разделе body документа, включая текст, таблицы, формы, Java-апплеты, внешние модули, элементы ActiveX, панели навигации и изображения.
Для связанных элементов, например изображений, в библиотеке хранится только ссылка на такой элемент. Для правильной работы элемента библиотеки не следует менять расположение исходного файла.
Однако хранение изображения в качестве элемента библиотеки может оказаться иногда полезным. Например, можно сохранить полный тег img в качестве элемента библиотеки, что позволит в дальнейшем для всего сайта легко изменить для изображения текст alt или атрибут src. (Не используйте данный прием для изменения атрибутов width и height изображения, за исключением случаев, когда для изменения реальных размеров изображения применяется графический редактор.)
Если элемент библиотеки содержит ссылки, то на новом сайте они могут не работать. Кроме того, на новый сайт не переносятся изображения, хранящиеся в элементе библиотеки.
При использовании элемента библиотеки Dreamweaver создает и помещает на веб-страницу только ссылку, но не сам элемент. То есть Dreamweaver вставляет в документ копию исходного HTML-кода для соответствующего элемента и добавляет HTML-комментарий, в котором содержится ссылка на внешний исходный элемент. Именно с помощью этой внешней ссылки и происходит автоматическое обновление.
При создании элемента библиотеки, в котором присутствует элемент, обладающий вариантом поведения Dreamweaver, Dreamweaver копирует в файл элемента библиотеки сам элемент и соответствующий обработчик событий (атрибут, который указывает событие, запускающее действие, например onClick, onLoad или onMouseOver, и соответствующее действие при возникновении такого события). Dreamweaver не копирует связанные функции JavaScript в элемент библиотеки. Напротив, при вставке элемента библиотеки в документ Dreamweaver автоматически вставляет соответствующие функции JavaScript в раздел head документа (если они там отсутствуют).
Если ввод кода JavaScript выполняется вручную (то есть не используются варианты поведения Dreamweaver), то написанный код можно внести в элемент библиотеки в случае, если для выполнения кода применяется вариант поведения «Call JavaScript». Если для выполнения кода не используется вариант поведения Dreamweaver, в элементе библиотеки код не сохраняется.
Для редактирования вариантов поведения, находящихся в элементах библиотек, существуют определенные требования. Элементы библиотек не могут содержать таблицы стилей, поскольку код таких элементов располагается в разделе head.
Создание элемента библиотеки из выделенного фрагмента
-
-
Выберите «Инструменты» > «Библиотека» > «Добавить объект в библиотеку».
-
Введите имя нового элемента библиотеки и нажмите клавишу Enter (в Windows) или Return (в Macintosh).
Dreamweaver сохраняет каждый элемент библиотеки в отдельном файле (с расширением lbi) в папке «Библиотека», расположенной в локальной корневой папке сайта.
Создание пустого элемента библиотеки
-
Убедитесь, что в окне документа нет выделенных объектов.
(Все выделенные объекты будут помещены в новый элемент библиотеки.)
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Нажмите кнопку «Создать элемент библиотеки» в нижней части панели.
-
Введите имя для выделенного элемента и нажмите клавишу Enter (в Windows) или Return (в Macintosh).
Вставка элемента библиотеки в документ
При добавлении элемента библиотеки на страницу вместе с фактическим содержимым в документ помещается ссылка на элемент библиотеки.
-
Поместите курсор вставки в окно документа.
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Выполните одно из следующих действий.
- Переместите элемент библиотеки с панели «Ресурсы» в окно документа.
Примечание.Чтобы вставить в документ содержимое элемента библиотеки без ссылки на этот элемент, во время перемещения элемента из панели «Ресурсы» удерживайте клавишу Control (в Windows) либо Option (в Macintosh). Если элемент был вставлен таким способом, его можно будет редактировать в документе, однако данный документ не будет обновляться при обновлении страниц, в которых используется этот элемент библиотеки.
Выберите элемент библиотеки и нажмите кнопку «Вставить».
Редактирование элементов библиотеки и обновление документов
При редактировании элемента библиотеки можно обновить все документы, в которых используется данный элемент. Если выбран вариант без обновления, то в документах останутся ссылки на элемент библиотеки, что позволит выполнить обновление документов в любое другое время.
Пользователь может переименовывать элементы, что повлечет за собой нарушение ссылок на такие элементы, содержащиеся в документах или шаблонах, и удалять элементы из библиотеки сайта, а также создавать заново отсутствующие элементы библиотеки.
Редактирование элемента библиотеки
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Выберите элемент библиотеки.
-
Нажмите кнопку «Изменить» или дважды щелкните элемент библиотеки.
Dreamweaver открывает для редактирования элемента библиотеки новое окно, аналогичное окну документа. Серый фон указывает на то, что редактируется элемент библиотеки, а не документ.
-
Внесите и сохраните необходимые изменения.
-
Укажите, должны ли обновляться документы, размещенные на локальном сайте, в которых используется данный элемент библиотеки. Выберите «Обновить» для немедленного обновления. Если выбрать «Не обновлять», документы можно будет обновить позже с помощью команд «Инструменты» > «Библиотека» > «Обновить текущую страницу» или «Обновить страницы».
Обновление текущего документа и получение текущих версий всех элементов библиотеки
-
Выберите «Инструменты» > «Библиотека» > «Обновить текущую страницу».
Обновление всего сайта либо всех документов, в которых используется определенный элемент библиотеки
-
Выберите «Инструменты» > «Библиотека» > «Обновить страницы».
-
Во всплывающем меню «Область поиска» укажите, что следует обновлять.
Чтобы обновить все страницы выбранного сайта текущими версиями всех элементов библиотеки, сначала выберите «Весь веб-сайт», а затем сайт из всплывающего меню.
Чтобы обновить все страницы выбранного сайта, в которых используется определенный элемент библиотеки, сначала выберите «Файлы, использующие», а затем элемент библиотеки из всплывающего меню.
-
Убедитесь, что в группе «Обновить» выбран параметр «Элементы библиотеки».Примечание.
Чтобы обновить шаблоны, выберите также параметр «Шаблоны».
-
Нажмите кнопку «Начать».
Dreamweaver выполнит обновление файлов в соответствии с указанными параметрами. Если выбран параметр «Показать журнал», Dreamweaver формирует отчет, содержащий результат обновления файлов и прочую информацию.
Переименование элемента библиотеки
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Щелкните элемент библиотеки, затем после паузы щелкните его еще раз. (Не выполняйте обычный двойной щелчок, поскольку в результате этого элемент будет открыт для редактирования.)
-
Введите новое имя.
-
Щелкните в любом месте либо нажмите клавишу Enter (в Windows) или Return (в Macintosh).
-
Укажите, должны ли обновляться документы, в которых используется этот элемент, выбрав «Обновить» либо «Не обновлять».
Удаление элемента из библиотеки
При удалении элемента библиотеки Dreamweaver удаляет его из библиотеки, но не изменяет содержимое документов, в которых используется удаляемый элемент.
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Выберите элемент библиотеки.
-
Нажмите кнопку «Удалить» или клавишу Delete, а затем подтвердите удаление элемента.Примечание.
После удаления восстановить элемент библиотеки с помощью команды «Отменить» нельзя. Но его можно создать заново.
Повторное создание отсутствующего или удаленного элемента библиотеки
-
Выберите в каком-либо документе экземпляр требуемого элемента.
-
Нажмите кнопку «Создать заново» в инспекторе свойств («Окно» > «Свойства»).
Настройка выделения цветом элементов библиотеки
Имеется возможность настроить цвет выделения элементов библиотек, а также включить либо отключить выделение цветом путем настройки установок выделения.
Изменение цвета выделения элементов библиотеки
-
Выберите меню «Правка» > «Настройки» (Windows) или «Dreamweaver» > «Настройки» (Macintosh).
-
Выберите категорию «Выделение цветом» из списка слева от диалогового окна «Настройки».
-
Щелкните поле цвета «Элементы библиотеки», затем выберите цвет выделения с помощью палитры цветов (либо введите в текстовое поле шестнадцатеричное значение цвета).
-
Установите флажок «Показать», чтобы выделение цветом отображалось в окне документа.
-
Нажмите кнопку «ОК».
Отображение или скрытие выделения цветом в окне документа
-
Чтобы отобразить выделение цветом, выберите «Вид» > «Параметры представления "Дизайн"» > «Невидимые элементы». Чтобы скрыть выделение цветом, отключите «Невидимые элементы».
Редактирование свойств элемента библиотеки
Инспектор свойств используется для открытия элемента библиотеки для редактирования, отсоединения выбранного элемента библиотеки от исходного файла либо замены элемента другим выделенным в данный момент элементом.
-
Выделите элемент библиотеки в документе.
-
Выберите один из следующих параметров в инспекторе свойств («Окно» > «Свойства»).
Src
Служит для отображения имени и расположения исходного файла элемента библиотеки. Эта информация не редактируется.
Открыть
Служит для открытия исходного файла элемента библиотеки с целью редактирования. Эквивалентно выбору элемента на панели «Ресурсы» и нажатию кнопки «Изменить».
Отсоединить от оригинала
Служит для разрыва связи между выбранным элементом библиотеки и его исходным файлом. Отсоединенный элемент можно редактировать в документе, но он более не является элементом библиотеки и не обновляется при изменении оригинала.
Создать заново
Служит для замены исходного элемента библиотеки выделенным элементом. Данная команда используется для повторного создания элемента библиотеки, если исходный элемент отсутствует или был случайно удален.
Включение возможности редактирования элементов библиотеки в документе
Если после добавления элемента библиотеки в документ возникает потребность в редактировании данного экземпляра элемента, необходимо разорвать связь между элементом, находящимся в документе, и соответствующим элементом библиотеки. После того как для экземпляра элемента библиотеки установлена возможность редактирования, обновление такого экземпляра при изменении элемента библиотеки выполняться не будет.
-
Выберите элемент библиотеки в текущем документе.
-
Нажмите кнопку «Отсоединить от оригинала» в инспекторе свойств («Окно» > «Свойства»).
Редактирование варианта поведения, содержащегося в элементе библиотеки
Чтобы отредактировать вариант поведения элемента библиотеки, вначале следует вставить элемент в документ, а затем сделать этот элемент редактируемым в документе. После внесения изменений в элемент документа можно повторно создать элемент библиотеки путем его замены элементом документа.
-
Откройте документ, в котором содержится элемент библиотеки.
Запишите имя элемента библиотеки и все его теги. Эта информация понадобится позже.
-
Выделите элемент библиотеки и нажмите кнопку «Отсоединить от оригинала» в инспекторе свойств («Окно» > «Свойства»).
-
Выделите элемент, которому назначен вариант поведения.
-
На панели «Поведение» («Окно» > «Поведение») дважды щелкните действие, которое необходимо изменить.
-
Внесите изменения в появившемся диалоговом окне и нажмите кнопку «ОК».
-
На панели «Ресурсы» выберите категорию «Библиотека».
-
Запишите точное имя с учетом регистра исходного элемента библиотеки, выделите его и нажмите кнопку «Удалить».
-
В окне документа выберите все элементы, которые входят в элемент библиотеки.
Убедитесь, что выбраны точно такие же элементы, которые содержались в исходном элементе библиотеки.
-
На панели «Ресурсы» нажмите кнопку «Создать элемент библиотеки» и назовите новый элемент так же, как и ранее удаленный (новое имя должно совпадать со старым посимвольно, включая регистр символов).
-
Чтобы обновить элемент библиотеки, используемый в других документах сайта, выберите команды «Инструменты» > «Библиотека» > «Обновить страницы».
-
Во всплывающем меню «Область поиска» выберите «Файлы, использующие».
-
Из соседнего всплывающего меню выберите только что созданный элемент библиотеки.
-
Убедитесь, что в группе «Обновить» выбран параметр «Элементы библиотеки», и нажмите кнопку «Начать».
-
По завершении обновлений нажмите кнопку «Закрыть».