Використання frontpage 2018 для розробки індивідуальних веб-вузлів, створених за допомогою служб

Зміна тем оформлення

Теми - це професійно підібрані набори правил форматування і графіки, які в сукупності визначають візуальне оформлення веб-вузла. Теми включають в себе дизайн кнопок, колір шрифту і правила форматування. При використанні тим разом зі службами Windows SharePoint Services, теми також включають в себе правила форматування відображення веб-частин і інших елементів на веб-сайті, створеному за допомогою служб Windows SharePoint Services.

подальші зміни

Повторення одного і того ж вмісту на декількох сторінках

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

Контроль над редагованими частинами веб-сторінок здійснюється за допомогою динамічних веб-шаблонів. Динамічні веб-шаблони представляють собою шаблони сторінок з зумовленими областями редагування, які залишаються пов'язаними зі сторінкою після її створення.

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

Малюнок 16 - Створення динамічного веб-шаблону в FrontPage

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

Малюнок 17 - Діалогове вікно Змінні області (Editable Regions)

Примітка. Якщо динамічний веб-шаблон включає в себе веб-частини або елементи управління або код ASP.NET, то пов'язані сторінки повинні мати розширення .aspx. При виникненні подібної ситуації Вам буде запропоновано зберегти сторінки з розширенням .aspx.

Області, керовані шаблоном, недоступні для редагування.

Розширені функції пошуку і заміни

Малюнок 18 - Діалогове вікно Пошук і заміна (Find and Replace)

оформлення

Зміна кольорів, шрифтів і форматування за допомогою власних тим

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

Каскадні таблиці стилів

Редагування замість створення

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

Збереження власної теми

Клацніть на темі, яку Ви бажаєте використовувати, і виберіть пункт Налаштування (Customize) для відкриття діалогового вікна Налаштування теми (Customize Theme). Натисніть на Кнопа Зберегти як (Save As) і в діалоговому вікні Збереження теми (Save Theme) введіть назву теми в поле Введіть нову назву теми (Enter new theme title) і двічі натисніть кнопку ОК. Таким чином, Ви зберегли нову тему, але поки не застосували її до веб-вузла.

Примітка. Ви можете створити власну тему з чистого аркуша, а потім відредагувати її в FrontPage. Для цього замість вибору існуючої теми та подальшого натискання кнопки Налаштування (Customize) просто натисніть кнопку Створити нову тему (Create new theme) внизу області завдань Тема (Theme).

Застосування власної теми до Вашого веб-сайту

Для того щоб застосувати власну тему до веб-сайту, клацніть на ній у вікні Вибрати тему (Select a theme) в області завдань Теми (Themes) і виберіть пункт Застосувати як тему за замовчуванням (Apply as default theme). З цього моменту будь-які зміни, внесені в тему, відіб'ються на всіх сторінках Вашого веб-сайту, включаючи нові сторінки.

Зміна кольорів на Вашому веб-сайті здійснюється за допомогою діалогового вікна Налаштування теми (Customize Theme). Воно є в області завдань Теми (Themes) (клацніть на темі і виберіть пункт Налаштування (Customize)). Натисніть кнопку Кольори (Colors) і потім перейдіть на вкладку Інший (Custom).

Кнопка Текст (Text) діалогового вікна Налаштування теми (Customize Theme) дозволяє змінити шрифти, що використовуються в тілі і заголовках сторінки.

Після того, як Ви закінчите редагування кольорів, графіки та шрифтів, двічі натисніть кнопку ОК. Підтвердіть збереження змін, натиснувши кнопку Так (Yes).

Для кожної теми існує близько 300 стилів. За допомогою цієї колекції стилів можна змінювати навіть найдрібніші елементи оформлення веб-вузла, створеного за допомогою служб Windows SharePoint Services. Більшість власних тим, що створюються Вами, змінюють лише незначне число доступних стилів. Якщо елемент, який Ви хочете змінити, чи не знаходиться в області дії квітів, графіки або шрифтів, то необхідно з'ясувати, яка таблиця каскадних стилів відповідає за зміни цього елемента.

Після того, як Ви з'ясували, який стиль необхідно змінити, редагування можна здійснити, натиснувши кнопку Текст (Text) в діалоговому вікні Налаштування теми (Customize Theme) і потім натиснувши кнопку Інші стилі тексту (More Text Styles). Відкриється діалогове вікно Стиль (Style), де Ви знайдете список усіх стилів, що застосовуються до даної теми. Виділіть стиль для, який Ви хочете редагувати, і натисніть кнопку Змінити (Modify) для відкриття діалогового вікна Зміна стилю (Modify Style).

