User Guide. Form Builder. Extension Version User Guide Version Magento Editions Compatibility

Transcription

1 User Guide Form Builder Extension Version User Guide Version Magento Editions Compatibility Community 2.0.0, 2.0.1, 2.0.2, 2.0.3, 2.0.4, Enterprise 2.0.0, 2.0.1, 2.0.2, 2.0.3, 2.0.4, Extension Page : builder maker creator generator designer magento 2 extension.html Front End Demo : form Admin Demo : Not Available 1

2 Content Form Builder V Introduction Installation Usage Admin General Configurations General Tab Date Settings Tab Settings Tab Form Add / Edit General Tab Settings Tab Fields Tab Form Submitted Results How to Add Form in CMS Page How to Add Form Results in CMS Page Front End Sample Form Sample Form Result Page Sample Form Result View Page. Support 2

3 Introduction Web Form Builder allows you to make any type of form right from magento admin, design it and collect data from users in e mail and database easily. For more information about this extension please visit MageArray.com Installation Backup your web directory and store database Download extension installation package Disable Magento Cache run command " php bin/magento cache:disable " using SSH from your magento root directory Upload contents of the extension installation package to your " app/code/magearray/formbuilder " directory Then run commands " php bin/magento setup:upgrade " using SSH from your magento root directory Enable Magento Cache run command " php bin/magento cache:enable " using SSH from your magento root directory 3

4 Usage Admin General Configurations To configure the Form Builder Magento extension, navigate to Stores >> Settings >> Configuration >> MageArray Extensions >> Form Builder. 4

5 General Tab Google Captcha Settings It will use Google Captcha. To use Google Captcha you need. Google Site Key Google Secret Key You can get Google Site key and Google Secret Key by Sign up here Google Captcha. Date Settings Tab Date Fields Order It will help to configure Date format.(ex. mm/dd/yyyy or dd/mm/yyyy or yyyy/mm/dd) Year Range User can specify year range for date field. Settings Tab Sender It will allow to select sender name and address. 5

6 Form Add / Edit Forms can be viewed and managed through MageArray Extensions >> Forms. Here admin can add/edit forms. 6

7 General Tab Form Name You can specify form name. Description It will contain form description where you can add HTML, Image, etc. using editor. Success Message It will display when form will submitted successfully. Status It will Enable / Disable particular form. 7

8 Settings Tab 8

9 Fields Tab Form Builder V Settings Subject It will contain subject of which is sent through formbuilder. Send To Admin? It will Enable / Disable functionality to send form result to Admin. Admin Address The form result will be sent to entered e mail address. Send To Customer? It will Enable / Disable functionality to send a form result to the customer. Customer Address Field You can select e mail address field from created form fields where customer will enter address and it will use for receive . Customer Name Field You can select name field from created form fields where the customer will enter a name. General Settings Captcha It will Enable / Disable Captcha on frontend. Enable Approval It will approve result of form submitted by customer. Redirect URL The form will be redirected to entered URL after submitting a form. Submit Button Text It will allow you to change Submit button Label. Form CSS You can change design as per requirement through From CSS. Add New Fieldset Name: Name of the fieldset Status: It will Enable / Disable particular fieldset. 9

10 Add New Field Name: Name of the input field Input Type: Input type of the input field Status: It will Enable / Disable particular input field Class: Use specific class for that input field Validator: Select which validation you want use for this field Required: Field is required or not. 10

11 Input Types Text Field: Use for Text type input field Placeholder: you can add placeholder text for text input field. Area: Use for text area type input field Placeholder: you can add placeholder text for text input field. 11

12 File File: Use to make field of file type Compatible File Extensions: You can add allowed type of file s extension Select Dropdown: it create select field of drop down type Radio Buttons: it create select field of radio button type Checkbox: it create select field of checkbox type Multiple Select: it create select field of Multiple Select type 12

13 Date Date: It shows date picker in the field Custom 1 Html: Html input type is use to add any html code like Map, Image. You can add your code in HTML content section 13

14 Custom 2 Pre Filled: When you want to show some field pre filled then the field type is helpful Visible Editable : It allows to edit the pre filled value in the field Visible Read Only: It doesn t allow to edit the pre filled value and it s read only Hidden: It use to make hidden type of input field which is pre filled when form loads Parameter: add name of the parameter which pass through the url. 14

15 Form Submitted Results 15

16 How to Add Form in CMS Page 1. Go to Content >> Pages 2. Select page where you want to add that form. 16

17 3. Now Go to Content Tab and Click on Insert widget button. 4. Select FormBuilder from given Widget Type. 17

18 5. It will show Widget Options named Form Name. 6. Select form which you want to add to that page, and click insert widget so it add widget code in content area. 7. Now Click Save Page button. 8. If cache enable then refresh your magento cache. 18

19 How to Add Form Results in CMS Page Follow Step 1 to 3 of How to Add form in CMS Page. 4. Select Formbuilder Results from given Widget Type. 19

20 5. It will show Widget Options Form Name : Select form name whose results you want to display in frontend. Results per page : How many results you want to display for each page. More than specified result will shown in next page. Form Fields that will display in grid : Select fields which you want to show in results grid 6. Click on Insert Widget button. 20

21 7. Now Click Save Page button. 8. If cache enable then refresh your magento cache. 21

22 Front End Sample Form 22

23 Sample Form Result Page 23

24 Sample Form Result View Page. 24

25 Support We support all our customers through our website or mail us on If you have any questions on Extension or need support with its use please contact us we're happy to help you. 25