Как встроить форму в сайт?

Здесь, описано как прикрутить форму отправки сообщений, не мудрствуя лукаво. Для тех, кто не хочет заморачиваться с настройками и кардинальными изменениями кода и вёрстки (CSS). Текст на английском.

На этой странице приведён тот же текст, но на русском, может кому-то будет полезен.

Первый, бесплатный сервис

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

И, ни одного слова простым владельцам сайтов, которые (например) готовы взять аппликацию, вставить в свой сайт и использовать. Ведь так?

Давайте решим, подходит ли Вам наша аппликация (сразу, почти без переделки)? Итак, у Вас есть сайт. Находится он на каком-то хостинге. Вам следует уточнить у своего хостера, поддерживает ли его хостинг (и предусмотрена ли такая услуга в Вашем пакете) ASP.NET 2.0-хостинг. Если поддерживает, то проблем нет никаких. Загружаете (вначале на свой, локальный PC) любую из наших аппликаций (работать будут обе): с шифрованной передачей сообщений; с простой (не шифрованной) передачей сообщений и устанавливаете (выгружаете) в какую-то из виртуальных папок на Вашем хосте (например, папка: my_mail). Да, делаете это, используя ftp или web-интерфейс для загрузки файлов, распаковав вначале архив, с сохранением структуры папок на локальном PC.

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

Назначаете (сами, или пишете хостеру) этой (виртуальной) папке субдомен, например: email.yourdomain.com. Если домен активирован, у хостера указано, что для домена запущена .NET Application версии 2.0, то (немедля) набираете URL в браузере: email.yourdomain.com/MailSend.aspx. Зачем указывать файл MailSend.aspx? Очень просто, если Вы наберёте URL, содержащий адрес субдомена (без файла MailSend.aspx), то ничего не откроется, web-server будет искать страницу default, не найдёт такую и выдаст ошибку. Программисты знают что делать и со страницами в аппликации и с кодом, который они скорее всего встроят в свой сайт. Мы, с Вами не знаем, что с ним делать, поэтому идём самой лёгкой дорогой, просто указываем URL, с необходимой (реально существующей) нам страницей.

Итак, если всё подключено (хостер не забыл запустить .NET Application), появилась страница аналогичная вот этой, или вот этой, в зависимости от того, какую аппликацию Вы установили (с шифрованной передачей, или без такой).

Теперь, приступим к изменениям. Первое, самое важное изменение (всё делаем локально), производим в файле Web.Config, открыв его для редактирования ПРОСТЫМ ТЕКСТОВЫМ редактором, например Notepad, для Windows:

Видите строку:

<add key="reciverEmail" value="your@mail.ext">

</add>

? В ней нам (вместо your@mail.ext) необходимо вставить свой адрес, на который почта и будет приходить после отправки посетителем.

Следующая строка:

<add key="reciverName" value="John Smith">

</add>

. Здесь, вместо John Smith, вставляем Ваше реальное имя. Теперь, во всех сообщениях, которые будут приходить в Ваш почтовый ящик, в поле кому, будет отображаться Ваше имя.

Всё, сохраняем и отправляем этот файл в виртуальную папку на хостинг (заменив, существующий там файл). Почтовая форма начала работать и отправлять почту в Ваш адрес. На самом сайте, там где у Вас есть ссылки с Вашим email, вставляем ссылки на эту форму. Примерно так (код html):

 <a href="http://email.yourdomain.com/MailSend.aspx" title="Email Me" target="_blank">Email Me</a>

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

В папку i нашей виртуальной папки на хостинге выгружаем новый файл logo.jpg, с Вашей фотографией, или Trade Mark Вашей компании (в зависимости от того, какой у Вас сайт - персональный или корпоративный).

Теперь сменим тексты, отображающиеся в форме. Для этого, тем же ПРОСТЫМ ТЕКСТОВЫМ редактором открываем файл MailSend.aspx (локально, не забываем о том, что все изменения делаются локально). Находим конструкцию:

MyReal NET — new way to

make real Personal Email Services

Изменяем фразу, ни в коем случае не заменяя html-tags, т.е. только слова: "MyReal NET"; "new way to" и "make real Personal Email Services" на фразу, более подходящую Вашему сайту.

