Satinder Singh

CoolHappy

Cool Plugins

<h3>Divi Contact Form Extender</h3>
<p><strong><a href="https://coolplugins.net/product/contact-form-extender-for-divi-builder/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=get_pro&utm_content=top_description" rel="nofollow ugc">Contact Form Extender for Divi</a></strong> is a must-use Divi extension that enhances the native contact form module with useful fields and features like <strong>file upload</strong>, <strong>country code dropdown</strong>, and more. It also works as a Divi Contact Form DB solution that securely stores Divi form submissions inside your WordPress database. Advanced fields (Signature, Toggle, and Image Radio) are available in <strong><a href="https://coolplugins.net/product/contact-form-extender-for-divi-builder/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=get_pro&utm_content=top_pro_link#pricing" rel="nofollow ugc">Pro version</a></strong>.</p>
<p>As a Divi theme user, you may already know that the default form module sends email notifications but does not keep a backup of entries inside the dashboard. This plugin improves form management and lead handling by saving submissions in the admin area and extending the built-in module without replacing it or requiring a separate form builder plugin.</p>
<p><span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/k3NLq5NRiVE?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></span></p>
<h3>Features of Divi Form Extender</h3>
<ul>
<li>
<p><strong><a href="https://docs.coolplugins.net/doc/save-divi-contact-form-submissions/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=features_save" rel="nofollow ugc">Save Form Entries in Database</a></strong><br />
Automatically store every form entry directly inside your WordPress admin panel, giving you full control over incoming inquiries. Instead of depending only on email notifications, you can review, search, and manage submissions from a centralized location. This is especially useful for tracking leads, monitoring customer inquiries, verifying message history, and maintaining records for compliance or internal reporting. All entries are securely saved within your website’s database, ensuring that important communication data remains accessible even if email delivery fails.</p>
</li>
<li>
<p><strong><a href="https://docs.coolplugins.net/doc/divi-form-file-upload-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=features_file_upload" rel="nofollow ugc">File Upload Field for Divi Forms</a></strong><br />
Enhance your forms by allowing visitors to attach files along with their submissions. This feature is ideal for job applications, support requests, project briefs, design assets, quotations, and document submissions. Uploaded files are handled through WordPress’s native media handling system, ensuring compatibility with standard hosting environments. You can control file types and size limits based on your server configuration, providing both flexibility and security. This makes your forms more dynamic and suitable for professional use cases.</p>
</li>
<li>
<p><strong><a href="https://docs.coolplugins.net/doc/country-code-dropdown-divi-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=features_country_code" rel="nofollow ugc">Country Code Selector for Phone Field</a></strong><br />
Improve the accuracy and consistency of phone number collection by enabling an international country code selector. This feature is particularly valuable for websites serving global audiences. By separating the country code from the main phone number input, you reduce formatting errors and make it easier to manage international inquiries. The dropdown enhances user experience by simplifying the input process while helping administrators receive properly structured contact information.</p>
</li>
<li>
<p><strong>Clean Dashboard Interface:</strong><br />
Inside the WordPress admin area, the plugin provides a dedicated dashboard under:<br />
<strong><em>Divi > Contact Form Extender</em></strong><br />
The interface is organized into clear sections:</p>
<ul>
<li>Form Elements: Enable or disable specific fields.</li>
<li>Settings: Configure additional options.</li>
<li>Form Submissions: View and manage saved entries.</li>
</ul>
</li>
<li>
<p><strong>Lightweight & Optimized Divi Extension:</strong><br />
Built with performance and stability in mind, this extension integrates smoothly with the Divi environment without adding unnecessary overhead. It does not replace the existing form module or inject heavy frontend scripts. The focus is on clean implementation, efficient database storage, and minimal impact on page speed. Whether you are running a small business website or a high-traffic project, the plugin is designed to maintain reliability while extending functionality in a structured and scalable way.</p>
</li>
</ul>
<h3><a href="https://coolplugins.net/product/contact-form-extender-for-divi-builder/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=get_pro&utm_content=pro_version#pricing" rel="nofollow ugc">Pro Version with Advanced Fields</a></h3>
<p><strong><a href="https://coolplugins.net/product/contact-form-extender-for-divi-builder/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=get_pro&utm_content=upgrade_to_pro" rel="nofollow ugc">Pro version</a></strong> adds advanced input fields to the Divi Contact Form module. After upgrading, enable each field under <strong>Divi <span aria-hidden="true" class="wp-exclude-emoji">→</span> Contact Form Extender <span aria-hidden="true" class="wp-exclude-emoji">→</span> Form Elements</strong>, then add it inside the Contact Form module in the builder. Each heading below links to documentation for that field.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-signature-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=signature_field" rel="nofollow ugc">Signature Field</a></h3>
<p>Collect handwritten digital signatures directly within the Divi form. This is useful for consent forms, service agreements, policy acceptance, waivers, approvals, or confirmation requests. It adds a professional touch when you need acknowledgment from users without using external tools.</p>
<h3><a href="https://docs.coolplugins.net/doc/toggle-field-divi-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=toggle_field" rel="nofollow ugc">Toggle Field</a></h3>
<p>Replace traditional checkboxes with a clean on/off switch inside your Divi form. Toggle fields are perfect for enabling optional add-ons, confirming agreements, activating services, or selecting preferences. The interface feels simple and modern while keeping the form layout clean.</p>
<h3><a href="https://docs.coolplugins.net/doc/image-radio-divi-contact-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=image_radio_field" rel="nofollow ugc">Image Radio Field</a></h3>
<p>Let users select options using images instead of plain text. This works beautifully for product choices, design layouts, package selection, branding styles, or visual preferences. Inside Divi, this makes your form feel more interactive and visually engaging rather than purely text-based.</p>
<h3><a href="https://docs.coolplugins.net/doc/country-state-field-divi-contact-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=country_field" rel="nofollow ugc">Country Field</a></h3>
<p>Add a dedicated country selector to your form so addresses and regional data stay standardized. Works well with shipping, registration, and lead forms that need a clear country value.</p>
<h3><a href="https://docs.coolplugins.net/doc/country-state-field-divi-contact-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=state_field" rel="nofollow ugc">State Field</a></h3>
<p>The State field works alongside the Country field to display and select the relevant state or province based on the selected country. This ensures accurate and structured location data, making it easier to manage regional settings, routing, and data organization.</p>
<h3><a href="https://docs.coolplugins.net/doc/range-slider-divi-contact-form/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=range_slider_field" rel="nofollow ugc">Range Slider Field</a></h3>
<p>Collect numeric input using a smooth, draggable slider in your forms created with Divi page builder. This is perfect for budget ranges, quantity selection, service levels, rating scales, donation amounts, or custom estimates. Instead of typing numbers manually, visitors can simply slide to their preferred value.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-date-picker-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=date_picker_field" rel="nofollow ugc">Date & Time Picker Field</a></h3>
<p>Allow users to choose dates and time slots directly from a structured picker interface inside your Divi form. Ideal for appointment requests, meeting scheduling, delivery slots, consultation bookings, or event registrations. It prevents formatting mistakes and ensures you receive properly structured date information every time.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-calculator-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=calculator_field" rel="nofollow ugc">Calculator Field</a></h3>
<p>Build intelligent calculation logic directly into your Divi form. Automatically calculate totals based on user selections such as quantity, service type, duration, or pricing models. Ideal for quotation forms, cost estimators, service configuration tools, or custom order requests. The results update dynamically, providing instant feedback to users.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-select-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=select2_field" rel="nofollow ugc">Select2 Dropdown Field</a></h3>
<p>Enhance standard dropdown menus with a searchable and user-friendly selection interface. This is especially useful when dealing with long option lists such as cities, services, departments, categories, or product names. Visitors can quickly search and select without scrolling endlessly.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-rating-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=rating_field" rel="nofollow ugc">Rating Field</a></h3>
<p>Let visitors rate an experience, product, or service using a clear star or icon-based control. Ideal for feedback forms, reviews, support satisfaction, and quick sentiment checks without asking for long written answers.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-currency-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=currency_field" rel="nofollow ugc">Currency Field</a></h3>
<p>Collect monetary amounts with a structured currency input so values stay consistent for quotes, deposits, donations, or budget inquiries. Helps reduce ambiguity compared to a plain text field.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-wysiwyg-field/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=wysiwyg_editor_field" rel="nofollow ugc">WYSIWYG Field</a></h3>
<p>Offer a rich text area with basic formatting so users can emphasize lists, links, or short structured content—useful for detailed messages, briefs, or instructions while keeping input inside the Divi form.</p>
<h3><a href="https://docs.coolplugins.net/doc/divi-contact-form-confirm-dialog-box/?utm_source=cfefd_plugin&utm_medium=readme&utm_campaign=docs&utm_content=confirm_dialog" rel="nofollow ugc">Confirm Dialog Box</a></h3>
<p>Show a confirmation step before the form is submitted so visitors explicitly agree to terms, pricing, or important actions. Reduces accidental submissions and supports consent-style workflows.</p>
<h3>More Divi Extensions & Other Plugins</h3>
<p>This plugin is developed and maintained by <a href="https://coolplugins.net" rel="nofollow ugc">Cool Plugins</a>, a trusted WordPress plugin development company. Explore more Divi extensions and other cool plugins built by us.</p>
<ul>
<li>
<p><a href="https://cooltimeline.com/plugin/timeline-module-for-divi/" rel="nofollow ugc">Timeline Module for Divi</a> : Create visually engaging vertical and horizontal timelines directly inside Divi page builder. This plugin allows you to showcase company history, product evolution, project milestones, roadmaps, achievements, or storytelling sections in a structured layout. It integrates smoothly with Divi’s design controls, enabling full styling customization while keeping the editing experience consistent within the builder interface.</p>
</li>
<li>
<p><a href="https://eventscalendaraddons.com/plugin/the-events-calendar-modules-for-divi/" rel="nofollow ugc">Events Calendar Modules for Divi</a> : Display and design event listings inside Divi using custom modules built specifically for The Events Calendar plugin. Whether you need event grids, event lists, or calendar-style layouts, this extension allows you to control presentation without custom coding. It helps event-based websites manage schedules, workshops, conferences, and recurring events within the Divi design framework.</p>
</li>
<li>
<p><a href="https://coolformkit.com" rel="nofollow ugc">Cool FormKit for Elementor</a> : If your projects use Elementor instead of Divi, Cool FormKit provides similar form-enhancement capabilities for the Elementor Form widget. It extends Elementor forms with additional input fields, entry storage options, and advanced functionality designed for professional websites.</p>
</li>
<li>
<p><a href="https://coolplugins.net/product/autopoly-ai-translation-for-polylang/" rel="nofollow ugc">AutoPoly – AI Translation for Polylang</a> : AutoPoly helps automate multilingual website creation by integrating AI-powered translation into the Polylang plugin. It enables bulk translation of posts, pages, and custom content types, reducing manual workload and speeding up content localization. This is especially useful for businesses expanding to international markets or managing content in multiple languages.</p>
</li>
</ul>
<p><strong>Third-Party Services:</strong> To improve plugin experience, this plugin may offer optional feedback submission and limited diagnostic data sharing. Data is transmitted strictly after explicit user consent (opt-in). No hidden tracking and no site users or visitor is collected. For complete details, please review our <a href="https://my.coolplugins.net/terms/usage-tracking/" rel="nofollow ugc">Data Usage Policy</a>, <a href="https://my.coolplugins.net/terms/" rel="nofollow ugc">TOS</a>, and <a href="https://my.coolplugins.net/terms/privacy-policy/" rel="nofollow ugc">Privacy Policy</a>.</p>
<p>It also includes the <a href="https://intl-tel-input.com/" rel="nofollow ugc">intl-tel-input</a> library, distributed under the <a href="https://github.com/jackocnr/intl-tel-input/blob/master/LICENSE" rel="nofollow ugc">MIT License</a>.</p>
<p><strong>Disclaimer:</strong> This Divi extension is developed and maintained by <a href="https://coolplugins.net" rel="nofollow ugc">Cool Plugins</a>. It is not affiliated with, or endorsed by Elegant Themes. Some links inside this plugin or its readme may be affiliate links, which means we may earn a small commission at no additional cost to you.</p>
<p><strong>Divi 5 Compatibility:</strong> This plugin is fully compatible with both <strong>Divi 5</strong> and <strong>Divi 4</strong> editors. Whether you are building your contact form using the latest Divi 5 builder interface or the classic Divi 4 editor, you can still use all the features provided by this extension.</p>


