Home > Administrative Offices > Information Technology > Web Services > VSU Web Services Guides > Creating forms with Expression Web 3
Creating Forms with Expression Web 3 - Part 6
Previous: Part 5 - Adding and modifying form code to your form
Part 6 - Adding security recaptcha code
In this part you will be setting up the security recaptcha code in your form. This will place a captcha box in your form that the user must fill out before submitting. It helps prevent spam.
Step 1
In Expression Web 3, go to your contact form in the Design view.
Click in the left table cell that is in second from the last row. You will want to put the cursor after the text in this cell. In this case, that would be Comments:
Right click and select Modify > Split Cells… from the pop up menu.
The Split Cells box will appear. Select the Split into rows option, and set the Number of rows to 2. Press OK.
You will now have an extra row on the left hand side.
Repeat this step on the right hand side. In this case, we will split the row where the Type your comments here textarea box is.
Now you have an extra row with two columns above the last row in the table. In left column, type in Security:
In the right column, type in PUT CODE HERE
Save your changes.
Your form will look like this:
Step 2 - Copy the recaptcha_code.txt file
Click the following link to view recaptcha_code.txt. Highlight all of the text, right click, and select Copy from the menu.
Click to view and copy recaptcha_code.txt
Click to view and copy recaptcha_code.txt
In Expression Web 3, go to your contact form in the Code view.
Locate the text that says PUT CODE HERE, and highlight it with your cursor. Right click, and select Paste from the pop up menu.
This will paste the recaptcha code into your contact form’s code. It should look something like this:
In Design view you will notice that the cell that said PUT CODE HERE is blank. Leave this blank and do not add any text into that field.
Save your changes.
Step 3
Your form is now complete! The last step is to upload your contact form and processform_adv.php
In Expression Web 3, go to the Publishing view of your site. Highlight your contact form (in this case, contactform.php) and processform_adv.php
Click the “Publish files to the destination site” arrow button.
This will upload your changes to your VSU site.
Step 4
Finally, you need to test your form to ensure that it is working. Use your web browser of choice (Internet Explorer, Mozilla Firefox, etc) and go to your new form. In this case, it’s:
http://mypages.valdosta.edu/usernamehere/contactform.php
usernamehere would be your VSU username.
Fill out the form and submit it. The email addresses you've assigned to get the results should receive a plain text email, as seen here:
You can also test the fields you set to required by leaving them blank and hitting submit. The next screen will show this:
If the security captcha is not filled out, you will see this on the next screen after hitting submit:
