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

         

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



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

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.13. Диалоговое окно Confirmation Field Properties

3. Введите в нем имя поля формы, содержимое которого следует включить в страницу подтверждения.

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



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



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

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



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



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

4. В поле Name введите имя Topic. Это имя вы будете использовать позднее, при формировании страницы подтверждения.

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



Диалоговое окно 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.

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



Диалоговое окно 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, вкладка File Results



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



Диалоговое окно 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 не задан язык скриптов проверки (т. е. установлено значение <None>). В противном случае, если проверка терпит неудачу, сведения об ошибке выводятся в окне сообщения VBScript или JavaScript. Если вы не зададите здесь страницу неудачи проверки поля, то обработчик формы создаст ее и будет поддерживать автоматически.



Диалоговое окно 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). Если вы выберете <None>, то сообщение будет отображаться как 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.