Contact Form Extender for Divi – Submissions DB & Extra Fields

Extend Divi Contact Form module with file upload field, country code dropdown, and save Divi form submissions in the database.

codepeople

<p>Data Source for Contact Form 7 plugin allows populating the “Contact Form 7” fields (text, email, URL, drop-down menu, …) with data stored in external data sources, like a database, CSV file, URL parameters, users information, post data, taxonomies, Advanced Custom Fields (ACF) – Secured Custom Fields, and JSON objects.</p>
<p>Data Source for Contact Form 7 includes two new controls in the controls bar of Contact Form 7, recordset and recordset field link. The “recordset” control reads the information from the external data source (a database, a CSV file, or any other data source supported), and the “recordset field link” control for linking the recordsets and form fields to populate them with the recordset data.</p>
<p>A form can include several “recordset” fields, and it is possible to link multiple “recordset field link” controls to the same recordset.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/bcf1i6jvlYE?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></span>
<p>The new SQL-Generator module. It generates the database queries in a more conversational style. Just describe the information needed, and get the DB query without any prior database knowledge.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/a-8AtsNJZ1A?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></span>
<p>How to create the simplest contact form from our practical examples.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/DisVNGHiMe0?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></span>
<p>The plugin includes other complementary controls in the controls bar in addition to the “recordset” and “recordset field link”. The “Print Form” button for printing the form area, “Data Table” control for inserting an advanced table with the recordset records, “copy to clipboard” functionality for copying the values of the fields into the clipboard, and the “Search box in dropdown menu” functionality to make easy the selection in long dropdown menus.</p>
<h4>Features:</h4>
<ul>
<li>Set the information of external data sources available for the Contact Form 7 fields.</li>
<li>Easy to use, includes two new controls in the controls bar to define the <a href="https://cf7-datasource.dwbooster.com/documentation#recordset-control" rel="nofollow ugc">recordsets</a> and the <a href="https://cf7-datasource.dwbooster.com/documentation#link-control" rel="nofollow ugc">link fields</a>.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#url-parameters" rel="nofollow ugc">“URL Parameters”</a> data source to populate the form’s fields with the values of the URL parameters.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#user-information" rel="nofollow ugc">“Users Information”</a> data source to populate the form’s fields with the users’ information.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#post-data" rel="nofollow ugc">“Posts Information”</a> data source to populate the form’s fields with the posts’ data, pages, and custom post types (like the WooCommerce products).</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#taxonomy" rel="nofollow ugc">“Taxonomy”</a> data source to populate the form’s fields with taxonomy terms, like categories, posts tags, or any other custom taxonomy.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#database" rel="nofollow ugc">“Database”</a> data source to populate the form’s fields with the information of a database. Allow defining even complex queries.</li>
<li>SQL Generator module. It generates the database queries in a more conversational style.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#javascript-function" rel="nofollow ugc">“Javascript Function”</a> data source to populate the form’s fields with the information returned from a Javascript function.</li>
<li>Allows using the fields’ values for filtering the recordset records.</li>
<li><a href="https://cf7-datasource.dwbooster.com/complementary-controls-addon" rel="nofollow ugc">Complementary Controls add-on</a>. Includes additional controls and functionalities, such as the “Print Form” button, the addition of the search box to the drop-down menu, copy to clipboard functionality, and Data Table to display the data source records.</li>
</ul>
<h4>Features in Premium version:</h4>
<ul>
<li>All features of the free version of the plugin.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#acf" rel="nofollow ugc">“Advanced Custom Fields (ACF) – Secured Custom Fields”</a> data source to fill the form filds with data stored in the Advanced Custom Fields or Secured Custom Fields in post, users, comments, taxonomies, widgets, and options.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#csv" rel="nofollow ugc">“CSV”</a> data source to populate the form’s fields with the data store into a CSV file.</li>
<li>Includes the <a href="https://cf7-datasource.dwbooster.com/documentation#json" rel="nofollow ugc">“JSON”</a> data source to populate the form’s fields with the data store into a JSON file. There are hundreds of services whose outputs are JSON objects.</li>
<li><a href="https://cf7-datasource.dwbooster.com/pdf-generator-addon" rel="nofollow ugc">PDF Generator add-on</a>. It generates PDF files with the information collected by the form and attaches them to the notification emails (Supports the “Conditional Fields for Contact Form 7” plugin tags in the PDF file content if the “Conditional Fields for Contact Form 7” plugin is installed on the website).</li>
<li><a href="https://cf7-datasource.dwbooster.com/post-generator-addon" rel="nofollow ugc">Post Generator add-on</a>. It generates new posts (posts, pages, or any custom post) with the information collected by the form.</li>
<li><a href="https://cf7-datasource.dwbooster.com/user-registration-addon" rel="nofollow ugc">User Registration add-on</a> to convert contact forms into user registration forms.</li>
<li><a href="https://cf7-datasource.dwbooster.com/csv-generator-addon" rel="nofollow ugc">CSV Generator add-on</a> to populate a CSV file with the information collected by the form.</li>
<li><a href="https://cf7-datasource.dwbooster.com/json-generator-addon" rel="nofollow ugc">JSON Generator add-on</a> to populate a JSON file with the information collected by the form.</li>
<li><a href="https://cf7-datasource.dwbooster.com/server-side-addon" rel="nofollow ugc">Server Side add-on</a> to implement server side functions to call from the Recordset controls and get the list of records.</li>
</ul>
<h4>Data Source Fields</h4>
<p>Data Source for Contact Form 7 includes two new controls in the controls bar of Contact Form 7, <a href="https://cf7-datasource.dwbooster.com/documentation#recordset-control" rel="nofollow ugc"><strong>recordset</strong></a> and <a href="https://cf7-datasource.dwbooster.com/documentation#link-control" rel="nofollow ugc"><strong>recordset field link</strong></a>.</p>
<p>The recordset control reads the information from the external data source and makes it available on the form. A recordset field can read one or many records from the data source.</p>
<p>To insert a recordset field in the form, press the <strong>“recordset”</strong> button in the controls bar. This action opens a dialog to define the recordset.</p>
<p>The insertion dialog includes common attributes for all data sources and specific attributes for the data source selected.</p>
<p>The <strong>“recordset field link”</strong> control links a recordset field to other fields in the form to populate them with the recordset data.</p>
<p>To insert a link field in the form, press the <strong>“recordset field link”</strong> button in the controls bar. This action opens a dialog to define the relationship between a recordset and a form’s field.</p>
<p>The link dialog includes the attributes to define the relationship between the recordset field and the form’s fields.</p>
<h4>Cases of Use</h4>
<p>Get the information of the registered user and populate the form fields for his name and email:</p>
<pre><code><label> Your name [text* your-name] </label>

