Материал: Використання складних елементів при оформленні Web

Проглянути вид вибраного шаблону ви можете в області Зразок (Preview|). Підібравши шаблон, що влаштовує вас, двічі клацніть на нім або натисніть кнопку ОК.

5. Відкривається сторінка, що має вигляд, аналогічний представленому на мал. 20.22.

Відповідно до типу вибраного шаблону, сторінка розбита на облас-•| ти|, кожна з яких містить по дві кнопки:

• Задати початкову сторінку (Set| Initial| Page|) — при натисненні на дану кнопку відкривається діалогове вікно Додавання гіперпосилання (Insert| Hyperlink|), що дозволяє вказати сторінку, яка розміщуватиметься в цій області фрейма при його відкритті

• Створити сторінку (New| Page|) — завантажує у фрейм нову сторінку шаблонаОбычная| сторінка (Normal| Page|)

Мал. 20.22. Шаблон фрейма Зміст

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

Мал. 20.24. Вибраний шаблон фрейма Оголошення і зміст

Мал. 20.25. Діалогове вікно Додавання гіперпосилання дозволяє вказати сторінку, яка розміщуватиметься у фреймі при його завантаженні

14. Використовуючи кнопки Задати початкову сторінку (Set| Initial| Page|) решти областей фрейма, помістите в них створені сторінки content_f|.htm і main_f|.htm.

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

15. В області змісту виділіть перший елемент списку і виберіть в його контекстному меню команду Гіперпосилання (Hyperlink|). 16. У полі Адреса (Address|) діалогового вікна , що відкрилося, Додавання гіперпосилання(Insert| Hyperlink|) вкажіть назва сторінки, що містить інформацію з даного питання, клацнувши на файлі new_books|.htm. 17. Для вказівки області фрейма, в яку вказана сторінка повинна завантажуватися, натисніть у вікні Додавання гіперпосилання кнопку Вибір рамки (Target| Frame|). 18. Відкривається діалогове вікно Кінцева рамка (Target| Frame|), в області Поточна сторінка рамок (Current| frames| page|) якого відображається структура фрейма (мал. 20.26). Для вказівки місця завантаження сторінки можна використовувати дану структуру або значення списку Загальні об'єкти (Common| targets|). Клацніть мишею в необхідній області структури. Вона забарвлюється в синій колір (мал. 20.27).

Мал. 20.26. Діалогове вікно Кінцева рамка

Мал. 20.27. Діалогове вікно Кінцева рамка з вибраною областю кінцевого фрейма, в яку завантажуватиметься сторінка

19. Натисніть кнопку ОК для закриття діалогового вікна Кінцева рамка (Target| Frame|). 20. Ви повертаєтеся в діалогове вікно Додавання гіперпосилання (Insert| Hyperlink|), в якому також натисніть кнопку ОК. 21. Аналогічним чином для всіх елементів списку змісту вкажіть найменування завантажуваних сторінок і область фрейма, в якій ці сторінки відображатимуться.  22. Для збереження фрейма натисніть кнопку Зберегти (Save|) на стандартній панелі інструментів. У діалоговому вікні , що відкрилося, Зберегти як (Save| As|) задайте найменування файлу index|.htm і натисніть кнопку Зберегти. 23. Проглянете, як виглядатиме створений фрейм в оглядачі. Для цього виберіть вкладку Перегляд (Preview|) в нижній частині робочої області.

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

Мал. 20.28. Відображення сторінки розділу в правій області фрейма при його виборі із змісту

У розглянутому прикладі ми встановлювали в діалоговому вікні Кінцева рамка (Target| Frame|) один і той же кінцевий фрейм для всіх посилань змісту. Можна було прискорити процедуру призначення, встановивши кінцевий фрейм за умовчанням для всіх посилань сторінки. Для цього необхідно було виконати наступні дії:

1. Відкрити діалогове вікно Властивості сторінки (Page| Properties|), клацнувши правою кнопкою миші в будь-якому місці сторінки і вибравши в контекстному меню команду Властивості сторінки (Page| Properties|).  2. На вкладці Загальні (General|) натиснути кнопку Змінити кінцеву рамку (Change| target| frame|) , розташовану праворуч від поля Кінцева рамка за умовчанням (Default| target| frame|). 3. У області Поточна сторінка рамок (Current| frames| page|) діалогового вікна , що відкрилося, Кінцева рамка (Target| Frame|), що відображає структуру фрейма, вибрати за допомогою миші необхідну область. 4. Натиснути кнопку ОК для закриття діалогового вікна Кінцева рамка. 5. Закрити діалогове вікно Властивості сторінки, натиснувши кнопку ОК.

