Home
 

03

May

53

Creating a Simple Contact Form

What it Does

Generates a simple contact for which when submitted sends an email to a CMS defined email address using a custom template. The user is then presented with a submission message telling them that the message has been submitted successfully.

Requirements

SilverStripe 2.3 +

Attached Files


Complete.zip(2 KB)

Preperation

We will be using 3 files in this tutorial, our Contact form page type, ContactPage.php and it's layout template ContactPage.ss as well as the email template ContactEmail.ss. Let's create these files and their initial code:

mysite/code/ContactForm.php

themes/yourtheme/templates/Layout/ContactPage.ss

themes/yourtheme/templates/ContactEmail.ss

Part I: Creating the Page Model

The first thing we need to do is setup the ContactPage model with database fields ($db) and CMS fields. For this tutorial we will keep it simple and add 2 fields, a MailTo field for the address to mail the contact form to and also a field for the text on submission of the form, which we'll call SubmitText. So add the following to your ContactPage class:

mysite/code/ContactForm.php

Once done, flush your database by visiting yoursite.com/dev/build

Part II: Defining the Contact Form

Now let's actually create the fields for our contact form. Again we will keep it simple and add a Name, Email and Comments field, but you can add as many fields as you like without making the logic more complicated. To get SilverStripe to generate the form we need a function on our ContactPage_Controller class which will return the fields to the page template. We will call this function ContactForm(). A blindingly original name I know.

mysite/code/ContactForm.php

The first thing we do is define the variable $fields which contains a FieldSet with our 3 fields in them.

Next we define the $action variable which creates a form action  (i.e. the submit button) and assigns it the SendContactForm function which we will be defining in the next step. The second argument that the FormAction() function takes is the label for the submit button, in this case we are labeling it with Send but you can label yours with whatever you like.

We then set the required fields for the form, in this case all of them and store them in the $validator variable. Finally we return a new form using our predefined variables as arguments. Now when we call $ContactForm from the template, SilverStripe will place our contact form object in it's place.

Part III: Processing the Form Submission

Our Contact Form can now be drawn and submitted, but once submitted SilverStripe won't know what to do with it because we haven't defined a function to deal with it. The Submit Button we defined in the last step is going to look for a function called SendContactForm when it's pressed so let's define that function now inside our ContactPage_Controller class:

mysite/code/ContactForm.php
 

This function is pretty self explanatory, but let's go through it quickly. We pass in the $data variable which provides the function with the submitted form data so that we can process it. We then assign the relevant bits of data to variables ($From, $To and $Subject) before creating a new Email() object with these variables as arguments. Next we set the template for the email which is just the name of the Template without the .ss on the end. Then we simple pass our $data array into the populateTemplate() function so that we can use the data in our template by simply calling $Name , $Comments etc. You could also pass a custom array into this function if you needed to add other data beyond that submitted in the form.

Finally we send the email and return the user to the current URL + /?Success=1 which allows us to test whether the form has been submitted and if it has then display the SubmitText message instead of the form. To do this we need a function which will return true when Success is equal to 1. We can put in in the ContactPage_Controller under our SendContactForm() function It will look like this:

mysite/code/ContactForm.php

This function checks to see if success is set and whether it is set to 1, returning true if so. We can now use <% if Success %> in our template to add/remove content depending on whether the form has been submitted or not. This completes our php code so lets move onto the frond end templates.

Part IV: Email Template

Before we send the email in our SendContactForm() function we populate the template ContactEmail. Although the official SilverStripe documentation states that this template should go into mysite/templates/email/ I have found that it in fact only works when it's in your themes/yourtheme/templates/ folder. We need to create this template so that our email arrives with pretty HTML formatting. In the preparation we made the empty file with doc type and a <head> and <body> tags. We now need to add some CSS styling and the<body> content. This is very much down to how you want your email to look so just take this as an example, the only things which need to be the same are the names of the variables, which should match the names of the Form Fields defined in Part II, in this case $Name and $Comments.

themes/yourtheme/templates/ContactEmail.ss

Part V: ContactPage Template

Finally we just need to define the template for our contact Page. using our Success() function we can use a conditional to decide whether to include the form of the SubmitText like this:

themes/yourtheme/templates/Layout/ContactForm.ss

And that's it! You should now have a fully functioning contact form for your visitors to send you wonderful insightful and thought provoking messages to their hearts content!

About the Author

Name: Aram Balakjian

Website: http://www.aabweb.co.uk

Aram is a web designer/developer running London based agency aab web. He has a strong passion for developing attractive, usable sites around the SilverStripe CMS.

Comments (10)

  • I agree with articles point it really very good.

    Posted by 4 week cna classes, 12/07/2010 5:13am (17 days ago)

  • thanks dr. mitch..i am going to ignore that convo between you guys.

    Posted by sterling silver belly button rings, 10/07/2010 3:27am (19 days ago)

  • A young boy and his dad went out fishing one fine morning. After a few quiet hours out in the boat, the boy became curious about the world around him. He looked up at his dad and asked "How do fish breath under water?"His dad thought about it for a moment, then replied, "I really don't know, son."The boy sat quietly from another moment, then turned back to his dad and asked, "How does our boat float on the water?"Nnce again his dad replied, "Don’t know, son."Pondering his thoughts again, a short while later, the boy asks "Why is the sky blue?"Again, his dad replied. "Don’t know, son."The inquisitive boy, worried he was annoying his father, asks this time "Dad, do you mind that I'm asking you all of these questions?""Of course not son." replied his dad, "How else are you ever going to learn anything?"

    Posted by tracy0214, 06/07/2010 4:35am (23 days ago)

  • Thanks for the sharing.Code added to my website.

    Posted by jinglemaggie, 25/06/2010 3:54am (1 month ago)

  • We offer quality Search Engine Optimization / SEO Services and Internet Marketing Solutions. Our dedicated team of SEO Professionals ensures Top 10 search engine rankings. Our SEO Processes are designed in view of the SEO guidelines, and white hat SEO techniques are strictly followed to ensure that our clients from world over get the best SEO services. Please reply to this email so we can send you more details.

    Posted by Carlos Carney, 24/06/2010 7:15am (1 month ago)

  • Aram, great work!
    Just two questions:
    1)is this form protected against injection and that kind of hacks?
    2)it\'s going to work ok on SS 2.4?
    Thanks!
    Ed

    Posted by Eduardo Cesario, 22/06/2010 11:20pm (1 month ago)

  • Thanks for such useful tutorial information! Your info helped me much to solve some problem. Your site is awesome.

    Posted by torrent search, 14/06/2010 8:52am (2 months ago)

  • For anyone who wants to implement this with SilverStripe 2.4 using hierarchical URLs just change the last line of the SendContactForm function in ContactPage.php to Director::redirect(Director::$this->Link("/?success=1"));
    instead of
    Director::redirect(Director::baseURL(). $this->URLSegment . "/?success=1");

    Posted by Luke, 24/05/2010 12:16pm (2 months ago)

  • Increase Business

    We can increase rankings of your website in search engines. Please reply back for more details.

    Posted by Arthur Ynez, 22/05/2010 11:52am (2 months ago)

  • How would I add this form to the footer, as in why am I not able to just place $ContactForm or that whole snippet into my footer.ss or even the div on pag.ss? Is it possible to have a contact form on all pages? Thanks A million...

    Posted by Josh, 21/05/2010 4:46pm (2 months ago)

1 2 3 4 5 6 next »

RSS feed for comments on this page RSS feed for all comments

Post your comment