<label> Your email [email* your-email] </label>

<label> Subject [text* your-subject] </label>

<label> Your message (optional) [textarea your-message] </label>

[cf7-recordset id="cf7-recordset-434" type="user" attributes="first_name, user_email" logged="1"]

[cf7-link-field recordset="cf7-recordset-434" field="your-name" value="first_name"]

[cf7-link-field recordset="cf7-recordset-434" field="your-email" value="user_email"]

[submit "Submit"]
</code></pre>
<p>Filling a plain text in the form with the first name and last name of the logged user:</p>
<pre><code><label> Hello <span id="first-name"></span> <span id="last-name"></span></label>

<label> Enter your address [textarea address] </label>

[cf7-recordset id="cf7-recordset-434" type="user" attributes="first_name, last_name" logged="1"]

[cf7-link-field recordset="cf7-recordset-434" field="first-name" value="first_name"]

[cf7-link-field recordset="cf7-recordset-434" field="last-name" value="last_name"]

[submit "Submit"]
</code></pre>
<p>Populates the list of WooCommerce products and get the price of the selected one:</p>
<pre><code><label>Products List [select menu-719]</label>

<label>Product Price [number number-534]</label>

[cf7-recordset id="cf7-recordset-619" type="database" engine="mysql" query="SELECT ID,post_title,meta_value as price FROM {wpdb.posts} posts, {wpdb.postmeta} meta WHERE posts.post_type='product' AND posts.ID=meta.post_id AND meta.meta_key='_regular_price'"]