Режими проглядання фрейма

У нижній частині робочої області програми FrontPage| при розміщенні в ній фрейма (див. мал. 20.28) замість трьох вкладок, відповідних режимам проглядання звичайних Web-страниц|, з'являється п'ять. Їх призначення описане в табл. 20.5.

Таблиця 20.5. Режими проглядання фрейма

Властивості фреймів

Для настройки властивостей фрейма використовується дишюговое| вікно Властивості рамки (мал. 20.29). Щоб його відкрити, виділите фрейм і виконаєте одну з наступних дій:

• У меню Рамки (Frame|) виберіть команду Властивості рамки (Frame| Properties|)

• Клацніть правою кнопкою миші і виберіть команду контекстного меню Властивості рамки (Frame| Properties|)

Мал. 20.29. Діалогове вікно Властивості рамки

У верхній частині діалогового вікна розташовано два поля. Поле Ім'я (Name|) містить назва редагованого фрейма, а поле Початкова сторінка (Initial| page|) — назва сторінки, що відображається в даному фреймі при його початковому завантаженні. Для зміни початкової сторінки необхідно натиснути кнопку Огляд (Browse|), розташовану праворуч від поля. При цьому відкривається діалогове вікно Зміна гіперпосилання (Edit| Hyperlink|), що дозволяє вказати для завантаження іншу сторінку.

Область Розмір рамки (Frame| size|) містить поля Ширина стовпця (Column| Width|) иВысота| (Height|), вказуючі розміри фрейма. Звернете увагу, що поле, задаюче ширину фрейма, для якого відкрито вікно властивостей, не доступно для модифікації. Це пов'язано з тим, що фрейм, що розглядається нами, займає всю ширину фреймсета|, яка і визначає його розмір. При зміні розміру фрейма змінюються також розміри всіх фреймів, що граничать з ним. Для вказівки одиниць, в яких задаються розміри, використовуються розташовані праворуч від полів списки, що розкриваються, містять наступні значення:

• крапки (Pixels|)

• відносна (Relative|)

• відсотки (Percent|)

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

За допомогою полів Ширина (Width|) і Висота (Height|) області Поля (Margins|) можна задати розміри полий сторінки, тобто інтервали між вмістом сторінки і межами фрейма. Об'єкти інтерфейсу, розташовані в області Параметри(Options|), дозволяють управляти фреймом при прогляданні його в оглядачі. Наприклад, при встановленому прапорці Змінювати розмір в оглядачі (Resizable| in| browser|) можна за допомогою миші змінити розміри фреймів на свій розсуд, а, використовуючи значення списку Смуги прокрутки , що розкривається, — вказати, чи відображати у фреймах смуги прокрутки. Список містить наступні значення:

• при необхідності (If| Needed|)

• ніколи (Never|)

• завжди (Always|)

Для фрейма, що містить заголовок, звичайно, немає сенсу використовувати значення при необхідності (If| Needed|) або завжди (Always|) — підійде значення ніколи (Never|). В тому випадку, якщо вміст фрейма міняється залежно від завантаженої в нього сторінки, розумно використовувати значення при необхідності (If| Needed|), оскільки якщо вся інформація в нім поміщається, то смуга прокрутки буде відсутня. Якщо інформації буде багато, смуга прокрутки з'явиться.

Кнопка Стиль (Style|), розташована в нижньому лівому кутку діалогового вікна Властивості рамки, дозволяє змінити пов'язану з фреймом таблицю стилів.

При натисненні кнопки Сторінка рамок (Frame| Page|) області Параметри відкривається діалогове вікно Властивості сторінки (Page| Properties|) (мал. 20.30), в якій за умовчанням вибрана вкладка Рамки (Frames|). Вона містить параметри, що відносяться до фреймсету|.

Мал. 20.30. Вкладка Рамки діалогового вікна Властивості сторінки

