Testimonials

A few years ago we built a site for a client who didn't need anything fancy on the contact page, just a standard name, email, subject and message, so it was pretty simple to use the core Joomla 3 Contacts extension, create a single Contact, and set up a menu link to that contact.

Usually if we do a contact page this way, we only add the email address to the Contact and hide everything except the form, then create modules for everything around it.

Recently the client came back and asked if we could add a mobile number to the form. Apparently a lot of queries were coming in where people were mistyping their own email address, so a phone number would help them to track down the enquiry.

"Sure!" I said, thinking Custom Fields and Override. A quick Google search revealed this very simple solution by Joomlashack, which took about 5 minutes to set up. Great!

contact custom fields1Problem was, the new Custom Fields were displayed at the bottom, under the Captcha. The client was happy with the new field, but wanted it to display under the email field.

This is where things got difficult. To clarify, I'm not a PHP coder. I can read PHP and see what it's doing, and generally move things around enough to create overrides, and if I ever need more code then I pay someone to do it better than I can.

Here's the issue:

  1. It isn't easy to rearrange the order of fields, because there are actually 2 files that generate the form - default_form.php and default_user_custom_fields.php.
  2. It isn't possible to simply override default_form.php by adding/removing/rearranging lines of code, because default_form.php doesn't actually include the existing fields, but has a single line - renderField(); ?> instead.
  3. The custom fields come from the 2nd file, the default_user_custom_fields.php, which get displayed as an array tacked on at the bottom under the CAPTCHA.

I asked some developer contacts and they said I had to completely rewrite default_form.php, remove the render part, and manually add in each field. Suddenly the simple "add a phone number" request got very complicated! At this point, 3 thoughts crossed my mind:

  1. I could do this in under half an hour with a third-party forms extension;
  2. I shouldn't have to;
  3. Now you've got me curious, Joomla!

Anyway, I managed it but it's … ugly. Any suggestions on how to improve this are most welcome, please feel free to add suggestions in the comments.

contact custom fields2To do this, you need to:

  1. Create a custom field called "phone" via the Joomlashack instructions.
  2. Create a template override of com_contact / contact.
  3. Download this modified default_form.zip and copy it to \templates\your-template\html\com_contact\contact

I've included 2 custom fields in the form - "phone" and "mobile", in case you need both. As long as the custom field you create is named either of these, you shouldn't need to modify the PHP. If you want 3 or more custom fields, just copy/paste/modify that file as appropriate.

Key takeaways:

  • The functionality to create custom fields in a contact page is already in the Joomla core. This includes the ability to add the new fields to the core form, AND have the input of those fields included in the email that is sent to the website owner when a visitor submits.
  • The output is ugly and it is ridiculously un-user-friendly that you need to code PHP to display custom fields, or simply change the order of fields. If you aren't comfortable coding you'll probably be better off with a third-party forms extension.

About The Author

Nicky Veitch

Author: Nicky Veitch - Founder & CEO, ENVEE Digital

Websites:  ENVEEDigital.au | WebSolutionZ.com.au

 

linkedin round facebook round

About | Contact