This shortcode lets website visitors to submit & modify Flexi post from the frontend.
If you have a basic html knowledge of creating forms, you can understand it quickly because this shortcode is designed in same way as html <form> </form> tag is used. As we add several <input> fields between the <form> tags, same way [flexi-form] shortcode render [flexi-form-tag] input fields.
Some quick important notes
- [flexi-form] should ends with [/flexi-form]
- All [flexi-form-tag] should be between [flexi-form] & [/flexi-form] tag
- It will render html5 forms and follow it’s rules.
- Only predefined edit page at flexi settings will have edit features.
Before you start building form, it is obvious that you make a plan of input fields you wanted to show to users.
For example:
You wanted to create a form where only title need to be submitted.
If it was a traditional html5 forms the code will be as below
<form title="information" name="my_form">
<label for="title">Title:</label>
<input type="text" id="title" name="title"><br><br>
<input type="submit" value="Submit Now">
</form>
This will render the output as image below but to achieve same output with Flexi, write the shortcode as reference to the above form tags.
[flexi-form title="information" name="my_form" ajax="true"]
[flexi-form-tag type="post_title" title="Title"]
[flexi-form-tag type="submit" name="submit" value="Submit Now"]
[/flexi-form]
Check detail list of attributes here