Поле Інтервал між рамками (Frame| Spacing|) дозволяє вказати товщину розділових ліній між фреймами на сторінці. Прапорець Показати межі (Show| Borders|) визначає, чи показувати розділові лінії між фреймами.

Управління фреймами

Для зміни розмірів фрейма, розміщеного на сторінці, можна використовувати не тільки діалогове вікно Властивості рамки (Frame| Properties|), але і мишу. Досить встановити курсор на межу двох фреймів і, коли курсор прийме вид двонаправленої стрілки, переміщати в ту або іншу сторону.

У фреймсет| можна додавати нові фрейми або видалити фрейми, які більше не потрібні. Для додавання нового фрейма виконаєте наступні дії:

1. Натисніть і утримуйте клавишу<Ctrl|>. 2. Встановите курсор на рамку, перед або вище за яку хочете додати новий фрейм. Під курсором з'являється підказка Для розділення рамки перетягуйте її при натиснутій клавіші Ctrl| (Ctrl+Drag| to| split| frame|). 3. Натисніть кнопку миші і, утримуючи, переміщайте курсор в потрібну сторону до утворення області необхідного розміру. 4. Відпустите клавишу<Ctrl|> і кнопку миші.

Мал. 20.31. Додавання у фреймсет| нового фрейма

Новий фрейм (мал. 20.31), що утворився, містить кнопки Задати початкову сторінку (Set| Initial| Page|) і Створити сторінку (New| Page|), що дозволяють визначити завантажувані в нього сторінки.

Для додавання у фреймсет| нового фрейма можна також використовувати команду меню:

1. Виділите фрейм, область якого хочете розбити на дві частини, шелкнув| на нім мишею. 2. У меню Рамки (Frame|) виберіть команду Розділити рамку (Split| Frame|). 3. У діалоговому вікні , що відкрилося, Розділити рамку (Split| Frame|) (мал. 20.32), що містить опції Розбити на стовпці (Split| into| columns|) n Розбити на рядки (Split| into| rows|), встановите необхідну опцію. 4. Натисніть кнопку ОК.

Мал. 20.32. Діалогове вікно Розділити рамку

Щоб видалити фрейм з фреймсета|, встановите на нього курсор і в меню Рамки (Frame|) виберіть команду Видалити рамку (Delete| Frame|). Місце, що звільнилося після видалення фрейма, буде зайнято фреймами, що залишилися.

Використання компонентів при створенні Web-страниц|

Использование подстановок  Счетчик посещений  Включаемая страница Страница, включаемая по расписанию Изображение, включаемое по расписанию  Компонент поиска  Компонент создания оглавления  Подтверждение введенной информации

Використання підстановок

Компоненти, що надаються в розпорядження розробника програмою FrontPage|, є готовими до застосування програмними модулями, для використання яких досить набудувати властивості компонентів. За рахунок застосування компонентів розширюються функціональні можливості Web-узла|, прискорюється процес розробки і відпадає необхідність програмування в тих випадках, коли за вас це зробили інші.

Так, наприклад, компонент Підстановка (Substitution|) дозволяє розміщувати на Web-страницах| інформацію, що задається за допомогою змінних. При зміні значення змінній відбудеться автоматичне оновлення даних на всіх Web-страницах|, де ця змінна використовується.

Компонент Сторінка (include| Page|) вставляє вміст окремої сторінки в інші сторінки Web-узла|. Даний об'єкт зручний для розміщення в Web-узле| періодично оновлюваної інформації, яка повинна бути присутньою на декількох сторінках. Зміни, здійснені на початковій сторінці, автоматично будуть відображені у всіх місцях, де ця сторінка використовується.

Для реклами якого-небудь товару, анонса майбутньої виставки або розпродажу можна використовувати компоненти Сторінка з розкладом (Scheduled| Include| Page|) і Малюнок з розкладом (Scheduled| Picture|), що Дозволяють включити в Web-страницу| інформацію або графічне зображення на певний період часу, після чого вони виключаються із сторінки.

Розміщення на домашній сторінці компоненту Лічильник відвідин (Hit| Counter|) дозволить отримати відомості про те, як популярний у користувачів ваш Web-узел|, а компонент Форма пошуку (Search| Form|) полегшить відвідувачам пошук необхідної інформації.