Email forms and Joomla! templates

July 5, 2008

I recently encountered problems when setting up the Contact Me email form on a Joomla! 1.5.1 website. I had created my own template and had, it turns out, forgotten to add a few important lines to my index.php template file and to my .css file.

My first problem was to do with data verification. No JavaScript verification was going on. Or so it seemed. After a little head scratching I realised that I had omitted to add CSS styles to make the verification visible on my page. Two lines in the .css file of my template fixed it:

.invalid { border-color: #ff0000; }
label.invalid { color: #ff0000; }

Next I had to work out why users weren't seeing a “Thank you for your e-mail” message when they filled in the “Contact Me” form and clicked on “Send”. Turns out I hadn't created a tag for the message in the index.php file of my template. That was a one line fix:

<jdoc:include type="message" />

I then tested this change and received back a page containing a fragment similar to:

<dl id="system-message">
<dt class="message">Message</dt>
<dd class="message message fade">
   <ul>
     <li>Thank you for your e-mail</li>
   </ul>
</dd>
</dl>

So I added a couple of lines to my .css file to fix the stylings:

#system-message dt.message{display: none;}
#system-message dd.message{color: #ff0000;}

And that was that! I hope this helps someone.