Что такое компоненты

Альтернативные кнопки

Альтернативные кнопки

Frontpage предоставляет также возможность разместить на странице кнопки нестандартного типа. Их, в отличие от стандартных, нельзя будет использовать для очистки формы или отправки информации, однако вы можете назначить этим кнопкам свои собственные скрипты обработки.

Что такое компоненты

Что такое компоненты

Компоненты Frontpage представляют собой программные вкрапления на HTML-страницах, расширяющие функциональные возможности Web-сайта. В несколько щелчков мыши вы можете вставить в свою страницу, к примеру, поисковый компонент (Search Component), и на странице тотчас появится полнотекстовый поисковый сервис к большому удовольствию ваших пользователей. Чтобы этого достичь в традиционном варианте, разработчик Web-сайта должен был сделать следующее:
1. Создать форму HTML для инициализации поиска.
2. Приобрести и установить на Web-сервер программное обеспечение для полнотекстового поиска.
3. Написать для Web-сервера скрипт CGI, обеспечивающий взаимодействие формы HTML с поисковым механизмом.
Благодаря компонентам обо всем этом можно забыть — вы сможете создавать изысканные интерактивные Web-сайты, не изощряясь в программировании на HTML и CGI. Только имейте в виду, что для корректной работы компонентов Frontpage на сервере, где будет размещаться сайт, должны быть установлены Серверные расширения Frontpage (Frontpage Server Extensions). Эти расширения автоматически инсталлируются на Персональный Web-сервер Microsoft (Microsoft Personal Web Server) и Персональный Web-сервер Frontpage (Frontpage Personal Web Server), но на остальные Web-серверы их придется устанавливать вручную. Чтобы подробнее ознакомиться с Персональными Web-серверами и Серверными расширениями Frontpage, обратитесь к главе 11.
В этой главе мы последовательно изучим все компоненты Frontpage, попутно разбирая способы их включения в страницы. Эта процедура для всех компонентов различна, но начинается она во всех случаях с меню Insert Редактора. Выбрав компонент, вы увидите одно или несколько диалоговых окон, предоставляющих возможности конфигурирования его параметров, после чего Frontpage вставит компонент в страницу на том месте, где установлен курсор. Некоторые компоненты связаны с формами, которые также обсуждаются в этой главе.
В следующих разделах мы совершим беглый обзор компонентов Frontpage.

Демонстрация изображений по расписанию

Демонстрация изображений по расписанию

Компонент временное изображение (Scheduled Image) используется для вывода изображений, видимых в течение заданного периода времени: в заданное время изображение помещается на страницу, а по истечении срока изымается.
Представьте себе сайт магазина бытовой техники, проводящего грандиозную предновогоднюю распродажу, сопровождаемую ежедневным розыгрышем призов. Каждый день главную страницу этого сайта должна украшать новая завлекательная фотография очередного суперприза. Чтобы не обновлять эти изображения ежедневно вручную, включите в страницу несколько временных изображении, автоматически сменяющих друг друга в свое время.
Чтобы быть уверенным в том, что компонент Scheduled Image сработает в тот день, когда изображению по плану предстоит появиться или исчезнуть, внесите в назначенный день какие-либо изменения в ваш сайт или воспользуйтесь командой Проводника Recalculate Hyperlinks, чтобы освежить ссылки и другую информацию на страницах. Эти действия напоминают Frontpage о необходимости обновить также всю информацию, относящуюся к компонентам.

Диалоговое окно Add Choice

Рисунок 9.20. Диалоговое окно Add Choice

6. В текстовом поле Choice наберите слово Site. По умолчанию этому элементу будет присвоено то же самое значение, что и его имя; если вы хотите дать ему значение, отличное от имени, установите флажок Specify Value и введите нужное значение. В секции Initial State установите флажок Selected, тем самым элемент Site будет установлен как выбранный по умолчанию и именно его пользователь увидит в поле списка, в первый раз открыв форму обратной связи в браузере.
Указав в диалоговом окне Add Choice все необходимые сведения, нажмите кнопку ОК.
7. Тем же путем добавьте еще три элемента — Technical Support, Prices и Other. Для каждого из них установите в секции Initial State диалогового окна Add Choice опцию Not Selected. Ширина раскрывающегося списка будет автоматически подстроена под самый широкий из элементов списка. На Рисунок 9.21 приведен вид диалогового окна Drop-Down Menu Properties после добавления всех перечисленных элементов.

Диалоговое окно Check Box Properties

Рисунок 9.27. Диалоговое окно Check Box Properties


Диалоговое окно Comment

Рисунок 9.8. Диалоговое окно Comment

В диалоговом окне Comment введите текст, который вы хотите оставить на странице (текст может быть произвольным); набрав текст комментария, нажмите кнопку ОК. Этот текст, выделенный цветом, вы будете видеть в Редакторе после слова "Comment-"; он будет видим только в Редакторе, но не в браузере.

Диалоговое окно Confirmation Field Properties

Рисунок 9.34. Диалоговое окно Confirmation Field Properties

3. Введите имя поля формы, данные из которого будут представлены в новом поле подтверждения; в данном случае введите CommentType; нажмите кнопку ОК.

Диалоговое окно Confirmation Field Properties

Рисунок 9.13. Диалоговое окно Confirmation Field Properties

3. Введите в нем имя поля формы, содержимое которого следует включить в страницу подтверждения.
Когда вы нажмете кнопку ОК, компонент Confirmation Field займет свое место на странице; Редактор отобразит его в квадратных скобках в виде имени выбранного вами поля. В браузере же вместо компонента вы увидите содержимое поля. Полезно также поместить на странице небольшой сопроводительный текст, поясняющий пользователям, что введенная ими информация предъявляется им обратно для рассмотрения.

Диалоговое окно Drop-Down Menu Properties

Рисунок 9.21. Диалоговое окно Drop-Down Menu Properties

после добавления всех элементов
8. В диалоговом окне Drop-Down Menu Properties присутствуют еще несколько кнопок, выполняющих некоторые дополнительные функции:
• Modify (Изменить). Чтобы отредактировать какой-либо из элементов списка, выделите его и нажмите эту кнопку, при этом появится диалоговое окно Modify Choice (Изменить элемент), соответствующее этому элементу
• Bemove (Удалить). Чтобы удалить элемент списка, выделите его и нажмите кнопку Remove
• Move Up (Переместить вверх). Чтобы переместить элемент вверх по списку, выберите этот элемент и нажмите Move Up (в списке элементы располагаются в том же порядке, в котором они перечислены в диалоговом окне Drop-Down Menu Properties)
• Move Down (Переместить вниз). Чтобы переместить элемент вниз по списку, выберите его и нажмите Move Down.
Помимо этого, в поле Height можно задать высоту списка. Для первого раза оставьте предлагаемое значение 7. Этот параметр определяет вид списка в браузере. Если высота равна 1, то в большинстве браузеров в раскрывающемся списке отображается только один элемент, а просмотр остальных элементов осуществляется при помощи стрелки вниз. Если задана высота, большая единицы, то список будет выглядеть как прокручиваемое текстовое окно, число одновременно видимых элементов в котором равно Height.
Наконец, установите переключатель Allow Multiple Selections (Разрешить множественный выбор) в положение No, чтобы запретить выбор нескольких элементов одновременно. Положение Yes этого переключателя дает пользователю возможность выбрать из списка более одного элемента. Это может быть полезным во многих ситуациях, например, когда пользователю предлагается выбрать из списка те продукты, информацию о которых он хотел бы получить.
9. После завершения ввода всех необходимых данных нажмите кнопку ОК. В результате вы увидите картину, приведенную на Рисунок 9.22.
Здесь мы построили раскрывающий список из четырех элементов. Точно таким же образом создаются списки со сколь угодно большим количеством элементов.

Диалоговое окно Drop-Down Menu Properties

Рисунок 9.19. Диалоговое окно Drop-Down Menu Properties

4. В поле Name введите имя Topic. Это имя вы будете использовать позднее, при формировании страницы подтверждения.
5. Нажмите кнопку Add, чтобы ввести новый элемент списка, при этом откроется диалоговое окно Add Choice (Добавить пункт) (Рисунок 9.20).

Диалоговое окно Image Form Field Properties

Рисунок 9.31. Диалоговое окно Image Form Field Properties

Настройка свойств изображения осуществляется в уже знакомом нам диалоговом окне Image Properties. Для того чтобы попасть в это окно, нажмите в диалоговом окне Image Form Field Properties кнопку Image Properties. Для
назначения обработчика нестандартной кнопки в окне Image Form Field Properties предусмотрена кнопка Form, при ее нажатии открывается диалоговое окно Form Properties.

Диалоговое окно Include Page Component Properties

Рисунок 9.9. Диалоговое окно Include Page Component Properties

3. В текстовом поле Page URL to include (URL включаемой страницы) введите относительный URL страницы, подлежащей включению. Чтобы увидеть список страниц в текущем сайте, нажмите кнопку Browse; выбрав страницу в этом списке, нажмите кнопку ОК.
4. Задав URL страницы, нажмите кнопку ОК. Содержимое этой страницы будет включено в Редакторе на вашу страницу.

Диалоговое окно Option for Discussion Form Handler, вкладка Discussion

Рисунок 9.41. Диалоговое окно Option for Discussion Form Handler, вкладка Discussion

На вкладке Discussion можно ввести следующую информацию:
- Имя дискуссионной группы в поле Title. Это имя будет фигурировать на страницах статей
- В поле Directory введите имя папки дискуссии. Если для создания вашего сайта вы используете Мастер сайта дискуссионных групп, то в этом поле по умолчанию будет указана папка, выбранная вами при работе в мастере. Имя папки должно состоять не более чем из восьми символов и начинаться с символа подчеркивания (_)
- В поле Form fields секции Table of contents layout (Планировка оглавления) введите имена полей, которые вы хотите видеть в оглавлении дискуссионной группы. Если вы вводите несколько имен, то они должны быть отделены друг от друга пробелами
- Если вы хотите фиксировать в оглавлении время, дату прихода статьи, имя удаленного компьютера, с которого она была прислана и имя автора статьи, установите в секции Table of contents layout соответствующие флажки
- Чтобы наиболее свежие статьи располагались в оглавлении первыми, установите флажок Qrder newest to oldest (Порядок от новых к старым).
- Если вы хотите использовать фон и цвета с другой страницы вашего сайта, задайте ее местоположение в поле Get background and colors from page (Взять фон и цвета со страницы...)
На вкладке Article, показанной на Рисунок 9.42, определяется разметка статей в дискуссионной группе:

Рисунок 9.42. Диалоговое окно Option for Discussion Form Handler, вкладка Article

- В каждую страницу можно вставить в качестве колонтитулов две включаемые HTML-страницы; для этого задайте их адреса в полях URL of Header to Include (URL верхнего колонтитула) и URL of Footer to Include (URL верхнего колонтитула)
- Если вы хотите, чтобы на страницах статен фигурировали время и/или дата прихода статьи, имя удаленного компьютера, с которого статья была прислана и имя автора статьи, то установите соответствующие флажки в секции Additional information to include
На вкладке Confirmation Page, показанной на Рисунок 9.43, вы можете задать необязательную страницу подтверждения и необязательную же страницу неудачи проверки:

Рисунок 9.43. Диалоговое окно Option for Discussion Form Handler, вкладка Confirmation Page

- Если вы создали страницу подтверждения для проверки пользователями введенной ими информации, укажите ее адрес в поле URL of confirmation page. Эта страница будет отображаться в браузере каждый раз при отправке формы на Web-сервер.
Если вы не зададите здесь страницу подтверждения, обработчик дискуссионной формы создаст и будет поддерживать ее автоматически.
- В поле URL Of Validation Failure Page можно при необходимости задать страницу неудачи проверки. На этой странице отображаются сведения о полях формы, содержащих некорректную информацию. Если вы не зададите здесь страницу неудачи проверки поля, обработчик дискуссионной формы создаст и будет обслуживать ее автоматически
Закончив ввод информации, необходимой для конфигурирования обработчика дискуссионной формы, нажмите кнопку ОК, чтобы выйти из диалогового окна Options for Discussion Form Handler.

Диалоговое окно Options for Custom Form Handler

Рисунок 9.45. Диалоговое окно Options for Custom Form Handler

