1. Home
  2. Docs
  3. Flexi Gallery
  4. Shortcode
  5. [flexi-form] Intro

[flexi-form] Intro

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

Was this article helpful to you? Yes No

How can we help?