FrontPage
Программа создания сайтов

       

Размещение на страницах тестового сайта панелей ссылок

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

1. Откройте создаваемый нами тестовый сайт.

2. Перейдите в режим работы Переходы, нажав одноименную кнопку на панели Представления (Views).

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

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

Рис. 16.24. Карта переходов тестового сайта

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) созданных в сайте панелей ссылок. В нем содержится название панели, введенное нами в диалоговом окне Создание панели ссылок. Справа от списка расположена кнопка Добавить ссылку (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. Сформируем список ссылок панели навигации домашней страницы нашего тестового сайта. Чтобы добавить в список Ссылки (Links) ссылку, нажмите кнопку Добавить ссылку (Add link).

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

16. Закройте диалоговое окно Свойства панели ссылок, нажав кнопку ОК. На домашней странице появляется созданная панель ссылок (рис. 16.30). Она содержит ссылки на все страницы сайта, кроме домашней. Кроме того, в режиме редактирования на панели виден текст добавление ссылки (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), указывающее, что панель ссылок будет создаваться на основе созданной нами структуры переходов сайта, и нажмите кнопку Далее.
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). Она содержит ссылки на все страницы сайта, включая и домашнюю.

27. Аналогичным образом расположите панели навигации на других страницах сайта. Для ускорения создания панелей навигации вы можете скопировать созданную панель, воспользовавшись командой Копировать (Сору) контекстного меню, затем вставить ее из буфера обмена на другие Web-страницы командой Вставить (Paste), так как все они имеют тот же уровень иерархии. Кроме того, при создании панели, аналогичной той, что имеется на других страницах сайта, можно использовать список Существующие (Choose existing) с названиями всех созданных панелей диалогового окна Свойства панели ссылок (Link Bar Properties) (см. рис. 16.28).

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

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

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

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

 

 

 

Top.Mail.Ru
Top.Mail.Ru