Як створити шаблон adobe 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. Редаговані області в блокових елементах

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

Якщо ви вирішили залишити можливість додавати інші блокові елементи всередині даного елемента, тоді вам потрібно перенести кордону редагованої області за теги елементу. Ви можете це зробити в режимі відображення HTML-коду, або заново вказавши область, попередньо її видаливши.

8. Оцініть готовий шаблон

У готовому шаблоні редаговані області виділяються рамками, над якими буде ім'я області.

9. Створюємо сторінку на основі шаблону

Як тільки ви збережете шаблон, можете його використовувати на сайті: У меню Файл виберіть «Створити»;

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

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

10. Змініть шаблон - поновіть файли

Якщо пізніше вам необхідно внести якісь зміни в шаблон, відредагувати файл dwt в папці «Templates». Як тільки ви збережете зміни в шаблоні, Dreamweaver запитає чи не хочете ви оновити сторінки, створені на основі шаблону. Він також вкаже, які це файли.

Як тільки ви виявите «Оновити», всі файли, створені на основі цього шаблону, будуть оновлені. Вам тільки залишається зберегти їх і завантажити на веб-сервер.