Панель ссылок

Для перемещения между страницами Web-узла используют ссылки и панели ссылок. В чем же отличие между ними? Ссылки могут размещаться в произвольном месте Web-страницы, внутри текста и предназначаются, в основном, для перехода к какому-то определенному месту Web-страницы для просмотра информации по конкретному вопросу, заинтересовавшему посетителя Web-узла.

Панели ссылок — это несколько расположенных рядом ссылок, размещаемых, как правило, на страницах в специально отведенных для них местах, называемых общими областями, в верхней части или с левой стороны страницы.

Предупреждение

Панели ссылок можно располагать в общей области и с правой стороны страницы. Но этого не стоит делать, так как при просмотре Web-страницы в обозревателе на мониторе с небольшим разрешением экрана эта область может быть не видна пользователю.

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

При создании Web-узла с помощью мастера панели ссылок размещаются на страницах автоматически с учетом тех указаний, которые вы даете мастеру в процессе его работы. В том случае, если вы создаете Web-узел без использования мастера, о размещении панелей ссылок вам необходимо позаботиться самостоятельно, используя для этого режим работы Переходы (Navigation). При создании панелей ссылок в зависимости от выбранного мастера FrontPage может использовать структуру Web-узла, созданную вами в режиме Переходы, или формировать ее самостоятельно. Поэтому в процессе разработки Web-узла желательно в режиме Переходы определить иерархию страниц, которая впоследствии будет использована программой FrontPage при создании панелей ссылок.

Создание панели ссылок

Для создания на Web-странице панели ссылок предназначена команда Панель ссылок (Navigation) меню Вставка (Insert). При выборе этой команды на экране открывается диалоговое окно Вставка компонента веб-узла (Insert Web Component) (рис. 16.23), используемое для создания Web-компонентов. Окно содержит два списка. В списке Тип компонента (Component type) no умолчанию выделено значение Панели ссылок (Link Bars), указывающее, что будет создаваться панель ссылок. В списке Выберите тип панели приведен список типов возможных вариантов построения панели ссылок:

• Панель с пользовательскими ссылками (Bar with custom links) — панель, содержащая ссылки на страницы, список которых формируется пользователем в процессе работы мастера.
• Панель со ссылками назад и вперед (Bar with back and next links) — панель, содержащая ссылки на предыдущую и следующую страницы.
• Панель, основанная на структуре переходов (Bar based on navigation structure structure) — панель ссылок, создаваемая с использованием структуры переходов Web-узла, разработанной пользователем программы FrontPage.

Рис. 16.23. Диалоговое окно Вставка компонента веб-узла

Создание панели ссылок состоит из нескольких шагов. Из списка Выберите тип панели вы выбираете тип создаваемой панели и нажимаете кнопку Далее. FrontPage предлагает выполнить ряд последовательных действий, в результате которых на Web-странице появляется панель ссылок. Рассмотрим создание панели ссылок более подробно.

Наш тестовый Web-узел содержит домашнюю и несколько Web-страниц, располагаемых на втором уровне иерархии и являющихся братьями по отношению друг к другу. Создавая панель ссылок, мы предполагаем, что с ее помощью мы сможем переходить с домашней страницы на любую страницу Web-узла. В свою очередь, панель ссылок, располагаемая на страницах второго уровня иерархии, будет использоваться как для перехода на домашнюю страницу, так и на любые страницы-братья. Для размещения панели ссылок на домашней странице будем использовать значение Панель с пользовательскими ссылками диалогового окна Вставка компонента веб-узла (Insert Web Component), предполагающее, что панель будет содержать ссылки на страницы, список которых мы сформируем в процессе создания панели. Для размещения панели ссылок на странице второго уровня иерархии будем использовать значение Панель, основанная на структуре переходов, использующее структуру Web-узла, созданную в режиме работы Переходы.

Для размещения на страницах тестового Web-узла панелей ссылок выполните следующие действия:

1. Откройте создаваемый нами тестовый Web-узел.
2. Перейдите в режим работы Переходы, нажав одноименную кнопку на панели Представления (Views).
3. В центре рабочей области программы FrontPage расположен прямоугольник, обозначающий домашнюю страницу Web-узла. Используя мышь, поочередно перенесите из области структуры папок в рабочую область программы страницы, размещая их под домашней страницей таким образом, чтобы они все соединялись с ней линиями. 4. Измените наименования страниц, учитывая, что именно эти имена дадут названия кнопкам на панелях ссылок. Для переименования в контекстном меню каждого прямоугольника, обозначающего страницу, выберите команду Переименовать (Rename). В ставшее активным поле имени введите необходимое название и нажмите клавишу <Enter>. На рис. 16.24 представлена созданная карта переходов.

Рис. 16.24. Карта переходов тестового Web-узла

