How to add a “Contact us” form in Joomla

It seems like just yesterday that brands started adding website URLs to their television commercials and magazine advertisements to drive traffic and sales. Now, ads are full of social media handles and quick response (QR) codes to provide instant access to your website for informational and promotional business content.

Content is king, after all, so you must be able to create, manage, and store it to succeed, which is where a web-based content management system (CMS) like Joomla comes in.

What Joomla can do

Whether you need to build an impressive website or develop powerful applications, Joomla has the tools you need to organize and publish content from one central platform. It’s user-friendly, multilingual, and touts custom design features, drag-and-drop functionality, and front-end editing to make content management simple.

But since powerful content drives traffic, you also need a quick, easy, and efficient way to convert prospects into customers before they leave your site.

One of the best ways to instantly connect with (and convert) customers is through a “Contact Us” page, which should be easy for your visitors to find and use. It should provide important company contact information and a contact form for visitors to complete.

How to add a “Contact Us” form in Joomla

Fortunately, learning how to add a “Contact Us” form in Joomla isn’t too complicated. There are two different ways to approach it.

First, you can use the built-in Joomla Contacts component, which doesn’t require you to install any extra extensions.

  1. On your Joomla dashboard, click Components, then Contacts, and then Contacts again.
  2. Click the New button.
  3. Enter your name, email address, and other contact details you’d like on the form.
  4. Pro Tip

    To enable the best layout for your form, click the Display tab and change the Display Format option to Plain.

  5. Once you’re finished, click the Save & Close button.
  6. Next, select Menus, then Main Menu, and finally Add New Menu Item to ensure people can see your contact form.
  7. Under the Menu Title form field, type in what you’d like people to see in your site’s navigation (e.g., “Contact Us”).
  8. And under Menu Item Type, click Contacts and then Single Contact from the list of options.
  9. Then, click Select next to Select Contact to choose the Joomla contact form you created.
  10. Click the Save & Close button.
  11. Lastly, navigate to the front end of your site and click the Contact Us link to see your new Joomla contact form.

While this method is easy to use and quick to set up, it doesn’t offer many features or enable users to save a record of form submissions.

Instead, you can add a “Contact Us” form using the powerful Shack Forms extension, which, unlike the above technique, provides more stylish form features and lets you store messages.

Here’s how to set it up:

  1. First, install Shack Forms.
  2. Then, click Extensions and Modules to create a new “Shack Forms” module.
  3. Set the Status to Published.
  4. Next, on the first screen of Shack Forms, select Static from the Layout dropdown menu.
  5. Now that you’re done with the basic module settings, click the Fields tab and the Add new field button to begin creating the contact form.
  6. Under Add new field, choose these options:
    • Field label: Your Name
    • Field type: Text
    • Required: Yes
  7. Then, click Add new field again and choose these options:
    • Field label: Your Email
    • Field type: Email
    • Required: Yes
  8. Click Add new field one last time and choose these options:
    • Field label: Your Message
    • Field type: Textarea
    • Required: Yes
  9. Select Save.
  10. Once you save a form in the “Static” position, navigate to a Joomla article.
  11. In the Joomla text editor, click the Module button.
  12. Click the green Contact Form button to access the module you created earlier, which will place the module into the article using a shortcode.
  13. Finally, save the article and visit the front of your site to see your “Contact Us” form live on your website.

How to add a contact form with Jotform

Now that you know how to add a contact form in Joomla, you’re equipped to build a stunning website and engage with the users who visit it.

But Joomla isn’t the only software on the market that enables users to enhance websites and build applications. Online form builder Jotform does, too, by letting you create powerful forms, PDFs, and apps from thousands of ready-made templates or even from scratch — completely code-free. It’s easy to use and understand and fully customizable, and it lets you embed your forms into Joomla.

Here’s how:

  1. Log in to your Joomla Admin page.
  2. Next, download and install the Sourcerer plug-in:
    • Click Extensions and Extension Manager buttons from the top menu.
    • Click Choose File to look for the plugin file and then Upload & Install to install the downloaded plugin file.
  3. Click the <>Insert Code button, which you can find under the text area content box when adding an article or page to your Joomla site.
  4. Copy your form’s embed code from Jotform and paste it in the code field — between the {source} and {/source} tags — under the word Insert.
  5. Don’t forget to save it!

Pro Tip

You can also embed your Jotform form on your Joomla website by using either the JavaScript or iFrame method.

By learning how to add a “Contact Us” form in Joomla, you can better connect with your prospects and convert them to customers. More importantly, a contact form makes it easy and convenient for your customers to take the next step in their customer journey by reaching out to you.

AUTHOR
Lee Nathan is a personal development and productivity technology writer. He can be found at leenathan.com.

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

Podo Comment Be the first to comment.