Теперь, в конструкции:

			<p class="content">
				*Name*:
				<asp:RequiredFieldValidator ID="NameValidator" runat="server" ControlToValidate="tbName"
					ErrorMessage="*Enter your name correctly please*" CssClass="error-report" Display="Dynamic"></asp:RequiredFieldValidator><br />
				&nbsp;<asp:TextBox ID="tbName" runat="server" CssClass="all-form">name</asp:TextBox><br />
				*Email*:
				<asp:RegularExpressionValidator ID="EmailValidator" runat="server" ControlToValidate="tbEmail"
					ErrorMessage="*Enter your Email correctly please*" CssClass="error-report" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"
					Display="Dynamic"></asp:RegularExpressionValidator><br />
				&nbsp;<asp:TextBox ID="tbEmail" runat="server" CssClass="all-form">mymail@mail.net</asp:TextBox><br />
				*Subject*:
				<asp:RequiredFieldValidator ID="SubjectValidator" runat="server" ControlToValidate="tbSubject"
					ErrorMessage="*Enter subject correctly please*" CssClass="error-report" Display="Dynamic"></asp:RequiredFieldValidator><br />
				&nbsp;<asp:TextBox ID="tbSubject" runat="server" CssClass="all-form">subject</asp:TextBox><br />
				*Text*:<br />
				<FCKeditorV2:FCKeditor ID="bodyEditor" runat="server" Height="500px">
				</FCKeditorV2:FCKeditor>
				*Attachment*:<br />
				&nbsp;<asp:FileUpload ID="InputFile" runat="server" CssClass="all-form" /><br />
				*Word Verification*:<br />
				&nbsp;<img src="image.ashx?id=<%= GetImageID()%>" alt="Captcha" /><br />
				*Type the characters (you see in the picture above)*:
				<asp:RequiredFieldValidator ID="CaptchaAnswerValidator3" runat="server" ControlToValidate="CaptchaAnswer"
					ErrorMessage="*enter the verification word*" CssClass="error-report" Display="Dynamic"
					Height="1px" Width="135px"></asp:RequiredFieldValidator><br />
				&nbsp;<asp:TextBox ID="CaptchaAnswer" runat="server" CssClass="all-form"></asp:TextBox></p>

запросто можем заменить фразы, которые я выделил "звёздочками" с двух сторон. Это и части текстовых сообщений (формы) и аварийные сообщения работы этой же формы.

Следующие изменения, производимые в форме, в конструкции вида (выделено, как и перед этим, см. выше):

			<div class="right-place">
				<a href="*http://www.myreal.net*" class="link-content" title="*Free WEB-Services*">*MyReal.NET*</a></div>

Это - наша реклама, можете заменить на любой свой текст. А можете, всю эту конструкцию (опубликованную здесь) вообще удалить.

Всё, сохраняем изменения. А изменённый файл выгружаем в Вашу виртуальную папку. Открываем форму, теперь она, хотя и отдалённо, напоминает Ваш сайт. Остальные изменения стилей отображения (если захотите) поручите толковому web-designer-у. Ему придётся изменить правила CSS, описанные в двух файлах, находящихся в папке style.

А, чуть не забыл, в файле MasterPage.master, находящейся в той же папке, что и файл MailSend.aspx, следует заменить вот эти тексты (выделено "звёздочками" с двух сторон):

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>*MyReal NET:. free email forms*</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<style type="text/css" title="currentStyle" media="screen">
			@import url("style/main.css");
		</style>
</head>
<body>
    <form id="form1" runat="server">
        <!-- HEADER -->
        <div class="header">
            <p class="header">
               * Welcome to MyReal.NET email form*</p>
        </div>
        <!-- /HEADER -->
        
        <div>
            <br />
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
        </div>
        
        <!-- FOOTER -->
        <div class="footer">
            &copy;&nbsp;<a href="*http://namespace.myreal.net*" class="footer" title="*NameSpace*"
                target="_blank">*Name Space*</a>,&nbsp;*2007*
        </div>
        <!-- /FOOTER -->
    </form>
</body>
</html>

Теперь, уж точно всё :) . До следующих репортажей :) и следующих сервисов.