5. Перейдите в режим редактирования домашней страницы. Для этого на карте переходов дважды щелкните мышью на прямоугольнике этой страницы.
6. На домашней странице установите курсор в строку, в которой хотите расположить панель ссылок.
7. В меню Вставка (Insert) выберите команду Панель ссылок (Navigation).
8. На экране открывается диалоговое окно Вставка компонента веб-узла (Insert Web Component) (см. рис. 16.23). В списке Тип компонента (Component type) по умолчанию выделено значение Панели ссылок (Link Bars), указывающее, что будет создаваться панель ссылок. В правом списке курсор установлен на значении Панель с пользовательскими ссылками (Bar with custom links). Нажмите кнопку Далее (Next).
9. Диалоговое окно Вставка компонента веб-узла (Insert Web Component) изменяется, принимая вид, показанный на рис. 16.25. В нем необходимо задать стиль оформления панели ссылок, используя содержащиеся в списке варианты тем. Первое в списке значение предполагает панель ссылок на основе темы, используемой в оформлении страницы. Оставьте это значение и нажмите кнопку Далее.

Рис. 16.25. Выбор стиля оформления панели ссылок

10. На следующем шаге необходимо указать ориентацию панели навигации из двух предлагаемых значений: горизонтальная или вертикальная (рис. 16.26). Область Выберите ориентация (Choose an orientation) содержит две опции:

•  По горизонтали (Horizontal) — кнопки на панели ссылок размещены по горизонтали в один ряд. В том случае, если они не все помещаются на одной строке, остальные размещаются на следующих строках
•  По вертикали (Vertical) — кнопки на панели ссылок размещены друг под другом в один столбец

Рис. 16.26. Выбор ориентации панели навигации

Совет

Опция По горизонтали используется для компактного размещения панели навигации в верхней части Web-страницы. Если вы помещаете панель с левой стороны страницы, используйте опцию По вертикали.

Оставьте установленное по умолчанию значение По горизонтали и нажмите кнопку Готово.

11. Открывается диалоговое окно Создание панели ссылок (Create New Link Bar) (рис. 16.27). В поле Имя (Name) введите наименование создаваемой панели навигации и нажмите кнопку ОК.

Рис. 16.27. Диалоговое окно Создание панели ссылок

12. На следующем шаге открывается диалоговое окно Свойства панели ссылок (Link Bar Properties) (рис. 16.28), содержащее две вкладки. Вкладка Общие (General) предназначена для формирования списка ссылок, размещаемых на панели. Вкладка Стиль (Style) позволяет изменить тему, используемую в оформлении панели, и ее ориентацию.

Рис. 16.28. Диалоговое окно Свойства панели ссылок

В верхней части вкладки Общие расположен список Существующие (Choose existing) созданных в Web-узле панелей ссылок. В нем содержится название панели, введенное нами в диалоговом окне Создание панели ссылок. Справа от списка расположена кнопка Добавить ссылку (Create new), открывающая окно для ввода названия новой панели ссылок. При выборе из списка Существующие названия существующей панели, в списке Ссылки (Links) отображается список ссылок, содержащихся на этой панели справа. Справа от списка Ссылки находятся кнопки, имеющие следующее назначение:

•  Добавить ссылку (Add link) — открывает диалоговое окно Добавить на панель ссылок (Add to Link Bar) (рис. 16.29), позволяющее указать страницу, на которую создается ссылка.
•  Удалить ссылку (Remove link) — удаляет ссылку, выделенную в списке, с панели навигации.
•  Изменить ссылку (Modify link) — открывает диатоговое окно Изменить ссылку, аналогичное используемому при добавлении ссылки (см. рис. 16.29). Оно позволяет изменить страницу, на которую осуществляется ссылка.
•  Вверх (Move up) — изменяет порядок расположения ссылок в списке, перемещая текущую ссылку на одну позицию вверх.
•  Вниз (Move down) — изменяет порядок расположения ссылок в списке, перемещая текущую ссылку на одну позицию вниз.

Замечание

Порядок следования ссылок на панели определяется порядком расположения ссылок в списке Ссылки (Links) диалогового окна Свойства панели ссылок (Link Bar Properties).

Рис. 16.29. Диалоговое окно Добавить на панель ссылок

Диалоговое окно Свойства панели ссылок содержит также два флажка:

•  Домашняя страница (Home page) — добавляет на панель ссылку на домашнюю страницу
•  Родительская страница (Parent page) — указывает, добавлять ли на панель ссылку на родительскую страницу

13. Сформируем список ссылок панели навигации домашней страницы нашего тестового Web-узла. Чтобы добавить в список Ссылки (Links) ссылку, нажмите кнопку Добавить ссылку (Add link).
14. Открывается диалоговое окно Добавить на панель ссылок (Add to Link Ваг). Оно позволяет создать ссылку на страницу текущего Web-узла, Web-страницу в Интернете, на локальные файлы компьютера, адрес электронной почты или на закладку. В поле Текст (Text to display) введите текст, который будет отображаться на панели ссылок. Из списка страниц выберите страницу, щелкнув на ее названии. Название страницы будет перенесено в поле Адрес (Address) (см. рис. 16.29). Завершив установку параметров, нажмите кнопку ОК.
15. Диалоговое окно Добавить на панель ссылок закрывается, а текст, введенный в поле Текст, помещается в список Ссылки. Повторяя действия, описанные в пп. 13-14, сформируйте список всех ссылок панели навигации.
16. Закройте диалоговое окно Свойства панели ссылок, нажав кнопку ОК. На домашней странице появляется созданная панель ссылок (рис. 16.30). Она содержит ссылки на все страницы Web-узла, кроме домашней. Кроме того, в режиме редактирования на панели виден текст добавление ссылки (add link), открывающий диалоговое окно, позволяющее добавить новую ссылку.

