Have you ever wondered, is there a simple way to provide a method for your visitors to get in touch with you? Regardless of whether you’ve asked yourself that question before, the answer here is yes. Indeed, a simple contact form created with the default Joomla contact component will allow you to get your job done.

In this tutorial, I will show you how to create a basic contact form using the contact component in Joomla 4. If you’re using our Joomla 4 templates collection, it’s set up and ready to work with Contact page.

What is Joomla Contact Component?

Joomla contact component is the default built-in component of Joomla that allows the site admins to create a contact form and publish it using the contact menu item. The contact form is used to interact with users and get feedback from website visitors. This feature is inherited from Joomla 3. And if you don’t want to use third-party extensions, why not give it a try?

How to Create a Contact Form in Joomla 4

Before you start, go to the admin panel (or Home Dashboard) in the backend of your website. Make sure you’ve logged in with your admin account.

Now, navigate to Components > Contacts > Contacts:

Joomla 4 - Contact Component - Access Contact Component

Click on the New button:

Joomla 4 - Contact Component - Create Contact

Here, provide a name for your new contact form (Required) and enter other information:

Joomla 4 - Contact Component - New Contact - Fill In Required Information

Fill in details about contact components, such as image, telephone, website, address, etc., and make sure you provide a valid email. Besides, select a user to link with the contact form in order to receive the email message. This can be any email address rather than a personal one.

In addition to the Edit Contact tab, the other tabs include several options or parameters that you can change to suit your requirements.

Click Save & Close button at the top left when you are ready with your settings.

Joomla 4 - Contact Component - Contact Saved

Next, we’re gonna make it visible so everyone can see it.

In order for your site visitors to send you their feedback, your contact form must be publicly accessible. To illustrate this, I will link it to my main menu so everyone can easily access it.

Go to Menus > Main Menu:

Joomla 4 - Menus - Access Main Menu

Click New:

Joomla 4 - Menus - Add New

Give your new menu item a title. In this example I will name it Contact Us:

Joomla 4 - Menus - New Item - Provide A Title

Here, for Menu Item Type, select Contacts > Single Contact:

Joomla 4 - Menus - Contact Component - Single Contact

And for the Select Contact field, choose a created contact form to assign to the menu item. In my case, it is Contact Us:

Joomla 4 - Menus - Select Contact Component

Click Save & Close to apply the changes. Make sure you set the menu item status to Published.

Joomla 4 - Contact Component - Menu Item Saved

Now, with all the operations done correctly, you should now see a link to your contact page appear in the main menu on the front-end of your website.

Joomla 4 - Contact Component - Check Contact Form

Just click on it and…

Joomla 4 - Contact Component - Review On Frontend

Here you are! You’ve successfully created a basic contact form using Joomla‘s built-in contact component. Congrats!

* Please note: Since each Joomla user account is assigned a unique email address, you can also create different contact forms for different users of your site using the default Joomla contact component. For that instance, simply go back to the creation step, add a new contact form, then for the Linked User field, choose a specific user to associate with this contact. The linked user account will receive any emails sent from the contact form with which it’s associated.

Hope you enjoyed the article. Feel free to drop your comments should you have any questions!

5/5 - (5 votes)
Lt Digital Team (Content &Amp; Marketing)

Flash Sale Grab 25% Off for everything on today, don't miss it. Coupon code: FLASHSALE25 Redeem Now
Flash Sale Grab 25% Off for everything on today, don't miss it. Coupon code: FLASHSALE25 Redeem Now