Малюнок 19 - Діалогове вікно Зміна стилю (Modify Style)

Натисніть на кнопку Формат (Format) і виберіть відповідний елемент для змін: Шрифт (Font), Абзац (Paragraph), Кордон (Border), Список (Numbering) або Положення (Position). Кожен з цих елементів дає Вам повний контроль над можливим форматуванням. Наприклад, Ви можете змінити колір шрифту, збільшити відстань до або після тексту, додати кордон тільки зверху тексту або розташувати текст так, щоб він вирівнювався по правому краю. Існує необмежену кількість можливих варіантів.

Для використання цієї функції спочатку необхідно імпортувати зображення оформлення на Ваш веб-вузол. Для цього виберіть команду Імпорт (Import) в меню Файл (File). Створіть нову сторінку і в меню Вид (View) наведіть на пункт Зображення-зразок (Tracing Image). Виберіть пункт Налаштування (Configure) для відкриття діалогового вікна Зображення-зразок (Tracing Image). Натисніть кнопку Огляд (Browse), виберіть файл зображення Вашого оформлення та натисніть кнопку Відкрити (Open). Використовуйте повзунок Прозорість (Opacity) для регулювання прозорості зображення.

Малюнок 20 - Інструмент Зображення-зразок (Image Tracing)

Напівпрозора версія зображення оформлення з'явиться в якості фону Вашої сторінки. Ви можете використовувати всі знайомі Вам інструменти для створення веб-сторінки, яка буде накладатися поверх зображення-зразка. Можливість бачити оформлення при роботі над сторінкою набагато спрощує сам процес створення сторінки відповідно до вибраного дизайном. Щоб видалити зображення-зразок після закінчення створення сторінки, відкрийте діалогове вікно Зображення-зразок (Tracing Image) знову, очистіть шлях до файлу зображення дизайну і натисніть кнопку ОК.

Додавання ефектів такої різниці у поведінці на Ваші сторінки

Деякі оформлення веб-вузлів складаються з елементів, накладених один на одного. Наприклад, при оформленні веб-сторінки Вам може знадобитися розмістити зображення, а поверх цього зображення розмістити текст, який перекриває два осередки таблиці. Підтримка шарів програмою FrontPage дозволяє розмістити кілька елементів оформлення в одній області сторінки. У меню Формат (Format) виберіть пункт Шари (Layers) і натисніть кнопку Вставити шар (Insert Layer) для кожного вставляється шару. Отруюються блакитна смуга, за допомогою якої Ви можете визначити вміст кожного шару.

Малюнок 21 - Область завдань Шари (Layers)

Примітка. Ви можете поєднувати шари і функцію Поведінка (Behaviors) для додання сторінці інтерактивності. Наприклад, Ви можете задати шар, який відповідає за появу іншого шару, додавши функцію Поведінка (Behaviors) до першого шару.

Додавання новин і веб-журналу на Ваш веб-вузол за допомогою веб-пакетів

Веб-вузол новин і оглядів

Веб-журнали - це відмінний спосіб бесструктурного зберігання заміток на будь-яку тему. Пакет веб-журналу створює всі необхідні сторінки для розміщення журналу на існуючому вузлі або для створення нового веб-вузла. Для того щоб створити веб-журнал, в меню Файл (File) виберіть пункт Створити (New) і в відкрилася області завдань натисніть на засланні Веб-пакети (Web package solutions). Відкриється діалогове вікно Шаблони веб-вузлів (Web Site Templates). Виберіть шаблон Веб-журнал (Web Log) і в полі Вкажіть розташування нового веб-вузла (Specify the location of the new Web site) вкажіть шлях для створюваного вузла новин і оглядів. Для того щоб додати веб-журнал на існуючий вузол, переконайтеся, що встановлено прапорець Додати на поточний веб-вузол (Add to current Web site). Натисніть кнопку ОК для створення веб-вузла.

Переміщення або розгортання веб-вузла за допомогою веб-пакетів

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

Малюнок 22 - Діалогове вікно Експорт веб-пакета (Export Web Package)

