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

Перед добавлением WebParts вам нужно будет добавить на страницу HTML-таблицу и соз­дать три ряда: верхний для заголовка страницы, средний для ваших WebParts и нижний для нижнего колонтитула. Внутри среднего ряда определите новую HTML-таблицу с тремя столбцами. Каждый столбец будет содержать зону страницы. Левая зона будет содержать имеющие отношение к клиентам WebParts, средняя зона будет содержать информацию, связанную с заказами и статистикой, а правая зона позволит пользователям модифицировать отображенные на данной странице WebParts. На данный момент ваша форма выглядит вроде показанной на рис. 14.47.

Рис. 14.47. Начальная компоновка вашей страницы WebParts

Теперь вы должны скомпоновать зоны внутри HTML-таблицы центрального ряда. Для этого нужно сделать следующее:

1.   Поместить элемент управления WebPartZone внутрь первого столбца таблицы.

2.   Установить свойство HeaderText первого элемента управления в значение Customer Links. Это позволит людям (которые редактируют страницу) видеть название зоны (и, соответственно, понимать ваши намерения относительно нее).

3.   Установить свойство ID первого элемента управления в значение WebPartZoneCustomerLinks.

4.   Повторить шаги 1—3 для среднего столбца в ряду. На этот раз назовите зону Customer Statistics. Она займет самую большую часть экрана и позволит пользователям этого эк­рана искать заказы и просматривать статистику.

5.   Добавить элемент управления CatalogZone в самый правый столбец среднего ряда. Эта WebParts позволит пользователям настраивать то, что они видят на экране.

На данной стадии ваша страница WebParts должна выглядеть примерно так, как показано на рис. 14.48.

Следующий шаг— надо определить "хром" для WebParts, которые размещаются в зонах. Хром — это стили (такие как шапка, ссылки и кнопки). Есть много стилей, которые вы мо­жете настроить для зоны и ее WebParts. Сюда входят стили для ошибок, стили для неактив­ных элементов и многое другое. Эти стили настраивают все это при помощи множества свойств зоны. Для автоматического форматирования зоны вы можете также использовать смарт-тег, связанный с элементом управления. На рис. 14.49 показан пример диалогового окна AutoFormat. Слева находятся возможные форматы. Справа— предварительный про­смотр, показывающий, как будут выглядеть WebParts в зоне. Этот просмотр основан на фактическом содержимом зоны.

Используйте опцию AutoFormat для настройки хрома для каждого элемента управления зоны. Установите пользовательские ссылки и зоны статистики клиентов в значение Professional. Установите Catalog Zone страницы в значение Colorful.