Ali Ghasemirad

Auto Form Builder is a comprehensive form builder plugin that allows you to create professional forms with an intuitive drag-and-drop interface. Perfect for contact forms, surveys, registration forms, and more.
IMPORTANT FOR REVIEWERS: This plugin includes React-based components that are compiled using Vite. All human-readable source code is included in the <code>/src/</code> and <code>/src-assets/</code> directories with complete build instructions. See the “Source Code & Build Tools” section below for complete documentation of all compiled assets.
<h4>WordPress.org Compliance: Source Code Transparency</h4>
ALL source code for compiled/minified assets is included in this plugin.
<ul>
<li>Minified Files:
<ul>
<li><code>/dist/js/main.js</code> (React form builder – compiled, 55 lines)</li>
<li><code>/dist/css/style.css</code> (React styles – compiled, 1 line)</li>
</ul>
</li>
<li>Source Code: <code>/src/</code> directory (React JSX, CSS, utilities – 40+ files, fully readable)</li>
<li>Build Tool: Vite 4.4.5 (configuration: <code>vite.config.js</code>)</li>
<li>Build Command: <code>npm install && npm run build</code></li>
<li>Dependencies: All listed in <code>package.json</code> with exact versions</li>
<li>Third-Party Libraries: Documented with GitHub source links (see below)</li>
</ul>
Standalone JavaScript/CSS (not compiled): 
* <code>/src-assets/js/custom-date-picker-frontend.js</code> → <code>/dist/js/custom-date-picker-frontend.js</code> 
* <code>/src-assets/css/*.css</code> → <code>/dist/css/*.css</code>
For complete build documentation and third-party library sources, see “Source Code & Build Tools” section below.
<h4>Features</h4>
<ul>
<li>Drag-and-Drop Form Builder – Intuitive interface for building forms</li>
<li>Multiple Field Types – Text, email, dropdown, checkbox, radio, textarea, and more</li>
<li>Advanced Field Types – Address, file upload, multi-step forms</li>
<li>Basic Form Styling – Customizable form appearance with themes</li>
<li>Responsive Design – Forms work perfectly on all devices</li>
<li>Submission Management – View and manage form submissions</li>
<li>Email Notifications – Automated email alerts for new submissions</li>
<li>Security Features – Built-in spam protection and security measures</li>
</ul>
<h4>Premium Features (Separate Plugin)</h4>
<ul>
<li>Conditional Logic – Show/hide fields based on user selections</li>
<li>Advanced Form Styling – Full customization of colors, fonts, and layouts</li>
<li>Form Analytics – Track form performance and conversion rates</li>
<li>reCAPTCHA Integration – Google reCAPTCHA v2 and v3 support</li>
<li>Cloudflare Turnstile – Alternative CAPTCHA solution</li>
<li>Google Sheets Integration – Send submissions directly to Google Sheets</li>
<li>Entry Tags – Organize and categorize form submissions</li>
<li>Priority Support – Get help from our expert support team</li>
</ul>
<h4>Developer Friendly</h4>
Auto Form Builder provides hooks and filters for developers to extend functionality:
<ul>
<li>Custom workflow triggers and actions</li>
<li>Form submission hooks</li>
<li>Field type extensions</li>
<li>Custom validation rules</li>
</ul>
<h4>Source Code & Build Tools (WordPress.org Compliance)</h4>
[REQUIRED READING FOR WORDPRESS.ORG REVIEWERS]
This section documents ALL compiled/minified code and provides complete source code locations and build instructions as required by WordPress.org Plugin Guidelines (Section 4 – Human Readable Code).
All source code is included in the plugin for transparency and WordPress.org compliance.
QUICK REFERENCE: See <code>SOURCE-CODE.txt</code> in plugin root directory for a concise summary of all compiled files and their sources.
<h4>React Form Builder (Compiled with Vite)</h4>
Source Files: 
* <code>/src/</code> directory – React components, hooks, and styles 
 – <code>/src/main.jsx</code> – Entry point 
 – <code>/src/App.jsx</code> – Main application component 
 – <code>/src/components/</code> – All React components (FormBuilder, FieldSettings, etc.) 
 – <code>/src/store/</code> – State management (Zustand) 
 – <code>/src/styles/</code> – CSS stylesheets 
 – <code>/src/utils/</code> – Utility functions 
 – <code>/src/hooks/</code> – Custom React hooks
Build Configuration: 
* <code>vite.config.js</code> – Vite build configuration (in plugin root directory) 
* <code>package.json</code> – Dependencies and build scripts (in plugin root directory) 
* <code>eslint.config.js</code> – ESLint configuration (optional, for development)
Built Output: 
* <code>/dist/js/main.js</code> – Compiled and minified form builder JavaScript 
* <code>/dist/css/style.css</code> – Compiled and minified form builder CSS 
* <code>/dist/manifest.json</code> – Build manifest
Build Commands: 
 <code>npm install # Install dependencies 
npm run build # Build for production (outputs to /dist/) 
npm run dev # Development server with hot reload 
npm run preview # Preview production build</code>
<h4>Standalone JavaScript/CSS (Human-Readable Source)</h4>
Source Files in <code>/src-assets/</code>: 
* <code>/src-assets/js/custom-date-picker-frontend.js</code> – Date picker initialization (280 lines) 
* <code>/src-assets/css/custom-date-picker-frontend.css</code> – Date picker styles 
* <code>/src-assets/css/modern-file-upload.css</code> – File upload component styles
Distribution: 
These files are copied directly (not compiled) from <code>/src-assets/</code> to <code>/dist/</code> during the build process. The files in <code>/dist/</code> are identical to the source files.
<h4>Third-Party Libraries</h4>
Flatpickr v4.6.13 – Date picker library 
* Source: https://github.com/flatpickr/flatpickr 
* License: MIT 
* Plugin files: <code>assets/js/vendor/flatpickr.min.js</code>, <code>assets/css/vendor/flatpickr.min.css</code>, <code>assets/css/vendor/flatpickr-material-blue.css</code> 
* Original unminified source: https://github.com/flatpickr/flatpickr/tree/master/src
React & Dependencies – Bundled in main.js via npm 
* React 18.2.0 – https://github.com/facebook/react (MIT License) 
* React DOM 18.2.0 – https://github.com/facebook/react (MIT License) 
* @dnd-kit – https://github.com/clauderic/dnd-kit (MIT License) 
* Zustand – https://github.com/pmndrs/zustand (MIT License) 
* Immer – https://github.com/immerjs/immer (MIT License)
All npm dependencies are specified in <code>package.json</code> with exact versions.
<h4>Human-Readable JavaScript & CSS (Non-Compiled)</h4>
All JavaScript and CSS files in <code>/assets/</code> directory are human-readable source code (NOT compiled or minified):
Admin JavaScript (<code>/assets/js/admin/</code>) – 14 files: 
* Dashboard, forms list, form builder admin, submissions management, import/export, settings, etc.
Form JavaScript (<code>/assets/js/form/</code>) – 14 files: 
* Form core, validation, field handlers (address, email, file upload, date picker, time picker, etc.)
Frontend JavaScript (<code>/assets/js/frontend/</code>) – 3 files: 
* Field behaviors, field initializers, validation handler
Admin CSS (<code>/assets/css/admin/</code>) – 13 files: 
* Admin interface styles for dashboard, form builder, submissions, settings, etc.
Form CSS (<code>/assets/css/form/</code>) – 22 files: 
* Form styles, field styles, themes, layouts, etc.
Frontend CSS (<code>/assets/css/frontend/</code>) – 2 files: 
* Frontend form styles and template
Total: 68 human-readable JavaScript and CSS files in <code>/assets/</code> directory
<h4>PHP Source Code</h4>
All PHP files are human-readable and not compiled: 
* <code>/includes/</code> – All plugin PHP classes and functionality (30+ files) 
* <code>/assets/</code> – Frontend and admin PHP templates 
* <code>auto-form-builder.php</code> – Main plugin file
<h4>Build Process</h4>
The plugin uses Vite 4.4.5 as the build tool for React components:
<ol>
<li>Install Node.js (v14 or higher recommended)</li>
<li>Navigate to plugin directory in terminal</li>
<li>Run <code>npm install</code> to install all dependencies listed in package.json</li>
<li>Run <code>npm run build</code> to compile React form builder</li>
<li>Compiled files are output to <code>/dist/</code> directory</li>
</ol>
Development Workflow: 
* <code>npm run dev</code> – Starts development server with hot module replacement 
* <code>npm run preview</code> – Preview the production build locally
What Gets Compiled: 
* All React JSX components are transpiled to JavaScript 
* All CSS imports are bundled and minified 
* Code is minified and optimized for production 
* Source maps are NOT included in production builds
Important: All JavaScript in <code>/dist/js/main.js</code> is minified for performance, but 100% of the human-readable source code is available in <code>/src/</code> and <code>/src-assets/</code> directories. Nothing is hidden or obfuscated beyond standard minification.
<h4>Summary: All Compiled/Minified Files & Their Sources</h4>
Complete mapping of all compiled/minified files to their human-readable sources:
 Compiled File 
 Source Location 
 Build Tool 
 Documentation
 <code>/dist/js/main.js</code> (55 lines) 
 <code>/src/</code> (40+ React files) 
 Vite 4.4.5 
 See “React Form Builder” section
 <code>/dist/css/style.css</code> (1 line) 
 <code>/src/styles/</code> (18 CSS files) 
 Vite 4.4.5 
 See “React Form Builder” section
 <code>/dist/js/custom-date-picker-frontend.js</code> 
 <code>/src-assets/js/custom-date-picker-frontend.js</code> 
 None (direct copy) 
 Human-readable
 <code>/dist/css/custom-date-picker-frontend.css</code> 
 <code>/src-assets/css/custom-date-picker-frontend.css</code> 
 None (direct copy) 
 Human-readable
 <code>/dist/css/modern-file-upload.css</code> 
 <code>/src-assets/css/modern-file-upload.css</code> 
 None (direct copy) 
 Human-readable
 <code>assets/js/vendor/flatpickr.min.js</code> 
 https://github.com/flatpickr/flatpickr 
 Flatpickr (3rd party) 
 See “Third-Party Libraries”
 <code>assets/css/vendor/flatpickr.min.css</code> 
 https://github.com/flatpickr/flatpickr 
 Flatpickr (3rd party) 
 See “Third-Party Libraries”
All other JavaScript and CSS files (68 files in <code>/assets/</code>) are human-readable source code.
WordPress.org Compliance Status: ✓ COMPLIANT 
* All compiled code has source available in plugin 
* All build tools documented with instructions 
* All third-party libraries documented with source links 
* Total transparency – nothing hidden

Auto Form Builder

A powerful WordPress plugin for building professional forms with an intuitive drag-and-drop interface.

Aman

webholics

Views for Ninja Forms (NFViews) lets you display Ninja Forms submissions in frontend of your site using drag & drop View builder. 
You can create table view, list view or datatable view (<a href="https://nfviews.com/pricing/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">Pro feature</a>). 
It allows you add content before & after the View. 
You can set number of ninja forms submissions to display per page inside View.
Here is step by step guide to display entries from your Ninja Forms
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/gyAFtnEDqbw?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
<h3>Demo</h3>
<a href="https://nfviews.com/docs/how-to-create-table-view-of-ninja-forms-entries/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">Table View</a> 
<a href="https://nfviews.com/docs/how-to-create-list-view-of-ninja-forms-entries/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">List View</a> 
<a href="https://nfviews.com/docs/how-to-create-a-datatable-view-of-ninja-forms-entries-in-frontend/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">DataTable View</a>
<h3>Top Features</h3>
<ul>
<li>Intuitive user interface!</li>
<li>Easy to use – drag and drop!</li>
<li>Option to select Form fields to display in View.</li>
<li>Option to set custom label for table headings.</li>
<li>Option to set number of entries to show on each page.</li>
<li>Add pagination before or after the table.</li>
<li>Show Pagination Information.</li>
<li>Add custom HTML within View.</li>
</ul>
Get more features in <a href="https://nfviews.com/pricing/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">Pro version</a> 
* <a href="https://nfviews.com/docs/how-to-create-list-view-of-ninja-forms-entries/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">List View Format</a> 
* <a href="https://nfviews.com/docs/how-to-create-a-datatable-view-of-ninja-forms-entries-in-frontend/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">DataTable View Format</a> 
* <a href="https://nfviews.com/how-to-display-only-approved-ninja-forms-submissions-using-nfviews/" rel="nofollow ugc">Display only approved submissions</a> 
* <a href="https://nfviews.com/how-to-edit-ninja-forms-submissions-from-site-frontend/" rel="nofollow ugc">Edit submissions</a> 
* <a href="https://nfviews.com/docs/how-to-display-entry-details-on-single-page/" rel="nofollow ugc">Single Entry View</a> – Display Ninja Forms Entry details on Single Page. 
* <a href="https://nfviews.com/docs/how-to-display-only-user-submitted-entries-in-nfviews-2/" rel="nofollow ugc">Display user only their submissions</a> 
* Add Search Form above or at View bottom to filter/search submissions by field values. 
* <a href="https://nfviews.com/docs/filter-ninjaforms-entries-by-field-value/" rel="nofollow ugc">Filter submissions by field values</a> 
* <a href="https://nfviews.com/docs/sort-results-by-field-value/" rel="nofollow ugc">Sort Ninja Forms submissions via field values</a> 
<a href="https://nfviews.com/pricing/?utm_source=wordpress-plugin-repo&utm_medium=views-for-ninja-forms-lite-version-main-page&utm_campaign=views-for-ninja-forms-lite-version" rel="nofollow ugc">Get Ninja Forms Views PRO!</a>
<h3>Pro Features</h3>
= List & DataTable View Format = 
Display Ninja Forms Entries in multicolumn layout on your site frontend. Display data using dataTables including features like responsive layout, print, pdf, csv download entries options.
<h4>Edit Ninja Forms Entries</h4>
Allow logged-in users to edit their entries from site frontend using the same form that they used to create an entry. Edit Entry works by prefilling Form fields with entry data. After user submits Form entry is updated. Administrators can edit all entries.
<h4>Delete Ninja Forms Entries</h4>
Allow users to delete their submitted entries from the site frontend. Logged-in users can delete their entries, administrators can delete any entry.
<h4>Search Ninja Forms Entries</h4>
Display Search Form in your View to allow users to filter view data by any field value. Options also include searching by Entry Submission Date or Date Range e.g. Display entries submitted between two dates.
<h4>Advanced Filters</h4>
Set Filters to Filter Entries before displaying on site frontend by using any Form field value, logged-in user meta, custom dates, etc. 
E.g. Display all entries where the user selected Male as the Gender field value while submitting the form.
<h4>Advance Sorting</h4>
Sort by any Field value in Ascending or Descending order. Allows you to add multiple sort conditions.
<h4>Entries Approval</h4>
Display only those entries that are approved by the admin from the backend.
<h4>Calculations</h4>
Display the Ninja Forms field total or average in the table footer column.
<h4>Custom HTML</h4>
Add custom HTML within View data. Support Ninja Forms Smart Tags so you can display data by combining multiple field values.

Ninja Forms Views – Display & Edit Ninja Forms Submissions on your site frontend

Display Ninja Forms Submissions on your site frontend using drag & drop View builder.

Auto Form Builder vs Ninja Forms Views – Display & Edit Ninja Forms Submissions on your site frontend