Как создать шаблон Dreamweaver.

Шаблоны Dreamweaver решают проблему, с которой сталкиваются многие компании – как поддерживать сайт и оставлять стандартные разделы стандартными. Обычным решением является использование SSI (Серверные вставки), но не все веб-сервера поддерживают эту технологию. Есть другие способы, посредством которых можно включить один html-файл в другой, но все они используют или программы на стороне сервера, или java-скрипты на на стороне пользователя.

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

1. Начинаем с макета

Самый простой способ создания шаблона на Dreamweaver – начать с макета, на основе которого вы хотите создать шаблон. Я использую усовершенствованную версию бесплатного шаблона: слева – навигация, вверху – шапка, а также фото и цвета.

Так как существует возможность создания шаблона Dreamweaver с нуля, многие считают, что легче сначала сделать дизайн, а потом решить, что в нем будет изменяться, а что будет частью шаблона.

2. «Сохранить как шаблон…» – в меню Файл

В меню Файл есть опция «Сохранить как шаблон…». Выберите её, чтобы сохранить созданный дизайн как шаблон Dreamweaver.

Примечание. Шаблоны Dreamweaver создаются как часть сайта Dreamweaver. Если у вас не определён ни один сайт, вам нужно создать сайт в Dreamweaver перед созданием шаблона.

3. Сделайте описание шаблона

Выберите сайт, на котором вы хотите использовать шаблон. Я буду его использовать на сайте «Dreamweaver Examples». Название вашего сайта будет отличаться.

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

4. Создание папки для хранения шаблонов

У моего сайта уже есть папка для шаблонов. Но если её не было, Dreamweaver автоматически создаст такую.

Все шаблоны Dreamweaver хранятся в папке «templates» на вашем сайте, и имеют расширение *.dwt (сокращенно от Dreamweaver Template).

5. Начинаем добавлять редактируемые области

  • Выберите часть текста, которую хотите сделать изменяемой.
  • Перейдите в пункт меню Вставка — Объекты шаблона.
  • Выберите «Редактируемая область».

Есть и другие объекты шаблона, но они выходят за рамки данного урока.

6. Задайте имя Редактируемой области

Вы можете оставить имя, которое Dreamweaver задал по умолчанию, но я рекомендую задать описывающее имя, что позже напомнит вам, какая именно информация должна содержаться в этой области.

7. Редактируемые области в блочных элементах

Если вы попробуете разместить редактируемые области внутри блочных элементов (таких как заголовок, параграф), Dreamweaver выдаст предупреждение. Если вы оставите область внутри блочного элемента, ваши авторы контента не смогут внедрить туда какие-либо другие HTML-элементы.

Я использую это, когда хочу убедиться, что заголовок останется заголовком, или необходимо конкретное количество параграфов или других элементов в шаблоне.

Если вы решили оставить возможность добавлять другие блочные элементы внутри данного элемента, тогда вам нужно перенести границы редактируемой области за теги элемента. Вы можете это сделать в режиме отображения HTML-кода, или заново указав область, предварительно её удалив.

8. Оцените готовый шаблон

В готовом шаблоне редактируемые области выделяются рамками, над которыми будет имя области.

9. Создаем страницу на основе шаблона

Как только вы сохраните шаблон, можете его использовать на сайте:В меню Файл выберите «Создать»;

  • Перейдите ко вкладке «Страница из шаблона»;
  • Выберите созданный шаблон;
  • Удостоверьтесь, что выбран пункт «Обновлять страницу при изменении шаблона»;
  • Нажмите «Создать».

Теперь вы можете вносить изменения, но только в редактируемые области. Dreamweaver не позволит вам изменять другие части шаблона.

10. Измените шаблон – обновите файлы

как создать шаблон Dreamweaver

Если позже вам необходимо внести какие-то изменения в шаблон, отредактируйте файл dwt в папке «Templates». Как только вы сохраните изменения в шаблоне, Dreamweaver спросит не хотите ли вы обновить страницы, созданные на основе шаблона. Он также укажет, какие это файлы.

Как только вы кликните «Обновить», все файлы, созданные на основе этого шаблона, будут обновлены. Вам только остается сохранить их и загрузить на веб-сервер.

2
Сен

Вверх