- Из раскрывающегося списка Method выберите метод передачи информации обработчику — POST (Послать) или GET (Получить). В методе POST пары имя-значение поля формы передаются непосредственно на вход обработчика формы, а в методе GET пары имя-значение кодируются и присваиваются серверной переменной QUERY_STR[NG
- В поле Encoding type (Тип кодирования) укажите стандарт, используемый для кодирования передаваемых обработчику данных формы. По умолчанию принят метод кодирования application/x-www-form-urlencocled;
если вы не собираетесь его изменять, оставьте это поле пустым

Диалоговое окно Options for Registration Form Handler

Рисунок 9.44. Диалоговое окно Options for Registration Form Handler

Для конфигурирования регистрационного компонента сделайте следующее:
- В поле Frontpage web name (Имя сайта Frontpage) введите имя Web-сайта, для которого предназначена форма регистрации пользователя
- В поле User name fields (Поля имени пользователя) введите имена полей формы, одно или несколько, разделенные запятыми или пробелами, в которых пользователь будет вводить свое имя. Имя пользователя конструируется из содержимого этих полей
- В поле Password field (Поле пароля) задайте имя поля, предназначенного для пароля пользователя
- В поле Password confirmation field (Поле подтверждения пароля) задайте имя поля, предназначенного для подтверждения пароля пользователя
- Если вы хотите обязать пользователя предоставить защищенный пароль (он должен состоять не менее чем из 6 символов и не должен даже частично совпадать с именем пользователя), установите флажок Require secure password (Требовать защищенный пароль)
- Чтобы иметь возможность поставить пользователя в известность, что попытка регистрации завершилась неудачей, поместите в самом нижнем текстовом поле адрес страницы неудачи регистрации. Эта страница необязательна, однако поддержание ее является свидетельством хорошего стиля
Помимо этого, диалоговое окно Settings for Registration Form Handler также включает вкладки File Results, Confirmation Page и Saved Fields. Процедура их конфигурирования совершенно идентична описанной ранее в этой главе, в разделе, посвященном обработчикам форм

Диалоговое окно Options for Saving Results of a Form, вкладка E-mail Results

Рисунок 9.38. Диалоговое окно Options for Saving Results of a Form, вкладка E-mail Results

Настраиваемые параметры:
- E-mail Address to Receive Results (Адрес электронной почты для приема результатов). В этом текстовом поле введите полный почтовый адрес, по которому вы хотите отправить данные из формы, например, donna@mycoolweb.com
- E-mail Format (Формат сообщения). Если вы хотите, чтобы результаты формы могли быть прочитаны большинством почтовых программ, вроде Microsoft Exchange, оставьте формат Formatted Text (Форматированный текст), установленный по умолчанию. Все доступные варианты форматирования были описаны ранее в разделе, посвященном опции File Format вкладки File Results.
- Include Field Names. Если вы хотите, чтобы наряду со значениями полей формы в сообщение были включены также их имена, установите этот флажок
- E-mail Message Header (Заголовок письма). Если вы хотите задать вид строк сообщения Subject (Тема) и Reply-To (Обратный адрес), заполните в этой секции поля Subject Line и Reply-to Line. По умолчанию темой сообщения будет строка Form Results. Если вы установите флажок Form Field Name (Имя поля формы), то в качестве темы сообщения будет служить значение поля формы, имя которого вы укажете в этой строке Subject Line. В строке Reply-to Line лучше всего поместить имя поля формы, содержащего адрес e-mail пользователя; таким образом, вы всегда легко сможете увидеть адрес отправителя формы

Диалоговое окно Options for Saving Results of a Form, вкладка Saved Fields

Рисунок 9.40. Диалоговое окно Options for Saving Results of a Form, вкладка Saved Fields

Сохраняемые поля формы:
- Form Fields to Save (Поля формы для сохранения). Здесь перечисляются имена полей формы, которые вы хотите сохранить, по одному полю в строке. Поля будут сохранены в том порядке, в котором они перечислены в этом списке. Если вы оставите этот список пустым, все поля формы будут сохранены и записаны в файл результатов в порядке их появления в форме
D Additional information to save (Дополнительная информация для сохранения). Чтобы включить в файл результатов кое-какие дополнительные сведения, установите соответствующие флажки в этой секции. При установке опции Time будет добавлено время заполнения формы; Date — дата заполнения формы; установка флажка Remote computer name позволяет включить в отчет имя удаленного компьютера, с которого происходило обращение к форме; User name включит в файл имя пользователя, заполнившего форму; и, наконец, флажок Browser type включает в файл результатов имя браузера удаленного компьютера
Закончив конфигурирование опций сохранения результатов формы, нажмите кнопку ОК и вернитесь обратно в диалоговое окно Forms Properties. Учтите, что некоторые поля после установки опций в диалоговом окне Options for Saving Results of a Form могли измениться вслед новым настройкам.

Диалоговое окно Options for Saving Results of a Form, вкладка Confirmation Page

Рисунок 9.39. Диалоговое окно Options for Saving Results of a Form, вкладка Confirmation Page

Возможные установки:
- URL of confirmation page (URL страницы подтверждения). Если вы создали страницу для подтверждения пользователями введенной ими информации, введите в этом поле ее URL.. Эта страница будет отображаться в браузере после успешной отправки формы на Web-сервер. Если вы не зададите здесь страницу подтверждения, то обработчик формы создаст ее и будет поддерживать автоматически
- URL of validation failure page (URL страницы неудачи проверки). В этом поле можно задать страницу неудачи проверки. Эта страница выводится в тех случаях, когда отправленная форма содержит данные, не удовлетворяющие какому-либо из установленных правил проверки поля формы. Эта страница обычно используется только тогда, когда в диалоговом окне Проводника Frontpage Web Settings не задан язык скриптов проверки (т. е. установлено значение ). В противном случае, если проверка терпит неудачу, сведения об ошибке выводятся в окне сообщения VBScript или JavaScript. Если вы не зададите здесь страницу неудачи проверки поля, то обработчик формы создаст ее и будет поддерживать автоматически.

Диалоговое окно Options for Saving Results of a Form, вкладка File Results

Рисунок 9.37. Диалоговое окно Options for Saving Results of a Form, вкладка File Results


Диалоговое окно Push Button Properties

Рисунок 9.29. Диалоговое окно Push Button Properties

4. В текстовом поле Name оставьте предложенное имя В1. Когда вы будете использовать свои собственные обработчики форм, вы сможете указать здесь другое имя, на которое обработчик будет ссылаться при обработке формы, но пока что оставьте то имя, которое есть.
5. В текстовом поле Value/Label введите текст, который будет написан на кнопке: Submit Now (Отправить).
6. Установите переключатель Button Type в положение Submit. В этом случае кнопка будет служить для отправки введенной пользователем информации обработчику на Web-сервере. Если вы выберете опцию Reset (Сброс), то при нажатии такой кнопки форма будет возвращаться в исходное состояние. Опцию Normal следует устанавливать в том случае, если вы хотите назначить для обработки кнопки свой собственный скрипт.
7. После завершения ввода всех необходимых параметров нажмите кнопку ОК. Новая кнопка будет выглядеть так, как показано на Рисунок 9.30.

Диалоговое окно Radio Button Properties

Рисунок 9.17. Диалоговое окно Radio Button Properties

4. Введите в нем следующую информацию:
• Croup Name (Групповое имя). Введите слово CommentType — так будет называться группа кнопок, образующая новый переключатель. Это имя впоследствии будет использоваться на странице подтверждения. Если вы дадите одно и то же групповое имя нескольким кнопкам, то тем самым вы как раз и создадите из них переключатель: из этих кнопок пользователь сможет выбрать только одну
• Value (Значение). Введите слово Compliment. Это слово появится на странице подтверждения, если пользователь выберет в переключателе именно эту кнопку. Вскоре вы увидите, как это работает
• Initial State (Начальное состояние). Выберите опцию Selected (Выбрана):
когда пользователь откроет форму обратной связи, эта кнопка по умолчанию будет выбрана. В переключателе только одна из кнопок может быть выбрана по умолчанию (поскольку в переключателе вообще только одна из кнопок может быть выбрана); может, но не обязана — выбирать по умолчанию одну из кнопок вовсе не обязательно
5. Нажмите кнопку ОК, чтобы выйти из диалогового окна Radio Button Properties, установите курсор следом за только что вставленной кнопкой и введите слово Compliment. Вы сейчас создали очень ценную кнопку:
нажимая на нее, пользователи будут слать вам комплименты.
6. Точно таким же образом создайте еще одну кнопку справа от кнопки Compliment (чтобы немного отодвинуть кнопки друг от друга, нажмите пробел). В диалоговом окне Radio Button Properties дайте новой кнопке то же самое групповое имя CommentType, но присвойте ей значение Criticism. В качестве начального состояния установите Not selected. Закройте диалоговое окно Radio Button Properties, нажав кнопку ОК.
7. В строке следом за новой кнопкой введите слово Criticism. Создание переключателя завершено. На Рисунок 9.18 вы видите, как будет выглядеть часть вашей страницы, посвященная переключателям.
Не забудьте сохранить изменения.
Итак, вы создали двухпозиционный переключатель под именем CommentType. Если вы полюбопытствуете насчет свойств кнопок переключателя, расположенного над ним (кнопки Complaint, Problem, Suggestion и Praise), вы увидите, что все они имеют групповое имя MessageType. Вы только что создали аналогичную группу; точно таким же способом вы можете создать любой переключатель.

Диалоговое окно Scheduled Image Properties

Рисунок 9.11. Диалоговое окно Scheduled Image Properties

3. В текстовом поле Image To Include (Включаемое изображение) введите имя изображения, которое вы хотели бы видеть. Нужное изображение можно выбрать из доступных на текущем сайте; для этого следует нажать кнопку Browse, выделить нужный файл и затем нажать кнопку ОК.
4. В секциях Starting date and time (Начальные дата и время) и Ending date
and time (Конечные дата и время) введите дату и время соответственно начала и конца периода демонстрации изображения.
5. При необходимости на месте временного изображения до и после его демонстрации можно поместить заставку; для этого введите имя изображения-заставки в последнем, самом нижнем текстовом поле диалогового окна или нажмите кнопку Browse и выберите изображение-заставку из доступных на сайте.
6. Закончив установку параметров в диалоговом окне Scheduled Image Properties, нажмите кнопку ОК.
В течение заданного периода времени вы будете видеть указанное изображение на странице. Если это время еще не наступило (что наиболее вероятно) и для временного изображения не определена замещающая его заставка, то в Редакторе (но не в браузере) на странице в месте включения компонента вы будете видеть надпись Expired Scheduled Image (Просроченное временное изображение). Увидев это сообщение, не пугайтесь — изображение появится на экране в свое время. Если заставка определена, то она будет отображаться во время отсутствия временного изображения и в Редакторе, и в браузере.

Диалоговое окно Scheduled Include Page Component Properties

Рисунок 9.12. Диалоговое окно Scheduled Include Page Component Properties

4. Введите границы временного диапазона демонстрации страницы.
5. До и после показа временной страницы ее место можно заполнить содержимым другой страницы. Чтобы воспользоваться этой возможностью, введите имя замещающей страницы в текстовом поле в нижней части диалогового окна или нажмите кнопку Browse, чтобы увидеть список доступных на сайте страниц.
6. Завершив ввод информации в диалоговом окне Scheduled Include Page Component Properties, нажмите кнопку ОК.

Диалоговое окно Scrolling Text Box Properties

Рисунок 9.25. Диалоговое окно Scrolling Text Box Properties

4. В поле Name введите имя UserComments; это имя пригодится вам в дальнейшем, при настройке страницы подтверждения.
5. Поле Initial value оставьте пустым. Поскольку в данном случае пользователь сам введет в этом окне ту информацию, которую сочтет нужной, вам незачем устанавливать для него какие бы то ни было начальные значения.
6. В поле Width in characters введите число 40, таким образом вы установите ширину текстового окна равной 40 символам. Чтобы впоследствии изменить размеры окна, достаточно будет просто зацепить в Редакторе маркер рамки окна и перетащить его в нужном направлении.
7. В поле Number of lines (Количество строк) поставьте число 5. Этот параметр устанавливает высоту текстового окна в строках, и пяти для начала вполне достаточно. Поскольку это окно является прокручиваемым, пользователь сможет ввести столько строк текста, сколько сочтет нужным, и устанавливать высоту окна больше 5 строк редко бывает целесообразно.
8. Чтобы установить определенные ограничения на вводимый в этом окне текст, нажмите кнопку Validate. Например, вы можете ограничить количество вводимых пользователем символов или набор допустимых символов.
9. После того как вы закончите вводить информацию в диалоговом окне Scrolling Text Box Properties, нажмите кнопку ОК. То, что у вас получится, будет выглядеть примерно так, как показано на Рисунок 9.26.

Диалоговое окно Search Form Properties

Рисунок 9.2. Диалоговое окно Search Form Properties

На вкладке Search Results диалогового окна Search Form Properties, показанной на Рисунок 9.3, расположен ряд опций, относящихся к результатам поиска:
1. В текстовом поле Word List to Search (Список слов для поиска) введите АН, если поиск должен осуществляться по всему Web-сайту. Если вы создали дискуссионную группу при помощи Мастера сайта дискуссионных групп, вы можете указать здесь имя папки группы; это ограничит круг поиска только заданной дискуссионной группой.

Диалоговое окно Substitution Component Properties

Рисунок 9.14. Диалоговое окно Substitution Component Properties

3. Выберите из раскрывающегося списка переменную конфигурации. Все введенные вами переменные будут фигурировать в этом списке.
Нажав кнопку ОК, вы увидите, что на открытой в Редакторе странице появится значение конфигурационной переменной — это и есть подстановочный компонент.
Добавление переменных конфигурации и присваивание им значений были изучены в главе 3.
Для сбора информации вам придется использовать формы с самыми разнообразными комбинациями этих полей. Например, в сети intranet с помощью форм удобно производить анкетирование сотрудников; если вам захочется узнать мнение посетителей о продукции, представленной на вашем Web-сайте, то форм вам не избежать. Поля формы как раз и предназначены для ответов пользователей на ваши вопросы.
Помещая поле формы на страницу сайта, вы тем самым создаете форму. Некоторые шаблоны — такие, как User Registration (Регистрация пользователя), Feedback Form (Форма обратной связи) и Confirmation Form (Форма подтверждения) и мастера (а именно — Мастер сайта дискуссионных групп (Discussion Web Wizard)) создают страницы, уже содержащие формы.
Для функционирования форм необходимы обработчики (handlers') — специальные приложения на Web-сервере, принимающие и обрабатывающие данные из полей форм. Получив введенную пользователем информацию, обработчик может также вернуть ответ в виде страницы подтверждения. Таким образом, обработчики в известном смысле являются посредниками между формой и Web-сервером. Например, обработчиком может быть дискуссионный компонент (Discussion component), регистрационный компонент (Registration component), пользовательская динамически подключаемая библиотека ISAPI, модуль NSAPI или скрипт CGI (эти обработчики обсуждаются в этой главе далее.

Диалоговое окно Table of Contents Properties

Рисунок 9.6. Диалоговое окно Table of Contents Properties

3. В поле Page URL for Starting Point of Table (Адрес начальной страницы оглавления) введите URL страницы, с которой будет начинаться оглавление. В oiдавлении будут указаны все страницы, ссылки на которые есть на начальной странице. Если вы зададите здесь заглавную страницу вашего Web-сайта (чаще всего она называется default.htm или index.htm), то оглавление будет охватывать сайт полностью. Если ваш сайт открыт в Проводнике Frontpage, то для просмотра списка его страниц нажмите кнопку Browse; после этого выберите страницу в диалоговом окне Current Web и нажмите кнопку ОК.
4. В раскрывающемся списке Heading Size (Размер заголовка) выберите размер заголовка первого пункта оглавления. Размер можно задать в пределах от 1 (самый крупный) до 6 (самый мелкий) или оставить установленный в браузере по умолчанию, выбрав опцию None.
5. Остальные опции в этом диалоговом окне управляют поведением компонента Table Of Contents:
• Show each page only once (Включать страницы только единожды). Чтобы каждая страница присутствовала в оглавлении один и только один раз, установите этот флажок; в противном случае страницы, ссылки на которые есть в нескольких местах, будут представлены в оглавлении в соответствующем количестве экземпляров.
• Show pages with no incoming hyperlinks (Включить в оглавление страницы, на которые нет ссылок). Установите этот флажок, чтобы в оглавление попали страницы, на которые нет ссылок с других страниц вашего сайта.
• Recompute table of contents when any other page is edited (Перестраивать оглавление при любых изменениях). Установите этот флажок для автоматической перегенерации оглавления при каждом добавлении, удалении или редактировании страниц на вашем сайте. Если ваш сайт достаточно велик и страницы на нем обновляются часто, то установка этой опции может замедлить вашу работу, например, при сохранении. В качестве контрмеры можно порекомендовать перестраивать оглавление вручную путем открытия и сохранения страницы, содержащей компонент Table Of Contents.
6. Закончив в этом диалоговом окне все необходимые настройки, нажмите кнопку ОК. Оглавление появится на странице в Редакторе. Вы не сможете форматировать отдельные пункты оглавления, любое форматирование на этой странице автоматически коснется всего оглавления в целом. Так, например, вы не сможете выделить заголовки курсивом, оставив при этом список обычным текстом.
На Рисунок 9.7. показано, как оглавление выглядит в Редакторе.

Диалоговое окно Text Box Properties

Рисунок 9.23. Диалоговое окно Text Box Properties

4. В поле Name наберите IfOther. Это имя будет впоследствии использоваться при конфигурировании страницы подтверждения.
5. В поле Initial Value не вводите ничего. В нашем случае пользователь сам будет вводить в текстовом поле дополнительные элементы, так что необходимости в установке начального значения нет. Если вы зададите начальное значение, оно появится в текстовом поле при первом открытии формы в браузере; этот текст пользователь волен изменять как угодно.
6. В поле Width in characters (Ширина в символах) введите число 20, если текущее значение отлично от этого. Этим параметром начальная ширина текстового поля устанавливается равной 20 символам. Если впоследствии вы захотите изменить его размер, просто зацепите в Редакторе маркер изменения размера и потяните его в нужную сторону.
7. В секции Password Field выберите опцию No, тем самым указав, что в данном случае текстовое поле не будет использоваться для ввода пароля.
8. Если вы хотите установить некоторые ограничения на те данные, которые пользователь может вводить в этом поле, нажмите кнопку Validate (Проверить). Например, вы можете установить максимальное количество символов в строке ввода или ограничить допустимый набор вводимых символов (только текст или, наоборот, только цифры).
9. Завершив ввод всей необходимой информации в диалоговом окне Text Box Properties, нажмите кнопку ОК. На Рисунок 9.24 вы видите, как должны выглядеть на вашей странице раскрывающийся список и текстовое поле.

Диалоговое окно Text Box Validation

Рисунок 9.32. Диалоговое окно Text Box Validation

Это одно из наиболее сложных диалоговых окон проверки. В нем вы можете задать правила проверки для типа вводимых пользователем данных, формат текста (буквенный, цифровой и другие), минимальную и максимальную длину строки и диапазон допустимых значении. Закончив задание правил для поля формы, выйдите из диалогового окна, нажав кнопку ОК.
В окна этого семейства можно попасть также по нажатию кнопки Validate в диалоговых окнах свойств соответствующих полей форм: текстового поля, текстового окна, переключателя и раскрывающегося списка.
Если для некоторого поля вами установлены определенные правила проверки, то желательно поместить на странице (по возможности непосредственно следом за полем) ясные инструкции для пользователей относительно допустимых в этом поле данных, например, указать, что текстовое поле предназначено для ввода числового значения. Если пользователь введет в поле формы информацию, не удовлетворяющую установленным вами правилам для этого поля, он получит в браузере сообщение Validation error (Ошибка проверки) с информацией о том, что ввод в форму некорректный и его следует повторить.
Вид сообщения об ошибке проверки определяется на основе установок в диалоговом окне Проводника Frontpage Web Settings (это окно открывается по команде Web Settings в меню Tools Проводника). На вкладке Advanced этого диалогового окна в секции Validation Scripts (Скрипты проверки) вы сможете выбрать, какой язык будет использован для создания скрипта проверки. Если вы выберете VBScript или JavaScript, то сообщение об ошибке проверки будет выводиться в стандартном окне сообщения (message box). Если вы выберете , то сообщение будет отображаться как HTML-страница. В обоих случаях, нажав кнопку или, соответственно, щелкнув по гиперссылке, пользователь сможет вернуться в форму и внести исправления.

Диалоговое окно Timestamp Properties

Рисунок 9.4. Диалоговое окно Timestamp Properties

3. В разделе Display укажите, какую именно дату вы хотели бы вывести: дату последнего редактирования (Date this page was last edited) или последнего автоматического обновления (Date this page was last automatically updated). Между редактированием и обновлением есть небольшая разница. Страница считается отредактированной, когда она изменена и сохранена на Web-сервере; страница считается обновленной, когда изменена и сохранена на сервере она или ее включаемая страница. Включение в страницу содержимого других страниц осуществляется при помощи компонента включения, рассматриваемого в этой главе ниже.
4. Выберите из раскрывающегося списка формат даты и времени на штемпеле. Символы TZ в строках формата времени означают Time Zone (часовой пояс). Если штемпель не будет содержать дату или время, установите в соответствующем поле опцию None.
5. Завершив в диалоговом окне Timestamp Properties ввод необходимой информации, нажмите кнопку ОК, и штемпель появится на вашей странице. Форматирование текста в штемпеле осуществляется стандартными инструментами Редактора.
Пример использования штемпеля в Редакторе приведен на Рисунок 9.5.

Добавление комментария

Добавление комментария

Чтобы вставить в страницу комментарий:
1. Установите в Редакторе курсор на то место текущей страницы, где должен разместиться комментарий.
2. Выберите в меню Insert опцию Frontpage Component, а далее в открывшемся диалоговом окне Insert Frontpage Component выберите Comment; нажмите кнопку ОК. Вы увидите диалоговое окно Comment, показанное на Рисунок 9.8.

Добавление компонента Confirmation Field

Добавление компонента Confirmation Field

Чтобы представить на странице подтверждения содержимое одного поля формы, проделайте следующую последовательность действий:
1. В Редакторе установите курсор на том месте страницы подтверждения, где вы хотите расположить компонент Confirmation Field.
2. В меню Insert выберите Frontpage Component, затем в диалоговом окне Insert Frontpage Component выберите пункт Confirmation Field и нажмите кнопку ОК. Вы увидите диалоговое окно Confirmation Field Properties
(Свойства поля подтверждения), показанное на Рисунок 9.13.

Добавление компонента включения страницы

Добавление компонента включения страницы

Процедура включения содержимого одной страницы в другую выглядит следующим образом:
1. Установите в Редакторе курсор на то место текущей страницы, где появится содержимое вставляемой страницы.
2. Выберите в меню Insert пункт Frontpage Component, в диалоговом окне Insert Frontpage Component укажите Include Page и нажмите кнопку ОК. На экране появится показанное на Рисунок 9.9. диалоговое окно Include Page Component Properties (Свойства компонента включения страницы).

Добавление подстановочного компонента

Добавление подстановочного компонента

Ниже описывается процедура вставки в страницу значения переменной конфигурации.
1. Установите в Редакторе курсор на том месте страницы, где будет располагаться подстановочный компонент.
2. В меню Insert выберите Frontpage Component, затем в диалоговом окне Insert Frontpage Component выберите пункт Substitution и нажмите кнопку ОК. Вы увидите диалоговое окно Substitution Component Properties
(Свойства подстановочного компонента), показанное на Рисунок 9.14.

Добавление поискового компонента

Добавление поискового компонента

Поисковый компонент, как видно из Рисунок 9.1, создает форму, позволяющую пользователям ввести слово или несколько слов для поиска по сайту.
Frontpage в действительности не проверяет все страницы сайта; вместо этого он просматривает список слов, создаваемый и поддерживаемый Серверными расширениями Frontpage. В качестве результата Frontpage возвращает список страниц, содержащих искомое слово или слова.
Чтобы реализовать возможность поиска слов или фраз по своему сайту, сделайте следующее:
1. Установите в Редакторе курсор в то место, где будет находиться верхний левый угол поисковой формы (созданные поисковым компонентом метка, поле ввода и кнопки).

Добавление штемпеля

Добавление штемпеля

Чтобы вставить в страницу штемпель, проделайте следующую процедуру:
1. Установите в Редакторе курсор на то место, где должен будет находиться штемпель. Обычно этому компоненту предшествует фраза типа "Дата последнего изменения страницы".
2. Выберите в меню Insert опцию Timestamp; откроется диалоговое окно Timestamp Properties (Свойства штемпеля), приведенное на Рисунок 9.4.

Добавление временного изображения

Добавление временного изображения

Чтобы реализовать изображение, видимое в течение заданного периода времени, сделайте следующее:
1. В Редакторе установите курсор на то место, где будет располагаться изображение.
2. В меню Insert выберите Frontpage Component, затем в диалоговом окне Insert Frontpage Component выберите пункт Scheduled Image и нажмите кнопку ОК. Вы увидите диалоговое окно Scheduled Image Properties
(Свойства переменного изображения), которое показано на Рисунок 9.11.

Добавление временных страниц

Добавление временных страниц

Чтобы содержимое некоторой страницы было доступно пользователям в течение определенного промежутка времени, произведите следующие действия:
1. В Редакторе установите курсор на то место в текущей странице, где вы хотите видеть включаемый фрагмент.
2. Выберите в меню Insert пункт Frontpage Component, в открывшемся диалоговом окне Insert Frontpage Component выберите Scheduled Include, нажмите кнопку ОК. На экране откроется диалоговое окно Scheduled Include Page Component Properties (Свойства временно включаемой страницы), показанное на Рисунок 9.12.
3. В текстовом поле Page URL to include введите относительный URL нужной страницы или выберите ее из списка страниц сайта с помощью кнопки Browse; после этого нажмите кнопку ОК.

Другую безусловным образом, есть также компонент временного включения

другую безусловным образом, есть также компонент временного включения

(cheduled Include Component), который делает то же самое, но только в заданные моменты времени; этот компонент оосуждается ниже в этой главе.
Предположим, что на сайте вашей компании есть обзорный раздел, где в одном месте представлены наиболее актуальные страницы сайта, например, самые свежие новости и корпоративная информация. Подобные разделы в первую очередь предназначены для тех посетителей, которым на вашем сайте нужны только несколько вполне определенных страниц. У очень многих людей нет времени на то, чтобы просматривать ваш сайт подробно, страница за страницей, — у них есть еще масса важных и неотложных дел; войдите в их положение и предоставьте им возможность почерпнуть всю необходимую информацию без долгих поисков. Подобный обзорный раздел вполне может состоять из единственной страницы с несколькими компонентами включения (по одному для каждой страницы). Полное содержимое этой сборной страницы будет состоять из включенных страниц, следующих друг за другом в порядке включения, и будет выглядеть как единое целое.

Форма подтверждения после добавления компонента

Рисунок 9.35. форма подтверждения после добавления компонента


Кнопка Submit Now

Рисунок 9.30. Кнопка Submit Now

Эти кнопки создаются с помощью команд меню следующим образом:
1. Установите курсор в то место, где должна будет находиться кнопка.
2. Выберите в меню Insert пункт Form Field и далее Image в меню. Появится диалоговое окно Image.
3. Выберите изображение в текущем открытом в Проводнике сайте, из файла на вашей машине или из Internet. Все о диалоговом окне Image уже было рассказано в главе 8.
4. Выбрав изображение, нажмите кнопку ОК; изображение появится на странице в качестве кнопки.
Щелкнув на нем правой кнопкой мыши и выбрав в контекстном меню Form Field Properties, вы попадете в диалоговое окно Image Form Field Properties,
приведенное на Рисунок 9.31.

Достаточно часто встречается такое разделение

Комментарии

Достаточно часто встречается такое разделение труда, когда один человек (например, вы) занимается сборкой сайта, размещением в нем новых страниц и созданием его структуры, а работа по информационному наполнению страниц лежит на плечах совершенно других людей. Для них вы можете ввести в страницу комментарии, текст которых будет виден только в Редакторе, но не в браузере. Это также весьма полезно в тех случаях, когда вы хотите оставить на странице узелок на память самому себе.

Компонент Table Of Contents в Редакторе

Рисунок 9.7. Компонент Table Of Contents в Редакторе


Компоненты и формы Frontpage

Компоненты и формы Frontpage

Первобытные охотники и собиратели умели распорядиться своим временем на все сто процентов — они экономили свою энергию, оптимизируя процессы добычи пищи, изготовления орудии и т. п. А еще они хорошо знали, насколько важен отдых; рабочий день в те времена был гораздо короче, чем нынче, и гораздо больше отводилось времени на развлечения.
Благодаря компонентам и формам Frontpage вы сэкономите на разработке Web-сайтов столько времени, что сможете даже при желании позволить себе жить в пещере и собирать корни на обед. В этом, правда, есть маленькое неудобство: там некуда подключить телевизор и микроволновую печь, так что вам не удастся посмотреть футбол, уплетая ваши любимые корешки. Вы в состоянии это вынести?

Конфигурирование дискуссионного компонента

Конфигурирование дискуссионного компонента

Для создания дискуссионного Web-сайта вы можете использовать описанный в главе 4 Мастер сайта дискуссионных групп. Для конфигурирования параметров дискуссионного компонента служит диалоговое окно Options for Discussion Form Handler (Опции обработчика дискуссионной формы), до которого можно добраться следующим образом:
1. Откройте диалоговое окно Form Properties из дискуссионной формы.

Конфигурирование пользовательских обработчиков ISAPI, NSAPI и CGI

Конфигурирование пользовательских обработчиков ISAPI, NSAPI и CGI

Если вы намерены использовать на своем Web-сайте самодельные обработчики ISAPI, NSAPI или CGI, то вам следует знать, как конфигурировать их настройки во Frontpage.
Для конфигурирования пользовательских обработчиков предназначено диалоговое окно Settings for Custom Form Handler (Установки пользовательского обработчика формы), которое открывается следующим образом:
1. Откройте диалоговое окно свойств формы.
2. В раскрывающемся списке Send to other выберите Custom ISAPI, NSAPI, or CGI Script, а затем нажмите кнопку Options.
Появится диалоговое окно Options for Custom Form Handler (Опции пользовательского обработчика формы), как показано на Рисунок 9.45.
Для конфигурирования пользовательского обработчика формы сделайте следующее:
- В поле Action введите абсолютный URL обработчика формы

Конфигурирование регистрационного компонента

Конфигурирование регистрационного компонента

Конфигурирование регистрационного компонента (Registration Component) осуществляется в диалоговом окне Options for Registration Form Handler
(Опции обработчика регистрационной формы), которое открывается следующим образом:
1. Откройте диалоговое окно свойств формы регистрации. Для использования в качестве регистрационной формы вы можете создать свою собственную форму, а можете использовать готовый шаблон User Registration (Регистрация пользователя). Регистрационная форма должна располагаться в корневом Web-сайте. Учтите, что регистрационная форма не будет работать на Web-серверах Microsoft Internet Information Server и Microsoft Personal Web Server.
2. В раскрывающемся списке Send To Other выберите Registration Form Handler и нажмите кнопку Options; на экране появится диалоговое окно Options for Registration Form Handler, как показано на Рисунок 9.44.

Настройка свойств формы

Настройка свойств формы

Теперь сведем все воедино. На одной странице вы компонуете из полей форму для опроса пользователей, на другой представляете информацию пользователю обратно для проверки и подтверждения. Для того чтобы обе эти страницы работали согласованно, вы должны в диалоговом окне Forms Properties определить их взаимоотношения. Также в этом окне задается тип обработчика, который будет отвечать на Web-сервере за обработку информации, введенной пользователем в форме.
В дополнение к традиционным формам сбора данных Frontpage предоставляет в ваше распоряжение еще две: дискуссионную (discussion) и регистрационную (registration) формы. Для них предусмотрены стандартные обработчики, которые можно установить в диалоговом окне Forms Properties. Создавая сайт при помощи Мастера сайта дискуссионных групп, вы в действительности создаете форму, которую пользователи сайта заполняют во время сеанса работы. Когда пользователь отправляет сообщение в дискуссионную группу, обработчик дискуссионного компонента (Discussion Component) сохраняет его послание на сервере таким образом, чтобы оно было доступно другим участникам форума. Подробнее о дискуссионной и регистрационной формах вы узнаете далее в этой главе.

Новый флажок на форме обратной связи

Рисунок 9.28. Новый флажок на форме обратной связи

Подобным же способом вы можете создавать во Frontpage любые другие флажки.

Новый переключатель

Рисунок 9.18. Новый переключатель

2. Нажмите на панели инструментов кнопку Drop-Down Menu; прямо под существующим списком появится новый раскрывающийся список.
3. Щелкните правой кнопкой мыши на новом списке и выберите в контекстном меню Form Field Properties. Откроется диалоговое окно Drop-Down Menu Properties (Свойства раскрывающегося списка), показанное на Рисунок 9.19.

Оглавление

Оглавление

Компонент Table Of Contents (TOG) используется для создания оглавления Web-сайта, содержащего ссылки на каждую страницу. Этот компонент можно настроить таким образом, чтобы при добавлении, удалении и редактировании страниц оглавление обновлялось автоматически.

Ограничения поискового компонента

Ограничения поискового компонента

Единственное ограничение поискового компонента относится к обновлению поискового индекса. Предположим, вы сохранили на сайте страницу test.htm, в тексте которой содержится слово Alice. Индекс, поддерживаемый поисковым компонентом, зафиксировал тот факт, что на странице test.htm есть слово Alice. Теперь представьте, что вы удалили слово Alice из этой страницы. Поисковый индекс не обновляется автоматически, так что он по-прежнему будет показывать, что Alice в тексте страницы test.htm присутствует. Стало быть, если кому-нибудь придет в голову поискать на вашем сайте слово Alice, он получит ложное указание на страницу test.htm. Чтобы исправить ситуацию, вам следует обновить поисковый индекс с помощью команды Recalculate Hyperiinks из меню Tools Проводника. Эта команда была подробно нами рассмотрена в главе 3.


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

• Registration Form Handler (Обработчик регистрационной формы). Это компонент, позволяющий пользователям регистрироваться на предлагаемые на вашем сайте услуги. Он добавляет в базу данных подписчиков услуги сведения о новом пользователе, а затем выбирает из формы остальную информацию и сохраняет ее на Web-сервере в заданном вами файле и формате

Помимо этого, в диалоговом окне Form Properties присутствуют еще два поля и кнопка:

- Form Ыате (Имя формы). Если вы установили для формы пользовательский обработчик, то в этом поле можно при необходимости указать ее имя, на которое обработчик будет ссылаться

- Target Frame (Целевой фрейм). Здесь можно выбрать фрейм для отображения результатов формы. Вы можете непосредственно ввести имя фрейма или использовать для его поиска кнопку Target Frame (Справа от этого поля).

- Опции. Последний элемент диалогового окна Form Properties — кнопка Options (Опции), предназначенная для конфигурирования различных параметров сохранения результатов формы. Нажав ее, вы увидите диалоговое окно Options for Saving Results of a Form (Опции сохранения данных формы), имеющее четыре вкладки: File Results (она показана на Рисунок 9.37), E-mail Results, Confirmation Page и Saved Fields

Основные свойства формы

Основные свойства формы

Секция What to do with form results? (Что делать с данными формы9) диалогового окна Form Properties содержит две альтернативные опции
- Send to (Послать) Здесь задается обработчик формы по умолчанию, для этого предусмотрены два поля
• File Name (Имя файла) Данные из формы могут быть сохранены в текстовом файле на вашем сервере По умолчанию его имя и путь установлены как private/feedback txt Имейте в виду, что папка _pnvate невидима для поиска по вашему сайту Чтобы задать для сохранения другой файл, вы можете ввести его относительный URL или нажать кнопку Browse и выбрать любую другую страницу в текущем сайте
• E-mail Address (Адрес электронной почты). Возможность послать файл результатов по электронной почте чрезвычайно удобна. Параметры сообщения выбираются в описанном ниже диалоговом окне Options for Saving Results of a Form (опции сохранения данных формы)
- Send to other (Послать другому). В качестве "другого" варианта вам предоставляется выбор одного из трех обработчиков формы, а именно Custom handler (Пользовательский обработчик) и два обработчика Front-Page. Поставьте переключатель в положение Send to other и выберите опцию из раскрывающегося списка
• Custom ISAPI, NSAPI, or CGI script (Пользовательский скрипт ISAPI, NSAPI или CGI). Эти скрипты являются программными компонентами на Web-сервере, обрабатывающими предоставленную формой информацию. Смысл создания собственных скриптов состоит в расширении функциональных возможностей Web-сайта сверх того, чего можно достичь с применением компонентов Frontpage. Например, подобный обработчик на сайте компании может предоставлять пользователям дифференцированный доступ к определенным разделам сайта
• Discussion Form Handler {Обработчик, дискуссионной формы}. Этот обработчик предоставляет пользователям возможность участия в Web-дискуссиях. Frontpage располагает основными инструментами администрирования дискуссионных групп. Дискуссионный компонент (Discussion Component) собирает информацию из формы, формирует из нее HTML-страницу, запоминает страницу на Web-сервере и добавляет ее в оглавление и указатель статей.

Отображение страниц по расписанию

Отображение страниц по расписанию

Компонент временное включение (Scheduled Include) предназначен для того, чтобы сделать определенные включаемые страницы доступными пользователям для просмотра в определенное время, — ситуация, совершенно аналогичная временным изображениям, с тем отличием, что компонент Scheduled Include вставляет в заданное время целую страницу.
Как и в случае временных изображений, временные включения будут работать только в том случае, если в назначенный по расписанию день в сайт будут внесены изменения или произведен пересчет гиперссылок.

Переменные конфигурации

Переменные конфигурации

Еще одна разновидность компонентов Frontpage, называемая подстановочным компонентом {Substitution Component), предназначена для включения в страницу содержимого переменных конфигурации. Этот компонент может быть полезен во многих случаях, например, для того, чтобы ввести в страницу переменный URL или вставить легко модифицируемую текстовую строку, например, информацию об авторе страницы или номер факса компании.

Подтверждение введенной пользователем информации

Подтверждение введенной пользователем информации

Если вы организуете сбор информации от пользователей вашего сайта, сделайте все возможное, чтобы обеспечить достоверность получаемой информации. В частности, вы должны предоставить пользователям возможность просмотреть введенные сведения. Это, во-первых, дает им возможность проверить, не наделали ли они ошибок при наборе и удостовериться в том, что они на самом деле сказали именно то, что хотели сказать; а во-вторых, подчеркивает, что предоставляемая ими информация ценна для вас.
Совет
Во Frontpage можно задать правила проверки для полей форм; например, можно указать, что вводимые числа должны попадать в определенный диапазон или что в текстовое поле можно вводить только ограниченный набор символов. Frontpage
автоматически сгенерирует соответствующие скрипты прямо на странице, так что браузер сможет выполнить эти проверки самостоятельно. Более подробно о правилах проверки вы прочтете ниже, в разделе "Проверка полей форм" этой главы.
Подобная процедура весьма широко используется в WWW и других форумах Internet. После проверки введенной вами информации вы либо подтверждаете ее достоверность, либо при обнаружении неточности вы, как правило, можете вернуться обратно к исходной странице и исправить ошибки. Этим процессом представления информации пользователю на рассмотрение и утверждение управляет поле подтверждения (компонент Confirmation Field). Страницам подтверждения посвящен далее в этой главе отдельный раздел.
Поле подтверждения представляет содержимое одного поля формы (например, имя, возраст или место жительства) на странице подтверждения формы (формы и их поля будут рассмотрены нами в этой же главе, но несколько позже). Каждому полю формы соответствует отдельное поле подтверждения, при этом на одной странице можно разместить произвольное число одинаковых компонентов. Таким образом, на страницах подтверждения вся та разнообразная информация, которую пользователи вводят в разных полях формы, собирается воедино для проверки и подтверждения.

Построен раскрывающийся список

Рисунок 9.22. Построен раскрывающийся список

1. Установите курсор справа от раскрывающего списка, который вы только что создали. Нажмите пробел, чтобы между списком и текстовым полем был небольшой интервал. Введите слово Other: и еще раз нажмите пробел.
2. Нажмите на панели инструментов кнопку One-Line Text Box; на месте курсора появится текстовое поле.
3. Щелкните на нем правой кнопкой мыши и выберите в контекстном меню Form Field Properties. Вы увидите диалоговое окно Text Box Properties
(Свойства текстового поля), как показано на Рисунок 9.23.

Для переключателя следует ввести групповое

Примечание

Для переключателя следует ввести групповое имя.
Вы увидите, что место поля подтверждения [MessageType] заняло поле с меткой [CommentType]. На Рисунок 9.35 показано, как должна выглядеть форма подтверждения после добавления компонента. Этот пример продемонстрировал только процесс замены компонента, однако вы, безусловно, можете сами написать свой собственный текст и точно таким же способом вставить в него поля подтверждения, которые будут заменены содержимым соответствующих полей формы.
4. Совершенно аналогичным образом вы можете создать поля подтверждения для остальных полей формы обратной связи, заменив существующие компоненты шаблона или специально написав для них сопутствующий текст. Напомним: для экспериментов в вашем распоряжении раскрывающийся список с именем Topic, текстовое поле I/Other, текстовое окно UserComments и флажок Requestlnfo.
В конце формы подтверждения целесообразно разместить ссылку, по которой пользователь сможет вновь вернуться в форму обратной связи, если вдруг ему потребуется внести в свою информацию исправления. Чтобы эта страница не производила впечатления тупика, полезно включить в нее и другие навигационные элементы, такие как ссылка на заглавную страницу сайта, оглавление или основные разделы.
На этом с примерами создания полей форм и полей подтверждения покончено. Дальше вы узнаете, как обрабатывать информацию в формах.

Если поле URL of validation

Примечание

Если поле URL of validation failure page недоступно, значит, ни для одного поля вашей формы не установлено никаких правил проверки.

Когда пользователь получает сообщение об

Примечание

Когда пользователь получает сообщение об ошибке, информация из формы не пересылается на Web-сайт; информация отправляется на сайт только в том случае, когда все введенные пользователем данные будут удовлетворять заданным правилам проверки.
Для раскрывающихся списков существует изящный прием: назовите первый элемент списка как-нибудь вроде "Pick One" (Выбери!). Во-первых, это напомнит пользователям о том, что здесь непременно следует сделать выбор; во-вторых, это поможет вам определить, действительно ли пользователь этот выбор сделал. Чтобы воспользоваться этим приемом, установите элемент "Pick Owe "выбранным по умолчанию. Другой метод состоит в выводе сообщения об ошибке проверки, если пользователь не выберет элемент из раскрывающегося списка; для этого сделайте элемент "Pick One" первым пунктом раскрывающегося списка и установите в диалоговом окне Drop-Down Menu Validation флажок Disallow First Item (Запретить первый пункт). Тогда пользователь, оставивший в раскрывающемся списке выбранным первый пункт, при попытке отослать вам форму сразу получит сообщение об ошибке.

Пример использования компонента включения страницы

Рисунок 9.10. Пример использования компонента включения страницы


Проверка полей форм

Проверка полей форм

Frontpage предоставляет вам возможность проверки информации, введенной пользователем в форме, на корректность и соответствие определенным условиям. Например, вы можете задать минимальное или максимальное количество символов, которое должно содержать текстовое поле, указать, что в раскрывающемся списке обязательно должен быть выбран пункт и т. п. Процесс контроля соответствия содержимого поля формы определенным критериям носит название form field validation; в дальнейшем, за неимением точного русского синонима, мы будем называть его просто проверкой поля формы.
Чтобы задать для поля формы правила проверки, щелкните на поле правой кнопкой мыши и выберите в контекстном меню пункт Form Field Validation. Вы увидите диалоговое окно Validation, соответствующее проверяемому полю; так, например, текстовому полю соответствует диалоговое окно Text Box Validation, приведенное на Рисунок 9.32.

Раскрывающийся список и текстовое поле

Рисунок 9.24. Раскрывающийся список и текстовое поле

Итак, на этом этапе создано текстовое поле для ввода пользователем дополнительных комментариев.

Реализация функции поиска

Реализация функции поиска

Чтобы предоставить пользователям вашего сайта возможность поиска слов или предложений в тексте страниц сайта или в сообщениях дискуссионных групп, воспользуйтесь поисковым компонентом (Search Component). Поисковый компонент можно сконфигурировать на просмотр всех слов в сайте;
такой режим называется полнотекстовым поиском (full-text searching).

Штемпель

Штемпель

Чтобы поставить на странице дату и время последнего редактирования или автоматического обновления страницы, используйте компонент Frontpage под названием штемпель (timestamp).

к регистру символов; это означает,

Совет

Поля подтверждения чувствительны к регистру символов; это означает, что слова FirstName и firstname разные.

Прежде чем производить все вышеописанные

Совет

Прежде чем производить все вышеописанные действия, страницу следует открыть в Редакторе.
Компонент включения также весьма удобно использовать для помещения на все страницы сайта, к примеру, информации об авторских правах или некоторых специальных примечаний и т. п. И если потребуется изменить эту информацию, то не обязательно даже редактировать саму включаемую страницу — вам достаточно будет открыть любую "вызывающую" страницу и внести все изменения в ней; после этого изменения отразятся на всех страницах, использующих тот же компонент включения.
В примере, приведенном на Рисунок 9.10, примечание в нижней части окна Редактора вставлено в страницу с помощью компонента включения.

Создание флажка

Создание флажка

В нижней части формы обратной связи располагается флажок. Под этим флажком мы сейчас самостоятельно вставим еще один, назначение которого будет состоять в том, чтобы дать пользователю возможность указать, нуждается ли он в получении более подробной информации по электронной почте.
1. Установите курсор в конце строки Please contact me as soon as possible regarding this matter и нажмите комбинацию клавиш +; курсор перейдет на новую строку.
2. Нажмите на панели инструментов кнопку Check Box; на странице появится новый флажок.
3. Щелкните на этом флажке правой кнопкой мыши и выберите в контекстном меню пункт Form Field Properties; на экране возникнет диалоговое окно Check Box Properties, показанное на Рисунок 9.27.


Создание формы обратной связи

Создание формы обратной связи

Начнем с создания в Редакторе страницы формы обратной связи.
1. Выберите в меню File команду New, в списке шаблонов и мастеров на вкладке Page диалогового окна New укажите Feedback Form и нажмите кнопку ОК.
2. Когда страница будет сгенерирована и загружена в Редактор, сохраните ее под названием Feedback Form и дайте ей в текущем сайте имя feedback.htm. Дальше, говоря о форме обратной связи, мы будем иметь в виду именно эту страницу; пример ее приведен на Рисунок 9.16.

Создание формы

Создание формы

Процесс создания форм на первый взгляд может показаться весьма незамысловатым, но в нем достаточно тонкостей. Дальше мы подробно разберем процесс модификации двух страниц, созданных с помощью шаблонов формы обратной связи (Feedback Form) и страницы подтверждения (Confirmation Page). Эти шаблоны генерируют уже работоспособные формы;
на базе этих страниц мы создадим свои формы, чтобы вы поняли, как они строятся, и смогли в дальнейшем строить их самостоятельно.

Создание кнопки

Создание кнопки

Теперь мы перейдем к созданию кнопки, которую пользователи после заполнения формы будут нажимать для того, чтобы отослать свою информацию на сервер.
1. Установите курсор после кнопки Clear Form в самом низу экрана и нажмите клавишу .
2. Нажмите на панели инструментов кнопку Push Button.
3. Щелкните на новой кнопке правой кнопкой мыши и выберите в контекстном меню пункт Form Field Properties. Вы увидите диалоговое окно Push Button Properties (Свойства кнопки), показанное на Рисунок 9.29.

Создание переключателя

Создание переключателя

Сначала мы организуем переключатель на две позиции, аналогичный уже существующему в форме обратной связи переключателю из четырех кнопок.
1. Установите курсор под строкой "What kind of comment would you like to send?" непосредственно за кнопкой, помеченной Praise (мигающий курсор должен стоять сразу после буквы е в слове Praise), и нажмите комбинацию клавиш +. Курсор перейдет на новую пустую строку сразу под кнопкой Complaint.
2. Нажмите на панели инструментов форм кнопку Radio Button (если панель инструментов форм в данный момент скрыта, укажите в меню View опцию Forms Toolbar); на экране появится новая кнопка.
3. Щелкните по ней правой кнопкой мыши и выберите в контекстном меню пункт Form Field Properties (Свойства поля формы). Откроется диалоговое окно Radio Button Properties (Свойства переключателя), показанное на Рисунок 9.17.

Создание раскрывающегося списка

Создание раскрывающегося списка

Следующим номером мы создадим раскрывающийся список из четырех пунктов прямо под уже готовым.
1. Установите курсор после текстового поля под предложением "What about us do you want to comment on?" и нажмите комбинацию клавиш +; курсор переместится на новую строку.

Создание страницы подтверждения

Создание страницы подтверждения

На странице подтверждения (confirmation page) пользователю выводится информация о подтверждении некоторого действия. Например, она может служить для подтверждения того, что представленная пользователем информация принята сервером. Пользователям свойственно ошибаться; следовательно, страница подтверждения должна помочь им обнаружить ошибки и позволить исправить неверно введенные в форме данные. Помимо этого, страница подтверждения придаст вашему сайту профессиональный блеск.
Имейте в виду, что когда пользователь отсылает форму на Web-сайт, содержащаяся в ней информация сохраняется на сайте (или в другом определенном автором сайта месте) и уже не сможет быть изменена. Страницы подтверждения предоставляют пользователям возможность проверить и подтвердить введенную ими информацию. Не мешает посоветовать пользователям, прежде чем окончательно отсылать заполненную форму на сервер, перепроверить в ней всю информацию. Чтобы быть вполне уверенным, что ошибок нет, можно предпринять целый ряд мер. Подробно о них было написано выше, в разделе "Проверка полей форм" этой главы.
Страница подтверждения — это стандартная страница, которую можно сконфигурировать в диалоговом окне свойств формы (чуть ниже мы рассмотрим этот вопрос поподробнее). В страницах подтверждения представление информации обратно пользователю на рассмотрение осуществляется при помощи особых компонентов, называющихся полями подтверждения (Confirmation Field components).
Далее мы изучим все этапы процесса создания страницы подтверждения. Для этого примера мы используем поля формы, созданные нами ранее в этой главе. Чтобы пока не усложнять себе жизнь, воспользуемся для создания страницы подтверждения соответствующим шаблоном.
1. Выберите в меню File Редактора пункт New, в диалоговом окне New на вкладке Page в списке шаблонов и мастеров выберите Confirmation Form (Форма подтверждения) и нажмите кнопку ОК.
2. Когда страница появится в Редакторе, сохраните ее в текущем сайте с названием Confirmation Form и дайте файлу имя confirmation, htm. Отныне, говоря о форме подтверждения, мы будем иметь в виду именно эту страницу; ее вид показан на Рисунок 9.33.
Как видите, форма подтверждения — это шаблон, готовый к настройке. Он разработан в расчете на использование совместно с шаблоном формы обратной связи и включает в себя многие из используемых в ней имен полей форм. Эти имена в Редакторе выводятся в квадратных скобках; в действительности они являются отдельными полями подтверждения.

Создание текстового окна

Создание текстового окна

А сейчас мы создадим текстовое окно, расположив его под аналогичным окном, уже существующим на форме обратной связи.
1. Установите курсор справа от текстового окна под строкой "Enter your comments in the space provided below:" и дважды нажмите клавишу .
2. Нажмите на панели инструментов кнопку Scrolling Text Box; после этого на странице появится новое текстовое окно.
3. Щелкните на нем правой кнопкой мыши и выберите в контекстном меню пункт Form Field Properties. Вы увидите диалоговое окно Scrolling Text Box Properties (Свойства текстового окна), показанное на Рисунок 9.25.

Создание текстового поля

Создание текстового поля

Теперь мы приступим к созданию однострочного текстового поля. Мы расположим его справа от раскрывающегося списка; в нем пользователи, выбравшие в списке пункт Other (Другое), смогут ввести свой вариант ответа.

Страница Confirmation Form

Рисунок 9.33.
Страница Confirmation Form

Если вы проведете курсор над одним из этих компонентов, например, над компонентом, помеченным [ilserName], вы увидите, что курсор примет вид маленького робота. Когда форма подтверждения предстанет в браузере перед пользователем, строка [UserName] будет заменена значением поля UserName, т. е. на его месте появится строка, введенная пользователем в качестве своего имени. Все поля подтверждения в этой форме работают аналогичным образом.
Форма подтверждения также включает небольшие вступление и заключение, которые вы можете при желании использовать; их вы вольны редактировать по своему усмотрению.

Так выглядит поисковый компонент Frontpage

Рисунок 9.1. Так выглядит поисковый компонент Frontpage

Если вы захотите исключить из поиска некоторые страницы, запишите их прямо в папку _private каталога вашего сайта на Web-сервере (Frontpage no умолчанию не производит поиск по папкам, имена которых начинаются с символа подчеркивания). Если же вы запишете страницу в каком-либо другом месте, а потом переместите ее в Проводнике в папку _phvate, то вам придется обновить поисковый индекс командой Проводника Recalculate Hyperlinks.
2. В меню Insert выберите пункт Active IJlements, а затем Searc'h Jwm ъ суо-меню. На экране появится воспроизведенное на Рисунок •9.Z диалоговое окно Search Form Properties (Свойства поисковой формы) с вкладками Search Form Properties и Search Results (Результаты поиска). Выберите вкладку Search Form Properties.
3. В текстовом поле Label for Input (Метка поля ввода) введите текст, который будет служить меткой поля поиска. По умолчанию вам будет предложена строка Search for:.
4. В поле Width in Characters (Ширина в символах) задайте ширину поля ввода (в символах).
5. В текстовом поле Label for "Start Search" Button (Метка кнопки Start Search) наберите текст, который будет нанесен на кнопке запуска поиска.
6. В текстовом поле Label for "Clear" Button (Метка кнопки Clear) наберите текст для кнопки остановки поиска.

Только что созданная форма обратной связи

Рисунок 9.16. Только что созданная форма обратной связи

Форма обратной связи состоит из нескольких полей; точнее говоря, в нее входит по меньшей мере по одному полю каждого из пяти типов и две кнопки команд.
- Переключатель. Кнопки на странице под строкой "What kind of comment would you like to send?" ("Какого рода комментарии вы хотели бы послать?") — это переключатель. Хотя каждая из этих кнопок (radio button) добавляется к форме по отдельности, они работают как единая группа. Рядом с каждой кнопкой располагается текст, кратко описывающий ее значение; этот текст не является атрибутом кнопки и вводится отдельно. Переключатели используются в тех случаях, когда необходимо дать пользователю возможность выбора одной из нескольких опций (для этой цели можно использовать также раскрывающийся список)
- Раскрывающийся список. Поле под строкой "What about us do you want to comment on?" ("Что вы хотели бы сказать о нас?") — это раскрывающийся список (drop-down list). Пункты списка задаются при установке свойств этого поля. В раскрывающемся списке можно выбрать один или более пунктов
- Текстовое поле. Следом за раскрывающим списком располагается поле, предназначенное для ввода одной строки текста (one-line text box). Ширина его задается при установке свойств поля
- Текстовое окно. Большое текстовое поле под строкой "Enter your comments in the space provided below:" (Введите свои комментарии в отведенном для этого месте) называется текстовым окном (scrolling text box). Это поле предназначено для ввода текста большого объема (длинных комментариев и т. п.)
- Флажок. Маленький квадратик вблизи нижней границы страницы, начинающий строку "Please contact me as soon as possible regarding this matter" (Свяжитесь со мной как можно скорее) — это флажок. Когда пользователь щелкает на пустом флажке, на нем появляется галочка; с помощью флажков пользователям предоставляется выбор да/нет
- Кнопка. Две кнопки в самом низу формы обратной связи, помеченные Submit Comments (Отправить комментарии) и Clear Form (Очистить форму), представляют собой обычные кнопки (command buttons или pushbuttons). С их помощью пользователи могут выполнить соответствующие действия
А теперь, чтобы разобраться, как создаются формы, мы прямо в форму обратной связи рядом с каждым из этих полей вставим поле такого же типа.

Установка обработчика формы

Установка обработчика формы

Обработчик, (handler) — это приложение на Web-сервере, обеспечивающее взаимодействие между сервером и пользователем по всем аспектам работы с формой. Обработчики могут посылать пользователю сообщения (например, в виде страницы подтверждения или посредством электронной почты) и обрабатывать переданные на Web-сервер данные формы Обработчики форм назначаются и конфигурируются в диалоговом окне Form Properties
Открыть диалоговое окно свойств формы, которой вы назначаете обработчик, можно двумя способами Можно щелкнуть правой кнопкой мыши на любом свободном месте формы и выбрать Form Properties в контекстном меню, либо, если вы находитесь в диалоговом окне Push Button Properties, нажмите на кнопку Form Диалоговое окно Form Properties показано на рис 9 36

Вкладка Confirmation Page (Страница подтверждения)

Вкладка Confirmation Page (Страница подтверждения)

Если вы хотите, чтобы результаты формы были представлены на странице подтверждения, произведите соответствующие установки на этой вкладке (Рисунок 9.39).

Вкладка E-mail Results (Результаты по почте)

Вкладка E-mail Results (Результаты по почте)

Для того чтобы отослать результаты формы кому-либо по электронной почте — очень удобная возможность, между прочим — вам придется настроить некоторые параметры на этой вкладке. Вид ее приведен на Рисунок 9.38.

Вкладка File Results (Файл данных)

Вкладка File Results (Файл данных)

Если результаты формы будут записываться в файл, то на вкладке File Results можно настроить способ их представления и некоторые параметры файла.
- File Name (Имя файла). Введите имя и путь к файлу, в котором вы собираетесь сохранить результаты. Файл может находиться как в текущем сайте, так и вне его. Если этот файл будет расположен в текущем сайте, вы можете назвать его private/feedback, txr, при этом результаты будут сохранены на вашем сайте в файле под именем feedback.txt в папке _private. Если файл на момент первого сохранения данных не будет существовать, то Frontpage создаст его; когда файл результатов уже существует, информация дописывается в его конец
- File Format (Формат файла). Выберите формат файла результатов из раскрывающегося списка в секции File Format. Вам предоставляются на выбор следующие варианты:
• HTML. Генерирует файл в формате HTML в виде нормального текста
• HTML definition list (Список определений HTML). Генерирует файл в формате HTML, оформляя пары имя-значение в виде списка определений
• HTML bulleted list (Маркированный список HTML). Генерирует файл в формате HTML, оформляя пары имя-значение в виде маркированного списка
• Formatted text within HTML (Форматированный текст внутри HTML). Генерирует файл в формате HTML в виде форматированного текста
• Formatted text (Форматированный текст). Генерирует файл простого удобного текстового формата
• Text database using comma as separator (Текстовая база данных с запятой в качестве разделителя). Генерирует файл в виде горизонтального списка с элементами, взятыми в кавычки и разделенными запятой. Если флажок Include field names (Включать имена полей) установлен, то в первой строке перечисляются имена полей, а их значения — во второй. Этот формат удобен для манипулирования информацией в базе данных или аналогичном приложении
• Text database using tab as separator (Текстовая база данных с табуляцией в качестве разделителя). Форматирует файл аналогично предыдущему варианту, но вместо запятой в качестве разделителя элементов используется символ табуляции


• Text database using space as separator (Текстовая база данных с пробелом в качестве разделителя). Форматирует файл аналогично вышеописанному, но вместо запятых в качестве разделителей используются пробелы

- Include field names (Включать имена полей). Установите этот флажок в том случае, если в файле результатов наряду со значениями полей необходимо сохранять их имена. Если вы не установите этот флажок, то будут сохранены только значения полей

- Latest Results at End (Последние результаты в конце). Эта опция доступна только в том случае, если в качестве формата файла установлен один из вариантов HTML. В этом случае самая свежая информация будет сохраняться в конце файла. Для всех остальных форматов файла этот режим является безусловным и изменению не поддается

- Optional Second File (Необязательный второй файл). Если вы собираетесь использовать информацию формы для различных целей, например, в электронных таблицах, базах данных, то вам будет полезна возможность сохранять данные параллельно во втором файле другого формата. То есть, в сущности, на выходе вы будете иметь одни и те же результаты, представленные в двух различных форматах — здорово, верно?

Вкладка Saved Fields (Сохраняемые поля)

Вкладка Saved Fields (Сохраняемые поля)

Здесь, как видно на Рисунок 9.40, можно указать поля формы, подлежащие сохранению, порядок их сохранения, а также несколько других интересных категорий информации, доступной на сервере, например, имя пользователя или тип браузера.

Вкладка Search Results диалогового окна Search Form Properties

Рисунок 9.3. Вкладка Search Results диалогового окна Search Form Properties

2. Три флажка на этой вкладке определяют категории информации, включаемой в отчет о результатах поиска:
• Score (Closeness of Match) (Точность совпадения). Этот показатель отражает качество соответствия результатов поиска запросу, т. е. позволяет оценить, насколько найденное слово близко к искомому.
• File Date (Дата файла). Установка этого флажка включает в результат поиска дату и время последней модификации документа, содержащего найденный текст.
• File Size (in К bytes) (Размер файла в килобайтах). Этот флажок предназначен для вывода в отчет информации о размере найденных документов, что может быть весьма насущным для пользователей с медленным телефонным подключением, которым важно знать, сколь велик документ, прежде, чем начать его загружать.
3. Введя всю необходимую информацию в диалоговом окне Search Form Properties, нажмите кнопку ОК. Frontpage поместит поисковую форму на открытую в Редакторе страницу.
Свойства поискового компонента легко можно перенастроить, щелкнув в Редакторе правой кнопкой мыши на компоненте и выбрав в контекстном меню пункт Form Page Component Properties либо выделив компонент и нажав комбинацию клавиш +.

Включаемые страницы

Включаемые страницы

С помощью компонента включения страницы (Include Page Component) содержимое одной страницы можно вставлять в любое место других страниц; при этом включаемая страница должна принадлежать текущему Web-сайту. Помимо компонента включения страниц, который вставляет одну страницу в

Включение оглавления

Включение оглавления

Чтобы включить в свою страницу оглавление, вам необходимо сделать следующее:
1. Установить в Редакторе курсор на то место, где будет начинаться оглавление.
2. В меню Insert выбрать опцию Table of Contents. Перед вами откроется диалоговое окно Table of Contents Properties (Свойства оглавления), показанное на Рисунок 9.6.

Вперед!

Вперед!

В этой главе вы открыли для себя огромный восхитительный мир компонентов и форм Frontpage. В следующей главе вас ожидает знакомство с наиболее передовыми возможностями Frontpage.

Вставка поля подтверждения

Вставка поля подтверждения

Тщательно продумав, какую информацию вы будете представлять пользователю для подтверждения, можно начинать вставлять в страницу поля подтверждения. Этот процесс выглядит следующим образом (не забывайте, что в этом примере мы используем поля, созданные нами в предыдущем разделе):
1. Во-первых, удалите компонент, помеченный [MessageType] и замените его ранее созданным компонентом [CommentType]'. для этого установите курсор непосредственно справа от поля подтверждения [MessageType] и нажмите клавишу (это самый простой способ удалить со страницы любой компонент).

Современные технологии

Активные страницы сервера

Активные страницы сервера

Активные страницы отличаются от любых других HTML-страниц в основном тем, что в их коде HTML, помимо всего прочего, содержатся серверные сценарии. Эти сценарии могут выполняться любыми совместимыми с ASP Web-серверами.

Анимации

Анимации

Если вы хотите, чтобы слова и буквы на ваших страницах танцевали, воспользуйтесь одной из многочисленных опций анимации, которыми располагает Редактор Frontpage.
Отметьте текст, который надо сделать анимированным, укажите в меню Format пункт Animation и затем выберите в списке приглянувшийся вам эффект. Когда пользователь откроет страницу, содержащую анимационный эффект, он увидит текст, выписывающий какие-то невероятные па и в конце концов останавливающийся на том месте, куда он был помещен в Редакторе. Во Frontpage вы найдете 14 различных готовых эффектов, а именно:
- Fly From Bottom — Текст выезжает на страницу снизу - Fly From Left — Текст выезжает слева - Fly From Right — Текст выезжает справа
- Fly From Top — Выезжает сверху
- Fly From Bottom-Left — Выезжает слева снизу
- Fly From Bottom-Right — Выезжает справа снизу
- Fly From Toe-Left — Выезжает слева сверху
- Fly From Top-Right — Выезжает справа сверху
- Fly From Top-Right By Word — Слова прилетают поодиночке справа сверху
- Fly From Bottom-Right By Word — Слова прилетают поодиночке справа снизу
- Drop In By Word — Текст сыплется сверху по одному слову
- Spiral — Текст летит по спирали
- Zoom In — Текст увеличивается
- Zoom Out — Текст уменьшается
Все эти эффекты действуют при первом заходе на страницу. К сожалению, оценить их смогут только обладатели браузеров, поддерживающих динамический HTML; все старые браузеры проигнорируют ваши усилия и будут вести себя так, словно никакого динамического HTML нет и в помине.

Демонстрирует первый экран мастера.

Рисунок 10.22 демонстрирует первый экран мастера.


Демонстрирует вид элемента управления RealAudio в окне Редактора.

Рисунок 10.6. демонстрирует вид элемента управления RealAudio в окне Редактора.


Диалоговое окно ActiveX Control Properties

Рисунок 10.3. Диалоговое окно ActiveX Control Properties

Это диалоговое окно предназначено для выбора и конфигурирования элемента управления ActiveX. Сначала в этом окне активен только список Pick a Control (Выбор элемента управления), а все остальные области недоступны. Когда вы выберете в списке элемент управления, остальные области окна также станут активными.

Диалоговое окно Format Stylesheet после нажатия кнопки Style

Рисунок 10.17. Диалоговое окно Format Stylesheet после нажатия кнопки Style

Нажав кнопку Style (если она есть) в диалоговом окне свойств элемента, вы попадете в то же самое окно Style, позволяющее определить для этого элемента встроенный стиль.
Совет

Совет

В диалоговом окне Style можно редактировать любые внутренние таблицы стилей, в том числе и написанные вручную. На любой странице, содержащей внутреннюю таблицу, выберите Stylesheet в меню Format; в диалоговом окне Format Stylesheet щелкните в любом месте между фигурными скобками стиля, подлежащего редактированию, при этом откроется диалоговое окно Style, в котором можно увидеть все на текущий момент установленные атрибуты стиля. Дальнейшие действия в отдельных пояснениях не нуждаются.

Диалоговое окно Format Stylesheet с введенным тегом h1 до использования кнопки Style

Рисунок 10.16. Диалоговое окно Format Stylesheet с введенным тегом h1 до использования кнопки Style

3. Между тегами комментария введите имя тега HTML, для которого вы хотите построить таблицу стилей, и поставьте пробел.
4. Нажмите кнопку Style. При этом откроется диалоговое окно Style, в котором можно установить все доступные атрибуты текста (Рисунок 10.17).
Определения стиля, которые вы видите на рисунке, были сгенерированы автоматически. На самом деле стиль записывается в одну длинную строку; здесь она разорвана, для того чтобы показать все его элементы.

Диалоговое окно Format Stylesheet

Рисунок 10.14. Диалоговое окно Format Stylesheet

3. Между тегами комментария наберите имя тега HTML, к которому будет относиться таблица стилей, пусть для примера это будет hi, и поставьте пробел. Затем определите таблицу стилей, т. е. перечислите атрибуты стиля для этого элемента.
4. После завершения нажмите кнопку ОК; внутренняя таблица будет сохранена на странице.
Чтобы отредактировать внутреннюю таблицу, повторите шаги 1 и 2, а затем внесите необходимые изменения.
Если вы вставляете внутреннюю таблицу стилей в страницу, связанную также и с внешней таблицей, то вам придется совершить еще один дополнительный ход. Прежде чем добавлять внутренние стили, наберите между тегами комментария строку ©import URL (/style.css), где style.css — это имя внешней таблицы (Рисунок 10.15). При этом в HTML все равно нужно включать ссылку на внешнюю таблицу, как описано выше, в разделе "Внешние таблицы стилей".

Диалоговое окно HTML Markup

Рисунок 10.2. Диалоговое окно HTML Markup

Наберите в этом окне нужный код и нажмите кнопку ОК, чтобы вернуться в Редактор. В окне Редактора введенный вами текст будет отображен в виде значка Unknown HTML (Неизвестный код HTML), напоминающего, что этот фрагмент создали вы сами, а не Frontpage. Чтобы отредактировать такой фрагмент, двойным щелчком на его значке откройте диалоговое окно HTML Markup или щелчком правой кнопки вызовите контекстное меню и выберите в нем пункт HTML Markup Properties (Свойства HTML). Код HTML, сгенерированный Frontpage, можно отредактировать на вкладке Редактора HTML View; как это сделать, читайте в главе 7.

Диалоговое окно Java Applet Properties

Рисунок 10.7. Диалоговое окно Java Applet Properties

- Message for browsers without Java support (Сообщение для браузеров, не поддерживающих Java). В этом поле можно ввести текст или код HTML, который будет отображаться на месте апплета в браузерах, не поддерживающих Java. Введя в этом поле обычный текст, вы увидите в браузере этот текст на месте апплета; тегами HTML вы можете изменить начертание, размер, цвет и т. д. Если ввести в этом поле код типа , то на месте Java-апплета вы увидите изображение (здесь файл BamBam.gif находится в папке Images текущего сайта).
- Applet Parameters (Параметры апплета). В этой группе задаются имена и значения параметров апплета. Имена параметров и допустимые значения должны быть приведены в прилагаемой к апплету документации
Имена и значения всех вводимых вами параметров перечисляются в текстовом окне. Для редактирования этого списка используются кнопки Add (Добавить), Modify (Изменить) и Remove (Удалить)
- Size (Размер). В этой секции устанавливаются ширина и высота Java-аплета в пикселах

Диалоговое окно Object Parameters

Рисунок 10.5. Диалоговое окно Object Parameters

- Name (Имя). Текстовое поле Ыате диалогового окна ActiveX Control Properties позволяет задать имя для идентификации указанного элемента управления при его использовании в сценариях на текущей странице
- Layout (Расположение). В этой группе устанавливается расположение элемента управления на странице
• Alignment (Выравнивание). Задает характер выравнивания элемента управления относительно окружающего текста
• Border thickness (Толщина рамки). Устанавливает ширину (в пикселах) черной рамки вокруг элемента управления
• Horizontal spacing (Интервал по горизонтали). Определяет интервал в обе стороны по горизонтали от элемента управления до ближайшего объекта или текста на текущей строке; интервал задается в пикселах
• Vertical spacing (Интервал по вертикали). Устанавливает интервал сверху и снизу от элемента управления до ближайшего объекта или текста; задается в пикселах
• Width (Ширина). Задает ширину элемента управления в пикселах
• Height (Высота). Задает высоту элемента управления в пикселах

Диалоговое окно Page Transitions

Рисунок 10.21. Диалоговое окно Page Transitions

Сначала укажите событие, при наступлении которого эффект будет срабатывать, затем выберите эффект и, наконец, задайте длительность действия эффекта (в секундах). Добрый вам совет: пусть ваши эффекты будут непродолжительны; не испытывайте лишний раз терпение ваших гостей.

Диалоговое окно Plug-In Properties

Рисунок 10.9. Диалоговое окно Plug-In Properties

- Size (Размер). В этой секции устанавливаются ширина и высота модуля расширения в пикселах
Совет

Совет

Чтобы изменить размеры модуля расширения прямо на странице, выделите его и потяните мышью за маркер рамки.
- Hide Plug-In (Скрыть модуль). Установите этот флажок в том случае, если модуль расширения не должен быть видимым
- Layout (Расположение). В этой секции задается расположение модуля расширения на странице
• Alignment (Выравнивание). Устанавливает характер выравнивания модуля расширения относительно окружающего текста
• Border thickness (Толщина рамки). Задает ширину (в пикселах) черной рамки вокруг модуля расширения
• Horizontal spacing (Интервал по горизонтали). Определяет интервал в обе стороны по горизонтали от модуля расширения до ближайшего объекта или текста на текущей строке; интервал задается в пикселах
• Vertical spacing (Интервал по вертикали). Устанавливает интервал сверху и снизу от модуля расширения до ближайшего объекта или текста; задается в пикселах

Диалоговое окно Script

Рисунок 10.10. Диалоговое окно Script

Переключателем в группе Language (Язык) выбирается конкретный язык сценария. Для языка VBScript доступна еще одна дополнительная опция — Run Script On Server (Выполнять сценарий на сервере); при установке этого флажка сценарий VBScript исполняется сервером, а не клиентом. Для ввода собственно сценария предназначено текстовое поле Script. Кнопкой Script Wizard (Мастер сценариев) запускается Мастер сценариев — инструмент, позволяющий генерировать сценарии в интерактивном режиме. Режим Мастера сценариев Code View (просмотр кода) позволяет видеть генерируемый исходный текст непосредственно в процессе создания сценария. Картина, которую вы увидите, запустив Мастер сценариев, будет аналогична представленной на Рисунок 10.11.

Диалоговое окно Style

Рисунок 10.20. Диалоговое окно Style

Введите в поле Class имя, которое вы хотите дать классу, или выберите его из списка. Затем на остальных вкладках диалогового окна задайте атрибуты класса. Классы стиля можно применять к самым разнообразным элементам:
изображениям (через диалоговое окно Image Properties), абзацам (через Paragraph Properties), таблицам (через Table Properties) и т. д.

Диалоговые окна редактирования элемента управления RealAudio

Рисунок 10.4. Диалоговые окна редактирования элемента управления RealAudio

В диалоговом окне Properties перечислены свойства текущего элемента управления; их можно изменять в соответствии с вашими задачами.
Если выбранный элемент управления не установлен на вашем компьютере или не поддерживает локальное редактирование, то по нажатию кнопки Properties откроется диалоговое окно более общего характера Object Parameters (Параметры объекта), показанное на Рисунок 10.5. Для работы с этим окном необходимо знать названия атрибутов элемента управления и их возможные значения.

Динамический HTML

Динамический HTML

Ну, как насчет того, чтобы внести в вашу страницу немного действия? Если ваш браузер поддерживает динамический HTML, то вы имеете реальный шанс вырваться в первые ряды, оставив далеко за флагом разных мелких сошек. Динамический HTML реализует потенциал самых новых и мощных браузеров; заставьте текст летать, придумайте для ваших страниц интересные переходные эффекты — в ваших руках огромная сила, так распорядитесь же ей как следует; добро пожаловать в мир динамического HTML.

Думай о ближнем

Думай о ближнем

Когда ваш нетленный сайт увидит свет, вам наверняка захочется, чтобы он был доступен как можно большему числу людей вне зависимости от их физических и финансовых возможностей. Иногда, чересчур увлекшись красивыми кнопочками, живописными баннерами и прочими популярными нынче интерактивными изысками, мы забываем о людях с недостатками зрения или с ограниченной подвижностью, не говоря уже об обладателях низкоскоростных модемов.
Между тем, для того чтобы повысить доступность вашего сайта без ущерба для его блеска, нужно совсем немного, но внимательное отношение к проблемам ваших пользователей является обязательным признаком хорошего стиля.
- Всегда используйте опцию Alternative Representations, Text в диалоговом окне Image Properties, и старайтесь сделать пояснительный текст кратким и вразумительным. Снабдите текстовым представлением все изображения вашего сайта, независимо от того, служат ли они элементами навигации или выполняют чисто декоративные функции
- Если для ссылки на изображения большого объема вы используете миниатюры (например, вы представляете на своем сайте фотогалерею), то снабдите полноформатные изображения подробным описанием. Таким образом люди, использующие читающие устройства, смогут получить полное описание изображения
- Если единственным способом навигации по вашему сайту являются изображения-карты, то люди с ослабленным зрением или с отключенной в браузерах графикой не смогут пройти дальше заглавной страницы, даже если вы позаботились об альтернативном представлении для ваших изображений. Поэтому всегда полезно в нижней части каждой страницы расположить чисто текстовую версию панели навигации, чтобы сделать тем самым свой сайт открытым для всех
- Если возможно, создайте отдельную полностью текстовую версию вашего сайта и предоставьте пользователям возможность выбора. Если это невозможно, то постарайтесь создать хотя бы текстовую версию наиболее существенных страниц вашего сайта и поставьте с графической страницы на текстовую же ссылку. Например, каталог продуктов непременно должен существовать в текстовом виде, и при этом его достаточно несложно сгенерировать
Существует еще множество способов сделать ваш сайт доступным всем без исключения; вы без особого труда найдете в Internet массу полезной информации об этом.

И многое другое...

И многое другое...

Нами не затронуты еще многие аспекты и возможности Frontpage, которые слишком специальны для обсуждения в данной книге, но о которых вам следует знать; любые подробности вы можете найти на Web-сайте Frontpage по адресу www.microsoft.com/frontpage/. Вот только два примера из многих:
- Frontpage Software Developer's Kit (Инструментарий Frontpage для разработчика, SDK), который можно загрузить с Web-сайта Microsoft, предоставляет вам возможность создавать собственные мастера и компоненты, вводить в меню новые команды и еще многое другое
- Frontpage в целях обеспечения многопользовательского контроля изменений в Web-сайте поддерживает интеграцию с Microsoft Visual SourceSafe (VSS)

Интеграция с базами данных

Интеграция с базами данных

Если вы хотите реализовать доступ к данным, хранящимся в базе, с тем, чтобы выводить результаты на Web-странице, то в этом разделе вы почерпнете необходимые начальные сведения. При помощи Мастера подключения к базам данных (Database Region Wizard) вы можете посылать SQL-запросы (Structured Query Language, язык структурированных запросов) к доступным на Web-сервере ODBC-совместимым (Open Data Base Connectivity, интерфейс взаимодействия с открытыми базами данных) базам данных. Когда с вашей страницы поступит запрос, на его основе будет сформулирован соответствующий SQL-запрос. Результаты запроса будут использованы специальным обработчиком формы — в данном случае активной страницей сервера (Active Server Page, ASP) — для генерации информации и отображения ее в браузере.

Использование Мастера определения каналов

Использование Мастера определения каналов

Выберите в меню Проводника Frontpage Tools опцию Define Channel
(определить канал); при этом будет запущен Мастер определения каналов. На каждом этапе своей работы мастер будет снабжать вас описанием необходимых действий. Каждый шаг завершается нажатием кнопки Next.
На заключительном, седьмом этапе вам будет предложено установить две дополнительные опции (группа Additional Options), требующие некоторых пояснений.
Если ваш сайт оборудован общими полями и панелью навигации, то при установке флажка с длинным названием Place a button on the navigation bar.... мастер поместит на заглавную, или домашнюю, страницу сайта кнопку Subscribe (Подписка). Второй флажок, Prepare for publishing to (Подготовить к публикации), позволяет указать, будете ли вы публиковать свой сайт в Internet немедленно или нет. Если вы хотите окончательно подготовить сайт к публикации, установите этот флажок и введите URL в текстовом поле Prepare for publishing to; чтобы предварительно протестировать ваш канал локально, снимите этот флажок.
Закончив с установкой опций, нажмите кнопку Save. Frontpage создаст в Проводнике CDF-файл. Мастер в любой момент можно запустить заново, дважды щелкнув на файле определения каналов в карте навигации, списке файлов или структуре папок.

Изменение базы данных

Изменение базы данных

Чтобы изменить уже сделанные установки, запустите Мастер подключения к базам данных, щелкнув правой кнопкой на компоненте Database Region и выбрав в контекстном меню Database Region Properties. Чтобы быстро ввести новое имя поля запроса или выбрать его из уже существующих, щелкните на компоненте Database Region правой кнопкой и выберите в контекстном меню Database Column Value Properties.
Возможность доступа с Web-страницы к информации в базе данных является весьма мощным средством. В этом разделе вы получили о нем только начальные представления; дальше вам предстоит самостоятельно развивать и углублять свои знания в этом вопросе.

Java-апплеты

Java-апплеты

Третьей слева на панели инструментов Advanced расположена кнопка Insert Java Applet (Вставить Java-апплет). Java-апплеты представляют собой небольшие программы, написанные на языке Java; в известном смысле они похожи на элементы управления ActiveX тем, что их применение позволяет привнести в ваши Web-страницы несвойственный стандартному HTML динамизм. Нажав кнопку Insert Java Applet, вы увидите диалоговое окно Java Applet Properties (свойства Java-апплета), приведенное на Рисунок 10.7.
- Applet Source (Исходный файл). Введите в этом текстовом поле имя исходного файла Java-апплета (эти файлы обычно имеют расширение CLASS). Имейте в виду, что язык Java чувствителен к регистру символов, поэтому его важно соблюдать
- Applet Base URL (Базовый адрес апплета). В этом текстовом поле введите URL папки, содержащей исходный файл апплета

Элементы управления ActiveX

Элементы управления ActiveX

Элементы управления ActiveX представляют собой программные компоненты, придающие Web-страницам функциональность, которую невозможно реализовать на основе стандартного HTML. В качестве примеров можно привести следующие элементы управления: ActiveX Label, позволяющий масштабировать и поворачивать текст; Timer, генерирующий периодические события; Animation, предназначенный для отображения анимаций. Элементы управления ActiveX могут быть созданы с помощью различных языков программирования, в том числе Visual C++ и Visual Basic 5.0. Однако следует иметь в виду, что не все браузеры поддерживают ActiveX. Более подробно об ActiveX вообще и элементах управления ActiveX в частности, а также о том, откуда можно переписать бесплатные элементы управления ActiveX, вы можете узнать на Web-сайте ActiveX по адресу www.microsoft.com/activex/.
Вторая слева кнопка на панели инструментов Advanced называется Insert ActiveX Control (Вставить элемент управления ActiveX). Нажав ее, вы увидите диалоговое окно ActiveX Control Properties (Свойства элемента управления ActiveX), показанное на Рисунок 10.3.

Классы

Классы

А вот, допустим, вам приспичило, чтобы у вас на странице все заголовки первого уровня были разного цвета. Но при этом еще хотелось бы выполнить их в едином ключе и описать для них внутренний стиль. И что в такой ситуации вы будете делать? На самом деле все очень просто: из любого стиля можно вывести бесчисленные вариации, так называемые классы. Для определения класса надо поставить после тега HTML точку и имя класса;
например, если вам нужны разноцветные версии заголовка первого уровня, то определите классы hl.green, hl.red, hl.blue и т. д., совершенно идентичные во всем, за исключением цвета шрифта.
Если вы хотите ввести классы в таблицу стилей, поступите следующим образом:
1. Выберите в меню Format опцию Stylesheet и войдите в диалоговое окно Format Stylesheet.
2. Наберите имя первого класса, hi.green. He забудьте поместить его между тегами комментария.
3. Нажмите кнопку Style и задайте все атрибуты, которые будут общими для всех заголовков первого уровня, например, размер, поля или отступы. Запомните, что зеленый цвет шрифта будет только в этом классе (Рисунок 10.18).

Кнопка Style

Кнопка Style

Эта кнопка "мозолит глаза" чуть ли не в каждом диалоговом окне. Наверное, вы задавались вопросом, а что будет, если ее нажать? Ну вот вы и дождались ответа.
Даже в том случае, если вы испытываете трудности с синтаксисом CSS или просто не имеете ни малейшего желания с ним знакомиться, таблицы стилей не останутся для вас пустым звуком. Ниже вкратце описано создание внутренней таблицы:
1. Откройте в Редакторе страницу, в которую вы хотите включить таблицу стилей.
2. Выберите в меню Format опцию Stylesheet, чтобы открыть диалоговое окно Format Stylesheet, показанное на Рисунок 10.16.

Кнопка Subscribe

Кнопка Subscribe

Иногда у вас может возникнуть необходимость в самостоятельном создании кнопки Subscribe, например, если в вашем сайте не используются панели навигации, либо если вы отказались от ее создания Мастером определения каналов. Чтобы поместить эту кнопку на страницу вручную, создайте в Редакторе ссылку со страницы на CDF-файл. Эта процедура заключается в следующем:
1. Откройте в Редакторе страницу, на которой вы хотите создать кнопку. Чаще всего ее размещают на заглавной странице сайта.
2. Выберите способ отображения кнопки — текст или графику.
3. Если вы решили, что кнопка будет текстовой, нажмите на панели инструментов кнопку Create Or Edit Hyperiink или выберите в меню Edit команду Hyperlink. Если же ваша кнопка будет графической, нарисуйте при помощи инструмента Rectangle панели Image активную область на изображении; при этом откроется диалоговое окно Create Hyperlink.
4. В диалоговом окне Create Hyperlink выберите в качестве адресата гипер-ссылки CDF-файл текущего сайта и нажмите кнопку ОК.
Вот и все.

Код HTML со ссылкой на таблицу стилей

Рисунок 10.13. Код HTML со ссылкой на таблицу стилей

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

Мастер определения каналов

Мастер определения каналов

Мастер определения каналов проведет вас по всем шагам создания канала и в итоге создаст файл определения канала в формате CDF (Channel Definition Format, Формат определения канала). Этот файл обеспечивает пользователям возможность обращаться к вашему сайту как к каналу, предоставляя индекс доступных ресурсов и средства обновления информации. В процессе определения канала в CDF-файле записываются сведения о характере предоставляемого пользователям сервиса: канал, либо хранитель экрана, либо элемент рабочего стола либо, наконец, уведомление по e-mail.

Мастер подключения к базам данных

Мастер подключения к базам данных

Для запуска мастера войдите в меню Insert и в пункте Database выберите Database Region Wizard.

Модули расширения

Модули расширения

Встраиваемые модули расширения (plug-in) первоначально были разработаны для пользователей браузеров компании Netscape, однако теперь они поддерживаются и браузером Microsoft Internet Explorer. При нажатии кнопки Insert Plug-In (Вставить модуль расширения), четвертой по счету на панели Advanced, открывается диалоговое окно Plug-In Properties (Свойства встраиваемого модуля), показанное на Рисунок 10.9.
- Data Source (Исходный файл). В этом текстовом поле следует непосредственно или при помощи кнопки Browse указать местоположение или URL модуля расширения
- Message for browsers without Plug-In support (Сообщение для браузеров, не поддерживающих встраиваемые модули). Это поле используется для ввода текста или фрагмента кода HTML, который займет место модуля в не поддерживающих модули расширения браузерах. Обычный текст, введенный в этом поле, будет отображаться в браузере один к одному;
соответствующими тегами можно задать его начертание, размер, цвет и прочие атрибуты. С другой стороны, в этом поле можно ввести код HTML, который заместит модуль расширения изображением, например, . В этом примере файл Dino.gif располага-ется в папке Images текущего сайта.

На первом экране мастера устанавливаются параметры соединения с ODBC-совместимой базой данных

Рисунок 10.22. На первом экране мастера устанавливаются параметры соединения с ODBC-совместимой базой данных


На втором экране мастера определяются SQL-запросы к базе данных на вашем сервере

Рисунок 10.23. На втором экране мастера определяются SQL-запросы к базе данных на вашем сервере

Этот экран позволяет ввести от одного и более SQL-запросов; их можно непосредственно набрать вручную на клавиатуре или перенести через буфер обмена. Чтобы вставить запрос SQL из буфера обмена, сделайте следующее:
создайте запрос в Access, установите в Access режим SQL view, скопируйте запрос SQL в буфер и вставьте его в мастер нажатием кнопки Paste SQL From Clipboard (Вставить SQL-запрос из буфера).

Панель инструментов Advanced

Панель инструментов Advanced

При работе с этими средствами вы, как правило, будете использовать панель инструментов Редактора Advanced (Дополнительная), показанную на Рисунок 10.1. Чтобы сделать эту панель видимой, выберите в меню View Редактора опцию Advanced Toolbar.


Параметр поля формы

Параметр поля формы

При нажатии на кнопку Insert Form Field Parameter (Вставить параметр поля формы) открывается диалоговое окно Insert Form Field Parameter, в котором вы можете ввести значение параметра IDC для SQL-запроса.
Нажмите кнопку Next, чтобы перейти к следующему экрану мастера, показанному на Рисунок 10.24.

Переходы между страницами

Переходы между страницами

Чтобы сотворить маленькое чудо на Web-странице вовсе не надо быть Хот-табычем. Если вы захотите как-то выделить страницу из общей массы, попробуйте один из переходных эффектов, включенных во Frontpage. Например, можно сделать так, чтобы при открытии страницы она постепенно проявлялась, а при выходе — так же постепенно исчезала. Переходные эффекты приурочиваются к первому заходу пользователя на страницу или на сайт, а также к моменту первого ухода.
Чтобы задать тот или иной переходный эффект, откройте диалоговое окно Page Transitions (Переходы между страницами), показанное на Рисунок 10.21, для чего выберите в меню Format опцию Page Transition.

Первый класс — h1green—и его атрибуты

Рисунок 10.18.
Первый класс — h1. green—и его атрибуты

4. Скопируйте полностью определение стиля и вставьте его следующей строкой после h 1. green.
5. Измените имя класса на hi.red.
6. Установите курсор где-нибудь между фигурными скобками стиля hl.redv. нажмите кнопку Style.
7. В диалоговом окне Style измените цвет текста на Red (красный) и нажмите кнопку ОК; определение класса будет соответствующим образом отредактировано (Рисунок 10.19 и 10.20).
8. Повторите этот процесс для всех классов стиля, которые вы хотите определить. Закончив работу, нажмите кнопку ОК и закройте диалоговое окно Format Stylesheet.
Все вновь созданные для этой страницы классы будут перечислены в выпадающем списке Style панели инструментов Format Редактора.

Pick a Control

Pick a Control

В раскрывающемся списке Pick a Control перечислены все установленные на вашем компьютере элементы управления ActiveX. Выберите в этом списке один из элементов, при этом станут доступными все неактивные до сих пор поля диалогового окна ActiveX Control Properties. Для редактирования свойств элемента управления нажмите кнопку Properties. Если указанный элемент управления установлен на вашем компьютере и допускает локальное редактирование, появится диалоговое окно Edit ActiveX Control (Редактирование элемента управления ActiveX) и диалоговое окно Properties этого элемента. (Чтобы задать элемент управления ActiveX, не установленный на вашем компьютере, следует непосредственно ввести в этом поле его идентификатор класса (class ID number). — Примеч. пер.}
На Рисунок 10.4 приведены эти диалоговые окна для элемента управления RealAudio.

в виду, что все эти

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

Однако имейте в виду, что все эти возможности доступны только в браузерах, поддерживающих динамический HTML, например, в Internet Explorer 4.0.

Прежде чем вы начнете пользоваться мастером

Прежде чем вы начнете пользоваться мастером

Прежде чем запустить Мастер определения каналов, вам следует продумать следующие моменты:
- Чтобы придать своему каналу индивидуальные отличительные черты, оснастите его логотипом и значками страниц; их следует подготовить заблаговременно, чтобы они были доступны к моменту запуска мастера. Логотип должен быть графическим файлом в формате GIF и размером 80х32 пикселов; он будет использоваться для идентификации вашего канала в браузере. Значки для идентификации страниц в вашем канале должны быть выполнены также в формате GIF и иметь размер 16х16 пикселов
- Если вы хотите, чтобы в канале были доступны только избранные страницы вашего Web-сайта, соберите их в отдельную папку или несколько подпапок. Для создания и модификации структуры папок используйте соответствующий режим Проводника (см. главу 3)

Написание таблиц стилей выходит за

Примечание

Написание таблиц стилей выходит за рамки этой книги, но основные принципы можно изложить в нескольких словах. Определение стиля может быть любым те-гом HTML, например, h2; непосредственно за ним следует заключенный в фигурные скобки список свойств, разделенных точкой с запятой. Например, это может выглядеть так: h2 {font-size: 14 pt; line-height: 16 pt; font-style: italic; font-family: arial;
color: blue; text-align: center}. В этом случае на всех страницах, использующих эту таблицу стилей, текст стиля heading 2 будет отображаться синим цветом, шрифтом Arial курсивного начертания, кеглем 14, выровненным по центру, с межстрочным интервалом 16 пунктов.
1. Откройте в Проводнике сайт, для которого вы хотите создать таблицу стилей, и установите режим просмотра структуры папок.
2. На левой панели структуры папок выберите самую верхнюю папку; ее имя начинается префиксом http://.
3. Создайте новую страницу, нажав кнопку New Page или щелкнув правой кнопкой мыши на правой панели и выбрав в контекстном меню пункт New Page.
4. Переименуйте новую страницу таким образом, чтобы она имела расширение .css. Будет разумно дать ей характерное имя, например, styles.css.
5. Так как эта страница не является файлом HTML, то она не должна содержать кода HTML. Двойным щелчком на странице откройте ее в Блокноте (Notepad.exe) и уберите из нее все теги.
6. Наберите определение вашей таблицы стилей. У вас должно получиться что-то похожее на пример, приведенный на Рисунок 10.12.
В соответствии с приведенной на рисунке таблицей стилей любой текст стиля h2 будет отображаться шрифтом Arial Bold, 12, синего цвета. Если на компьютере пользователя шрифт Arial не установлен (как, например, на Macintosh), то текст будет выведен в следующей гарнитуре, Helvetica. Второй стиль использует тег ul. Любой текст, использующий этот тег, будет отображен шрифтом Arial 10 с отступом слева в 1 дюйм.

Применение стиля к тексту

Применение стиля к тексту

Теперь, когда вы сами можете создать таблицу стилей любой разновидности, вам нужно научиться применять стили к тексту на странице; это можно сделать двумя различными способами:
- Вьвделив текст в Редакторе и выбрав стиль из списка Style; этот вариант действителен только для внутренних стилей
- Вручную введя соответствующий тег в Редакторе, в режиме HTML view
Используя внешние таблицы, имеет смысл напечатать файл .css — и у вас будет удобный справочник по всем именам и определениям.

Пример одновременного употребления внешних и внутренних таблиц стилей

Рисунок 10.15. Пример одновременного употребления внешних и внутренних таблиц стилей


Пример работы Мастера сценариев

Рисунок 10.11. Пример работы Мастера сценариев

Основной принцип работы с мастером состоит в том, что выбирается объект и связанное с ним событие, а затем определяется действие, совершаемое при наступлении этого события. После завершения работы с Мастером сценариев в код HTML вставляется фрагмент на VBScript или JavaScript, а на странице в месте вставки появляется соответствующий значок.

Публикация канала

Публикация канала

Чтобы разместить канал на удаленном сервере Всемирной Паутины, вновь запустите Мастер определения каналов и нажимайте кнопку Next до тех пор, пока не достигнете седьмого этапа. В группе Additional Options установите флажок Prepare for publishing to и введите URL, по которому вы собираетесь разместить канал; по завершении операции нажмите кнопку ОК.
Нажмите на панели инструментов Проводника кнопку Publish. Если вы публикуете сайт повторно, на прежнее место, Frontpage проделает всю остальную часть процедуры сам, без лишних вопросов. Если же это первая публикация канала, то Frontpage предложит вам ввести URL, по которому он будет находиться.
Файл определения канала жестко привязан к местоположению сайта: если вы имеете привычку периодически переводить свой сайт с одного сервера на другой, то имейте в виду, что каждый раз при смене местонахождения канала пользователям придется подписываться на него заново.

Расширения полей форм

Расширения полей форм

Когда вы создаете форму, Frontpage на основе положения полей на странице автоматически устанавливает определенный порядок их обхода. Если вы хотите определить свой собственный порядок обхода, введите в поле Tab Order (Порядок обхода) диалогового окна свойств поля формы значение от 1 до 999 включительно.
Пользователь, заполняя форму, нажатием клавиши <ТаЬ> может перемещаться от поля к полю в заданной вами последовательности: сначала поле с номером 1, затем с номером 2 и т. д. Это весьма существенно помогает людям с офаниченной подвижностью или даже просто при отсутствии мыши. При просмотре сайта в браузере, не поддерживающем заказной порядок обхода, переход от поля к полю будет осуществляться в порядке, установленном по умолчанию.

Сценарии VBScript и JavaScript

Сценарии VBScript и JavaScript

Использование в Web-страницах языков сценариев, таких, как VBScript или JavaScript, открывает перед вами чрезвычайно широкие возможности. Для браузеров, поддерживающих VBScript и JavaScript, можно реализовывать чтение и редактирование элементов форм, выполнять обработку событий, взаимодействовать с браузером и манипулировать объектами. Изучение программирования на VBScript и JavaScript не входит в круг задач данной книги, и в этом разделе мы ограничимся лишь начальными представлениями.
VBScript — это язык сценариев, разработанный в корпорации Microsoft и базирующийся на языке Visual Basic for Applications. Язык JavaScript, в свою очередь, был разработан компанией Netscape на основе языка программирования С. Сценарии включаются прямо в код HTML и исполняются в брау-зере, поддерживающем эти языки.
Для включения в страницу сценариев VBScript или JavaScript предназначена кнопка под названием Insert Script (Вставить сценарий); на панели инструментов Advanced она крайняя справа. При нажатии кнопки Insert Script на экране появится диалоговое окно Script, показанное на Рисунок 10.10.

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

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

Чтобы немного оживить информацию, оформленную в виде списков, заставьте их сворачиваться и раскрываться. Посетитель, открывая страницу, увидит только первый пункт списка, когда он подведет к первому пункту курсор мыши, появится следующий пункт и т. д. по всему списку.
Чтобы придать списку на текущей странице подобные свойства, выберите его и установите в диалоговом окне List Properties флажок Enable Collapsible Outlines (Разрешить складные списки).

Соединение с базами данных

Соединение с базами данных

В этой секции устанавливаются имя источника данных ODBC, имя пользователя и пароль.
- ODBC Data Source Name (DSN) (Имя источника данных ODBC). Введите в этом поле имя источника данных ODBC, с которым вы хотите соединиться. Этот источник данных указывается при помощи Администратора источников данных ODBC (ODBC Administrator); он должен быть сконфигурирован как системный источник данных. Это поле следует заполнить обязательно Если Web-сервер запущен под управлением Windows 95 или Windows NT Server 4.0 и база данных физически находится на том же сервере, вы можете создать именованный источник данных ODBC при помощи Администратора источников данных ODBC (значок 32bit ODBC или ODBC в Панели управления Windows). В случае другой конфигурации ODBC обратитесь к документации по вашей базе данных.
- IJsername (Имя пользователя). Если СУБД, соединение с которой вы устанавливаете, требует ввода имени пользователя, установите флажок Username и введите имя пользователя в соответствующем текстовом поле
- Password (Пароль). Если СУБД, соединение с которой вы устанавливаете, требует ввода пароля, установите флажок Password и введите пароль в соответствующем текстовом поле
Нажмите кнопку Next, чтобы перейти к следующему экрану Мастера подключения к базам данных, показанному на Рисунок 10.23. Не забывайте о том, что с помощью кнопки Back вы всегда сможете вернуться назад на любой из пройденных этапов.

в страницу элемент управления, сценарий

Совет

Когда вы вставляете в страницу элемент управления, сценарий или апплет, Frontpage помещает на его место соответствующий значок. Каждому из этих элементов соответствует свое окно конфигурации Properties (Свойства). Открыть это окно можно несколькими стандартными способами: двойным щелчком на значке;
щелчком на значке правой кнопкой мыши и выбором в контекстном меню пункта Properties; выделением значка и нажатием комбинации клавиш +.
Существует масса литературы, специально посвященной всем этим новшествам. Только по Java вы найдете не меньше дюжины книг в компьютерном отделе любого книжного магазина. Поэтому здесь мы будем рассматривать исключительно практическую сторону дела, а именно — что и как с ними можно сделать при помощи Frontpage.

Размеры элемента управления ActiveX можно

Совет

Размеры элемента управления ActiveX можно регулировать прямо на странице, для этого нужно выделить его, подцепить мышью маркер на одной из сторон рамки и потянуть в нужном направлении.
- Alternative Representation (Альтернативное представление). Это поле используется для ввода текста или фрагмента кода HTML, который будет замещать элемент управления в браузерах, не поддерживающих ActiveX. Если ввести в этом поле просто фрагмент текста, то его вы и увидите в браузере вместо элемента управления; чтобы варьировать его начертание, размер, цвет и прочие атрибуты, впишите соответствующие теги. Наконец, в этом поле можно ввести код HTML, который на месте элемента управления покажет изображение, например, . В приведенном примере файл Pebbles.gif должен находиться в папке Images текущего сайта
- Network Location (Местоположение в сети). Если элемент управления ActiveX расположен не на вашем компьютере, то в этой секции можно указать сетевой путь, по которому браузер будет искать элемент управления или данные
• Data Source (Файл данных). Для функционирования некоторых элементов управления ActiveX необходимо задавать параметры времени выполнения (run-time parameters). Поле Data Source используется для указания URL или местоположения в сети файла параметров; чтобы отыскать этот файл, можно воспользоваться кнопкой Browse
• Code Source (Исходный файл). Если элемент управления расположен не на локальном компьютере, введите в этом поле его LJRL или местоположение в сети, чтобы браузер, открывая страницу, мог его найти. Это даст браузеру возможность при необходимости загрузить и установить элемент управления

апплета можно изменить прямо на

Совет

Размеры Java- апплета можно изменить прямо на странице, выделив его и потянув мышью за маркер рамки.
- Layout (Расположение). В этой секции задаются интервалы и выравнивание апплета на странице
• Horizontal spacing (Интервал по горизонтали). Устанавливает интервал по горизонтали в обе стороны от апплета до ближайшего объекта или текста на текущей строке; измеряется в пикселах
• Vertical spacing (Интервал по вертикали). Устанавливает интервал сверху и снизу от апплета до ближайшего объекта или текста; измеряется в пикселах
• Alignment (Выравнивание). Задает характер выравнивания Java-апплета относительно окружающего текста
На Рисунок 10.8. вы видите, как Java-аппдет выглядит в Редакторе.

Современные технологии

Современные технологии

Теперь вы знаете о Frontpage почти все. Вы знаете, как работать в Проводнике и Редакторе; вы можете сами создать Web-сайт, умеете его поддерживать и администрировать. Думаете, это все? Конечно, вы так не думаете. А как насчет всех этих новомодных штучек, о которых вам прожужжали все уши? С Frontpage вам станут подвластны самые передовые технологии WWW — элементы управления ActiveX, Java-апплеты, JavaScript, VBScript, модули расширения (plug-ins) Netscape и даже динамический HTML. И даже это еще не все; в этой главе вы увидите, как строятся таблицы стилей и как при помощи Мастера определения каналов (Channel Definition wizard) реализуется последний писк моды — push-технология.

Связь с внешними таблицами

Связь с внешними таблицами

Когда у вас есть таблица стилей, можно начать связывать с ней страницы сайта. Для этого нужно включить в код HTML-страницы указывающий на таблицу тег ссылки. Эта процедура заключается в следующем:
1. Откройте в Редакторе страницу, в которую необходимо вставить ссылку на таблицу стилей.
2. Перейдите на вкладку Редактора HTML View.
3. Между тегами head поместите тег link с параметром href, указывающим на файл таблицы стилей. На Рисунок 10.13 вы видите, как это выглядит в Редакторе.

Таблица стилей

Рисунок 10.12. Таблица стилей

7. Закончив определение стилей, закройте Блокнот.
Для редактирования этой таблицы стилей следует просто открыть страницу styles.css в Блокноте и внести в нее необходимые изменения.

Таблицы стилей (CSS)

Таблицы стилей (CSS)

Одной из самых больших проблем языка HTML была невозможность установки параметров текста. Если вы хотели задать определенный кегль шрифта (т. е. размер символов текста) или установить определенный межстрочный интервал (расстояние между строками абзаца), вас ожидало жестокое разочарование. С появлением иерархических таблиц стилей (cascading stylesheets, CSS) ситуация значительно изменилась к лучшему.
Теперь у вас есть возможность определить атрибуты стиля — шрифт, цвет, кегль, интервал, отступы и т. п., и свести множество различных стьлей в единую таблицу. Термин "иерархические" означает, что для каждого элемента можно определить несколько различных стилей, и браузер будет определять их приоритеты и разрешать конфликты в иерархическом порядке. Таблицы стилей существуют в трех разновидностях:
- External Stylesheet (Внешняя таблица стилей). Из трех вариантов CSS этот, вероятно, наиболее мощный. Создав одну внешнюю таблицу, вы в дальнейшем можете связать с ней любое количество страниц. Когда возникнет необходимость внести изменения, вам придется сделать их только в одном месте. Внешние таблицы стилей хранятся в отдельных файлах с расширением .css
- Embedded Stylesheet (Внутренняя таблица стилей). В этом случае таблица стилей включается в код HTML-страницы и определенные в ней стили относятся только к этой странице
- Inline Style (Встроенный стиль). Эта разновидность стилей распространяется только на отдельные элементы страницы и определяется прямо в открывающем теге HTML-элемента
Если страница вашего сайта связана с внешней таблицей стилей, то добавляемые помимо нее встроенные или внутренне стили дополняют или переопределяют атрибуты, заданные во внешней таблице.
Ниже мы ознакомимся поочередно со всеми тремя методами определения стилей.

Третий экран Мастера подключения к базам данных

Рисунок 10.24. Третий экран Мастера подключения к базам данных

Введите имена полей запроса в вашей базе данных: нажмите кнопку Add Field и наберите имя поля в диалоговом окне Add Field; повторите эту процедуру необходимое количество раз. Если вы хотите, чтобы база данных отображалась в таблице на странице, установите флажок Show the query in a table (Показать запрос в таблице).
Завершив ввод информации в Мастере подключения к базам данных, нажмите кнопку Finish. Frontpage поместит на страницу соответствующий код клиентской стороны и разместит на вашей странице компонент Database Region (База данных). Если вы добавили базу данных к существующей странице, то перед сохранением страницы Frontpage предупредит вас, что для того, чтобы база данных была работоспособна, страницу следует записать с расширением .asp. Если же вы сохраняете эту страницу в первый раз, то Frontpage даст ей расширение .asp автоматически.

Вид элемента управления RealAudio в окне Редактора

Рисунок 10.6. Вид элемента управления RealAudio в окне Редактора


Внешние таблицы стилей

Внешние таблицы стилей

С внешними таблицами стилей можно связать любые страницы открытого в Проводнике сайта. Как выше было отмечено, это одна из самых мощных черт CSS, но ей сопутствует одна маленькая сложность: вам необходимо уметь их писать. Документы с изложением синтаксиса CSS вы легко можете найти в Internet.

Внутренние таблицы стилей

Внутренние таблицы стилей

Если в вашем сайте есть страницы, требующие индивидуального подхода, то здесь в самый раз будет вспомнить о существовании внутренних таблиц стилей. Иногда, например, бывает целесообразно несколько выделить некоторые страницы из выдержанной в едином стиле общей массы. Там, где надо определить стили, отличные от установленных в общей внешней таблице, как раз удобно использовать внутренние таблицы; внутренние стили добавляются к стилям внешней таблицы или переопределяют их.
Чтобы вставить в страницу внутреннюю таблицу стилей, сделайте следующее:
1. Откройте страницу в Редакторе.
2. Выберите в меню Format команду Stylesheet; при этом откроется диало говое окно Format Stylesheet, показанное на Рисунок 10.14.
Обратите внимание на теги комментария ; большинство браузе-ров игнорируют незнакомые им теги, такие, например, как