Three steps to create a basic Joomla! Form
Most of the website needs a form. So when you create a form including text fields, paragraph fields, captcha, button, etc.. What is your difficulty? If your answer is to build a simple form, it might involve some sort of coding and complicated steps. Don’t worry, with Joomla and JSN Uniform of JoomlaShine, you can create web forms in a quick manner. In the article below, I would like to show you how to create a basic contact form the same as the image below with JSN Uniform in just three steps.
In this article, I’m going to guide you on how to build a form from scratch instead of using pre-built forms in the JSN Uniform.
Step 1: Create
First of all, you need to log in your Joomla administrator area, install JSN Templates or JSN Uniform. And then, go to Components → JSN Uniform → Form.
Next, click on the New button, here you can see seven options. We will start with Blank Form.
Next, go to General input the form’s title, select a Captcha Integration is ReCaptcha or Securimage.
Step 2: Add
Now, we go to Design tab. You can see Form Type by default is Single Page and Form Layout by default is Vertical, you can change them as needed.
On the Page Layout, you need to Add Field.
Add Field
Click on the Add Field button to select a field. There are have twenty-two fields for you. You can filter or search field name to select.
After that, you need to update properties for the field, there are Title, Size, Required or Hide. On the Values tab, you can input Predefined Value and number of Limit text optional.
When you have some fields, you can change the position of fields. You can see the image below. Just a few minutes we've created a simple form use some fields: Single Line Text, Email, Phone, and Paragraph Text field.
Step 3: Show
Now that our form has been designed in the backend, it’s time to display it in the visitor area.
We have three ways to show the form on the frontend, including Menu, Module Position and show Inside Article.
Via Menu Item
You need to click on Via Menu Item to select a menu. After that, a new menu item will be created. You must input Menu Title and click Save & Close. And then, go to the frontend to check the form.
In the Module Position
Select In Module Position optional from Save & Show in the toolbar, you can see a module will be shown. Module type is JSN Uniform and included your form. You need to input Module Title, and you can add some contents to the Top Content and Bottom Content. And then, don’t forget to select the module position. Finally, click on the Save & Close button and check on your frontend.
Inside Article
This is the last way to show a form on the frontend. Are you already knowing how to create an article on Joomla site but do not know to create a form inside it? Simply click on the Inside Article, you can see Plugin Syntax Details window. Here show a line of text, you need to copy this line and paste to your article where you want to show form.
Now, the menu, article, or module is ready, you can see final result show in the visitor area.
Wrap-up
Just three steps as described above, you can create a simple contact form quickly and easily. If you want to design more complex form or want to know more about advanced features that JSN Uniform can offer, try our product right now!
Learn more about JSN UniForm:
- How to create GDPR Compliant Forms with JSN UniForm
- How to use JSN UniForm in real-life
- How to create a payment form using JSN UniForm
If you have any question, please leave them below the article. Thank you and see you very soon in the next blog post.
