Let visitors contact you right from your website

The Composite.Forms.ContactForm package allows you to add a contact form to your website so that people visiting your website could send messages to you without leaving the page.

When the visitor submits the message, you will receive an email at the specific address. A copy of the message is also saved on your C1 website in a dedicated data type.

How to implement

  1. Make sure that you have configured the email host (please see "Email Host Setup").
  2. Create or edit a page that will serve as a "Contact Us" page.
  3. Add the Contact Form application to this page (right-click | Add Application).
  4. Add the Composite.Forms.ContactForm function ( Insert > Function) or insert the similar code on this page:
     
    <f:function name="Composite.Forms.ContactForm" xmlns:f="http://www.composite.net/ns/function/1.0"> 
      <f:param name="Email" value="(your email address)" /> 
      <f:param name="UseCaptcha" value="True" /> 
      <f:param name="OptionalFields" value="company,website,address,phone number,subject" /> 
      <f:param name="EmailTemplate" value="0f517e73-4b06-4904-949f-20c3ac0b8b1c" /> 
    </f:function>

  5. In the required Email parameter, specify the address at which you want to receive messages submitted via the contact form.
  6. If necessary, set its optional parameters:
    • UseCaptcha: If 'True', the user should enter text from the CAPTCHA image to submit the form. 'False' by default.
    • OptionalFields: Optional fields to include on the form if needed. You can additionaly choose to display these fields: 'company', 'website', 'address', 'phone number', 'subject'.
    • EmailTemplate: The email template to use when sending the message.

Creating Email Templates

Two email templates are available by default: 'Simple' and 'Extended'. The 'Simple' template only includes values from main fields (the user's name and email address, and the message) while the 'Extended' template includes values from all the fields.

You can create your own templates or customize existing ones.

To create a new template:

  1. In the Content perspective, expand Website Items and select Contact Form Email Template.
  2. Click Add Data.
  3. In the form that appears, on the Template Info, fill these fields:
    • Title: The title of the email template
    • Subject: The subject of the email message based on this template
  4. On the Content tab, add content that you will receive when the user submits a contact form. Please note that you can insert the fields from the contact form (Insert | Field | (field name)).

Changing default Form strings

You can change the form strings (field names, information messages, error messages) by editing ~\App_GlobalResources\Composite\Forms\ContactForm.resx.

Localization

You can localize the form's field names as well as error messages by creating a "localized" copy of ~\App_GlobalResources\Composite\Forms\ContactForm.resx (e.g. ContactForm.da-DK.resx for Danish) and translating the strings into the target language. Please see "How to: Create Resource Files for ASP.NET Web Sites" for more information.

Customization

You can customize the contact form's layout by editing its style sheet:

  • /Frontend/Composite/Forms/ContactForm/Styles.css

Requirements

Composite C1 version 2.1.1 or later

SHARE