How to Create a DataTable view of Contact Form 7 Entries in Frontend

The DataTable view provides real-time sorting of rows and page navigation, along with options to copy, export (CSV, Excel, PDF), and print entries directly from the view.

Please note that the DataTable feature is exclusively available in the Developer Plan of CF7 Views Pro.

Here are the steps to create a DataTable view of Contact Form 7 Entries:

1. From your WordPress dashboard, navigate to CF7 Views Pro and click on ‘Add New.’
   
   
   
2. Give your view a title.
3. Select the Contact form for which you want to create a DataTable view.
4. Choose ‘DataTable’ as the View Type.
   
   
   
5. In the ‘Before Entry List’ section, you can add Pagination, Pagination Info, HTML, Search, and DataTable Buttons fields. The DataTable Buttons field allows you to add options for copying, exporting, or printing entries.
   
   
   
6. In the ‘Entry List Fields’ section, you can include form fields for which you want to display entry data on the frontend.
   
   
   
7. The ‘After Entry List’ section contains the same field options as the ‘Before Entry List’ section.
8. Under ‘View Settings,’ you will find a ‘DataTable’ tab where you can configure settings such as making the DataTable responsive, PDF orientation, and PDF page size for exporting entries.
   
   
   
9. Click the ‘Publish’ button to save your DataTable view.

To display the DataTable view of Contact Form 7 Entries on the frontend:

1. Copy the shortcode for the DataTable view you just created.
2. Paste the shortcode into a post or page where you want to display it.