[cf7-link-field recordset="cf7-recordset-619" field="menu-719" value="ID" text="post_title"]

[cf7-link-field recordset="cf7-recordset-619" field="number-534" value="price" condition="record['ID']=={field.menu-719}"]

[submit "Submit"]
</code></pre>
<p>Using templates to create complex data structures. Displaying the title and excerpt of every published post:</p>
<pre><code><div id="posts-list"></div>
<template id="summary">
<p style="font-style:bold">{attribute.post_title}</p>
<p>{attribute.post_excerpt}</p>
</template>

[cf7-recordset id="cf7-posts" type="post" attributes="post_title,post_excerpt" condition="post_status='publish' AND post_type='post'"]

[cf7-link-field recordset="cf7-posts" field="posts-list" value="{template.summary}"]
</code></pre>
<p>The form includes a template tag to design a complex data structure. To access the records attributes from the template, use {attribute.attribute-name} format. Ex. {attribute.post_title}</p>
<p>You can use the templates for the fields’ values or texts. The format for referring to templates is {template.template-id}. You should replace “template-id” with the id of the template tag. Ex. {template.summary}</p>
<pre><code>[cf7-link-field recordset="cf7-posts" field="posts-list" value="{template.summary}"]
</code></pre>
<h4>Using Javascript to Access the Recordset Data</h4>
<p>The recordset fields trigger the “cf7-recordset” event after receiving the information from the data source, allowing you to access this information with Javascript. In this example, the recordset field reads motivational phrases from a third-party service and displays the first of them into a DIV tag on the form.</p>
<span class="embed-youtube" style="text-align:center; display: block;"><iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/YIpXLR-A014?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></span>
<h4>Add ons (Extensions)</h4>
<p><a href="https://cf7-datasource.dwbooster.com/complementary-controls-addon" rel="nofollow ugc">Complementary Controls add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/pdf-generator-addon" rel="nofollow ugc">PDF Generator add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/post-generator-addon" rel="nofollow ugc">Post Generator add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/user-registration-addon" rel="nofollow ugc">User Registration add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/csv-generator-addon" rel="nofollow ugc">CSV Generator add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/json-generator-addon" rel="nofollow ugc">JSON Generator add-on</a></p>
<p><a href="https://cf7-datasource.dwbooster.com/server-side-addon" rel="nofollow ugc">Server Side add-on</a></p>


Data Source for Contact Form 7

Allows you to use server side data with the CF7 form, like the users information, posts data, taxonomies, and many other data sources.

Versatile plugin

The Data Source for Contact Form 7 plugin populates fields with data from external sources like databases, CSVs, URL parameters, ACF, and others.

Contact Form Extender for Divi – Submissions DB & Extra Fields vs Data Source for Contact Form 7