Рис. 16.30. Домашняя страница с размещенной панелью ссылок

17. Откройте в режиме редактирования любую страницу второго уровня иерархии. Для этого на панели Список папок дважды щелкните мышью на ее значке.
18. Установите курсор на строку, в которой хотите расположить панель ссылок.
19. В меню Вставка (Insert) выберите команду Панель ссылок (Navigation). Открывается диалоговое окно Вставка компонента веб-узла (Insert Web Component) (см. рис. 16.23).
20. В списке Выберите тип панели (Choose a bar type) выберите значение Панель, основанная на структуре переходов (Bar based on navigation structure structure), указывающее, что панель ссылок будет создаваться на основе созданной нами структуры переходов Web-узла, и нажмите кнопку Далее.
21. Открывается окно мастера (см. рис. 16.25), в котором задайте стиль оформления панели навигации, используя содержащиеся в списке варианты тем. Затем нажмите кнопку Далее.
22. На следующем шаге (см. рис. 16.26) укажите ориентацию панели навигации из двух предлагаемых значений (вертикальная или горизонтальная), после чего нажмите кнопку Готово (Finish).
23. Открывается диалоговое окно Свойства панели ссылок (Link Bar Properties) (рис. 16.31), содержащее две вкладки. Вкладка Общие (General) служит для указания типа формируемой панели навигации. Вкладка Стиль (Style) позволяет изменить тему, используемую в оформлении панели, и ее ориентацию.

Рис. 16.31. Диалоговое окно Свойства панели ссылок

Область Добавляемые ссылки (Hyperlinks to add to page) вкладки Общие содержит опции, позволяющие указать, ссылки на какие страницы необходимо включить в панель ссылок. При выборе той или иной опции внесенные изменения отображаются на схеме, расположенной слева:

•  Родительский уровень (Parent level) — размещает на панели ссылки на страницы родительского уровня
•  Тот же уровень (Same level) — размещает на панели навигации ссылки на страницы текущего уровня иерархии
•  Назад и далее (Back and next) — размещает на панели навигации ссылки на предыдущую и следующую страницы текущего уровня
•  Дочерний уровень (Child level) — размещает на панели навигации ссылки на страницы дочернего уровня
•  Глобальный уровень (Global level) — размещает на панели навигации ссылки на страницы верхнего уровня
•  Дочерние страницы домашней (Child pages under Home) — размещает на панели навигации ссылки на страницы, дочерние по отношению к домашней странице

Установите для панели ссылок, размещаемой на странице второго уровня иерархии, опцию Тот же уровень (Same level). В этом случае с помощью созданной панели ссылок можно будет переходить на все страницы ' текущего уровня иерархии.

24. Область Дополнительно (Additional pages) вкладки Общие содержит два флажка. При установке флажка домашняя страница (Home page) на панель ссылок добавляется ссылка на домашнюю страницу. Флажок родительская страница (Parent page) указывает, создавать ли ссылку на родительскую страницу. Чтобы добавить на панель ссылок ссылку на домашнюю страницу, установите флажок домашняя страница.
25. Если хотите изменить стиль оформления панели навигации или ее ориентацию на странице, перейдите на вкладку Стиль и выполните требуемые изменения.
26. Нажмите кнопку ОК для закрытия диалогового окна Свойства панели ссылок. На странице появляется созданная панель ссылок (рис. 16.32). Она содержит ссылки на все страницы Web-узла, включая и домашнюю.
27. Аналогичным образом расположите панели навигации на других страницах Web-узла. Для ускорения создания панелей навигации вы можете скопировать созданную панель, воспользовавшись командой Копировать (Сору) контекстного меню, затем вставить ее из буфера обмена на другие Web-страницы командой Вставить (Paste), так как все они имеют тот же уровень иерархии. Кроме того, при создании панели, аналогичной той, что имеется на других страницах Web-узла, можно использовать список Существующие (Choose existing) с названиями всех созданных панелей диалогового окна Свойства панели ссылок (Link Bar Properties) (см. рис. 16.28).

Рис. 16.32. Web-страница второго уровня иерархии с размещенной панелью навигации

Рис. 16.33. Вид панели ссылок при использовании темы Движение

Создание панелей ссылок завершено. Загрузите Web-узел в обозреватель и проверьте действие ссылок.

Используя темы оформления, предлагаемые программой FrontPage, вы можете подобрать для панелей ссылок более интересный и привлекательный стиль оформления. Для этого в меню Формат (Format) выберите команду Тема (Theme) и просмотрите предложенные варианты тем. На рис. 16.33 представлена домашняя страница нашего тестового Web-узла, оформленная с применением темы Движение.

Stamps-Provisorio-Russia!!!

 

Письмо Гришкину Александру Витальевичу/Псков/