Talking Templates у Dreamweaver

Багато програм веб-дизайну можуть похвалитися своїми шаблонами HTML. Насправді вони мають на увазі те, що вони включають в програму деякі готові дизайни сторінок. Dreamweaver робить цю концепцію ще на кілька стрибків, надаючи функції дизайну шаблонів, які дозволяють створити основний дизайн сторінки, а потім контролювати, які розділи можна, а які не можна змінювати. Це цінна функція, якщо ви працюєте з командою розробників різного рівня кваліфікації. Наприклад, якщо ви створюєте сайт для компанії з нерухомості і хочете дозволити співробітникам оновлювати оголошення про продаж, не маючи можливості зіпсувати дизайн сторінки, ідеальним рішенням може стати шаблон.

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

Залишайтеся вірним своєму шаблону

Однією з великих переваг використання функції шаблону Dreamweaver є те, що ви можете вказати, які області шаблону можна змінити. Це особливо корисно, якщо ви працюєте з людьми, які володіють різними рівнями навичок у HTML, і ви хочете, щоб більш просунутий дизайнер створив сторінку, яку менш досвідчена людина не зможе зіпсувати пізніше. З огляду на цю мету, шаблон має області, які можна редагувати, і заблоковані (не редаговані) області. Використовуйте області, які можна редагувати, для вмісту, який змінюється, наприклад опису продукту. Використовуйте заблоковані області для статичного, незмінного вмісту, такого як логотип або елементи навігації по сайту.

Ви можете змінити шаблон навіть після того, як ви використали його для створення документів. Потім, коли ви оновлюєте документи, які використовують шаблон, розділи цих документів, які не можна редагувати, оновлюються відповідно до змін, які ви внесли в шаблон.

Під час редагування самого шаблону ви можете вносити зміни до будь-якої частини файлу, будь то області, які можна редагувати або заблоковані. Однак під час редагування документа, створеного за шаблоном, ви можете вносити зміни лише до областей документа, які можна редагувати. Якщо ви повернетеся назад і зміните шаблон після його створення, Dreamweaver дає вам можливість відобразити ці зміни на всіх сторінках, які ви створили за допомогою цього шаблону, або лише на сторінці, яку ви зараз редагуєте.

Створення шаблонів

Створити шаблон так само легко, як і будь-який інший файл у Dreamweaver, як ви можете побачити в наступних кроках. Ви можете почати з існуючого HTML-документа і змінити його відповідно до ваших потреб, або ви можете створити абсолютно новий документ. Коли ви зберігаєте файл як шаблон, файл автоматично зберігається в папці Шаблони головної папки веб-сайту. Шаблони мають бути збережені в цій загальній папці, щоб автоматизовані функції Dreamweaver працювали належним чином. Якщо у вас ще немає папки Templates на вашому веб-сайті, Dreamweaver автоматично створює її, коли ви зберігаєте свій перший шаблон.

Функції шаблону працюють, лише якщо ви визначили свій веб-сайт у Dreamweaver

Усі елементи шаблону заблоковані за замовчуванням, окрім розділу заголовка документа, який позначається

теги. (Розділ заголовка документа, який не заблоковано, є покращенням у Dreamweaver 4 — у Dreamweaver 3 ви не могли зробити область заголовка доступною для редагування.). Щоб шаблон був корисним для створення нових сторінок, ви також повинні зробити інші області сторінки доступними для редагування. Пам’ятайте, що ви завжди можете повернутися до шаблону і зробити більше областей доступними для редагування або видалити можливість редагування певних областей пізніше.

Щоб створити шаблон із областями, які можна редагувати, виконайте такі дії:

1. Виберіть Вікно –> Шаблони.

2. На панелі «Шаблони» клацніть стрілку у верхньому правому куті та виберіть «Новий шаблон» зі спадного меню, що відкриється.

До списку шаблонів на панелі додається новий шаблон без назви.

3. Вибравши шаблон, введіть ім’я шаблону так само, як і будь-який файл у Finder на Mac або Explorer на ПК.

Новий шаблон додається до списку Шаблони для сайту.

4. Після того, як ви назвете новий шаблон, двічі клацніть його назву, щоб відкрити його.

Сторінка шаблону відкривається в Dreamweaver, як і будь-яка інша сторінка HTML, за винятком того, що ім'я файлу закінчується розширенням .dwt.

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

5. Виберіть «Змінити» –> «Властивості сторінки», щоб вказати кольори фону, тексту та посилання.

Далі ви розміщуєте деякий текст або зображення на сторінці як заповнювачі для інформації, яку ви, можливо, захочете змінити в майбутньому.

6. Щоб зробити зображення або текстову область доступними для редагування, виділіть зображення або текст, а потім виберіть Змінити –> Шаблони –> Нова область для редагування. (Зображення або текст, які ви вибрали як доступні для редагування, стають областю, яку можна змінити на будь-якій сторінці, створеній за допомогою шаблону. Області, які ви не позначили як редаговані, стають фіксованими і їх можна буде змінити, лише якщо ви зміните сам шаблон.)

Відкриється діалогове вікно Нова область для редагування.

7. У текстовому полі «Ім’я» введіть назву для редагованої області.

Текст або зображення виділено в шаблоні, що означає, що його можна редагувати. Ви можете називати регіон як завгодно, але якщо вибрати щось, що відповідає типу інформації, яку ви збираєтеся розмістити в області, вам буде легше запам’ятати.

8. Щоб зробити інші зображення або текстові області доступними для редагування, повторіть кроки 6 і 7.

9. Збережіть шаблон і закрийте файл, коли закінчите.

Можна редагувати цілу таблицю або окрему комірку таблиці, але не можна одночасно редагувати декілька комірок, якщо спочатку не об’єднати їх. Ви повинні виділяти кожну клітинку по черзі, якщо ви хочете зробити деякі клітинки в таблиці доступними для редагування, але не інші. Шари та вміст шару також розглядаються як окремі елементи, але кожен із них може бути позначений як доступний для редагування. Зробивши шар доступним для редагування, ви зможете змінити його положення. Зробити вміст шару доступним для редагування означає, що ви можете змінити вміст шару, наприклад текст або зображення в шарі.