У діалоговому вікні Імпорт веб-пакета (Import Web Package) введіть розташування для Вашого нового веб-вузла в текстовому полі Призначення (Destination). Переконайтеся, що у вікні Елементи з веб-пакета для імпорту (Items from Web package to import) всі вибрані Вами елементи відзначені прапорцями. Натисніть кнопку Імпорт (Import), а потім натисніть кнопку Так (Yes), щоб підтвердити установку веб-пакета. Таким чином, буде створено веб-вузол на основі обраного веб-пакета.

Малюнок 23 - Діалогове вікно Імпорт веб-пакета (Import Web Package)

Порада. Веб-пакети - це відмінний спосіб відтворити точну копію структури веб-сайту, проте вміст списків і бібліотек не включаються до веб-пакет. Якщо ж Ви хочете повністю перенести веб-вузол з одного місця в інше, включаючи всі списки, бібліотеки і структуру веб-вузла, то використовуйте засоби архівації і відновлення (Backup and Restore) замість створення веб-пакета. Функції Архівація веб-вузла (Backup Web Site) і Відновити веб-вузол (Restore Web Site) доступні з меню Інструменти (Tools) при наведенні курсору на пункт переробки деревних відходів (Servers). Для додаткової інформації про архівації та відновлення веб-вузлів за допомогою веб-пакетів зверніться до офіційного документу Переміщення веб-вузлів, створених за допомогою служб Microsoft Windows SharePoint Services (Moving Web Sites Created with Microsoft Windows SharePoint Services).

Робота з даними

Керовані даними рішення

Використовуючи представлення даних, Ви можете створити керовані даними рішення, відобразивши вистави «живих» або статичних даних з різних джерел. Уявлення даних відображають «живі» дані в режимі "тільки читання", отримані з будь-яких джерел, які можуть бути перетворені в XML. При цьому дані не зберігаються на веб-сайті. Джерела даних можуть включати в себе списки і бібліотеки SharePoint Services, файли XML, «живі» XML поля даних, веб-служби, серверні сценарії, OLEDB бази даних і так далі. Для створення динамічних веб-сторінок представлення даних використовують сторінки ASP.NET, засновані на серверних технологіях Microsoft .NET, і надають відвідувачам веб-вузла тільки оновлену інформацію.

Малюнок 24 - Область завдань Каталог джерел даних (Data Source Catalog)

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

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

Уявлення даних також дозволяють змінювати стилі уявлення, фільтрувати даних так, щоб відображалася лише інформація, що відповідає Вашому запиту, а також сортувати і групувати дані за Вашим вибором. Просто клацніть правою кнопкою миші на списку і виберіть пункт Властивості представлення даних (Data View Properties) для відкриття області завдань Відомості представлення даних (Data View Details). Далі перейдіть на вкладку Управління параметрами уявлення (Manage view settings) для зміни параметрів стилю, фільтрації, сортування та групування. Робота з уявленнями даних була описана в розділі цього документа «Списки і бібліотеки».

Малюнок 25 - Властивості вкладки Управління параметрами уявлення (Manage view settings)

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

Робота з веб-частинами

Для того щоб вставити зону веб-частини на сторінку, в меню Дані (Data) виберіть пункт Вставити зону веб-частини (Insert Web Part Zone), після чого зона веб-частини відобразиться на сторінці. Натисніть на посилання Вставити веб-частину (Click to insert a Web Part) в зоні веб-частини для відкриття області завдань Веб-частини (Web Parts). Потім Ви можете натискати і перетягувати веб-частини в зону веб-частин на сторінці. Таким чином, Ви можете створити свою власну сторінку веб-частини.

Малюнок 26 - Сторінка веб-частини з областю Зона веб-частини (Web Part Zone)

Вимірювання продуктивності і оцінка використання веб-вузла за допомогою звітів

Зведення по вузлу відображає ключову інформацію по веб-сайту, таку як:

  • Число звернень і завантажень.
  • Кількість файлів і зображень.
  • Кількість окремих файлів, на які немає посилань (такі файли можуть бути видалені за непотрібністю).
  • Повільно завантажуються сторінки.
  • Старі файли і так далі.

Цей звіт зручний для визначення і усунення критичних проблем на Вашому веб-сайті.

Аналіз використання дозволяє визначити, які веб-сторінки на Вашому веб-сайті більше відвідувані, а які менш (такі сторінки, можливо, більше не потребують оновлення).

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