Please wait...

How can we help?

Choose sections:

  • Styling and CSS
  • Technical issues
  • Column settings
  • Licensing and support
  • Charts
  • Pre-purchase questions
  • Advanced filtering
  • Examples
  • Addons
  • Table settings
Expand All | Collapse All
  • 1. How to center text in the table?
     

    Just add this code below in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpDataTables. In this example we align the text in the center of the table, you can change the text-align to your desire by changing the word “center” to “left” or “right.

    .wpDataTablesWrapper table.wpDataTable td, 
    .wpDataTablesWrapper table.wpDataTable th,
    .wpDataTablesWrapper table.wpDataTable td.numdata, 
    .wpDataTablesWrapper table.wpDataTable th.numdata
    { text-align: center !important; }
    

    This will be affected on all tables, but if you want just for specific one then insert this code on the page where is that table between the style tag (<style>Code here</style>).

    <style>
    .wpDataTablesWrapper table.wpDataTable td, 
    .wpDataTablesWrapper table.wpDataTable th,
    .wpDataTablesWrapper table.wpDataTable td.numdata, 
    .wpDataTablesWrapper table.wpDataTable th.numdata
    { text-align: center !important; }
    </style>
    
    Permalink
    Was this answer helpful ?

    Yes(4) No(0)
    Viewed 595 Times
  • 2. How to hide pagination?
     

    Just add this code in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpDataTables.

    .wpDataTablesWrapper .dataTables_paginate{display : none !important;}
    

    This will be affected on all tables, but if you want just for specific one then insert this code on the page where is that table between the style tag (<style>Code here</style>).

    <style>
    .wpDataTablesWrapper .dataTables_paginate{display : none !important;}
    </style>
    
    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 312 Times
  • 3. How to hide New, Edit or Delete buttons?
     

    To hide New, Edit or Delete button you can add one of this CSS in Custom CSS field on
    wpDataTables settings page or directly on the page between<style>Your code</style> tags:

    .DTTT_button_new {
    display: none !important;
    }
    .DTTT_button_delete {
    ​display: none !important;
    }
    .DTTT_button_edit {
    display: none !important;
    }
    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 286 Times
  • 4. How can I set option Scrollable just on mobile devices?
     

    You can set this by inserting this CSS code in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpdatatables.

    @media screen and (min-width: 780px) {
       .wpDataTablesWrapper div.wdtscroll {
         overflow-x: initial !important;
       }
    }
    

    This will be affected on all tables, but if you want just for specific one then insert this code on page where is that table between the style tag.(<style>Code here</style>)

    <style>
    @media screen and (min-width: 780px) {
        .wpDataTablesWrapper div.wdtscroll {
          overflow-x: initial !important;
        }
    }
    </style>
    

    Please note that Scrollable option should be turned on in the table settings.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 218 Times
  • 5. Which selectors are for SUM, AVG, MIN and MAX?
     

    For customization of layout for options Calculating totals, minimum, maximum and average cells in wpDataTables you can use this selectors:

    .wdt-sum-cell,  /* for totals  */
    .wdt-avg-cell,  /* for average */
    .wdt-min-cell,  /* for minimum */
    .wdt-max-cell,  /* for maximum */
    
    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 266 Times
  • 6. How can I remove table header?
     

    Just add this code below in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpDataDables.

    .wpdt-c .wpDataTablesWrapper table.wpDataTable thead {
    display: none !important;
    }

    This will be affected on all tables, but if you want just for specific one then insert this code on the page where is that table between the style tag (<style>Code here</style>)

    <style>
    .wpdt-c .wpDataTablesWrapper table.wpDataTable thead {
    display: none !important;
    }
    </style>
    
    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 315 Times
  • 7. The text of the row start on top and not in the middle of the row. How can i make that?
     

    Just add this code in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpdatatables.

    table.wpDataTable tbody tr td{
    vertical-align:top !important;
    }

    That will be effected on all tables, but if you want for specific tables then insert this code between style tags on the page where is that table.

    <style>
    table.wpDataTable tbody tr td{
    vertical-align:top !important;
    }
    </style>
    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 277 Times
  • 8. How can I style looks of the Table Tools buttons of a table?
     

    You can use CSS class for each button.

    .DTTT_button_print /* for print */
    .DTTT_button_xls   /* for excel */
    .DTTT_button_csv   /* for csv   */
    .DTTT_button_copy  /* for copy  */
    .DTTT_button_pdf   /* for pdf   */
    

    You can insert your custom CSS for this buttons in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpdatatables. If you want for specific tables then insert this code between style tags on the page where is that table.

    Permalink
    Was this answer helpful ?

    Yes(1) No(3)
    Viewed 305 Times
  • 1. What can I do if advanced filtering and global search is not working?
     

    This usually happens for MySQL-based tables with server-side processing turned on.

    Please check if you have a complicated query with JOINs, calculated columns (for example, ” SELECT mycolumn*2 AS mycolumn2″), or some custom column aliases (e.g. “SELECT mycolumn AS ‘some/weird/name’). If this is the case, please either create a MySQL view (in PHPMyAdmin or similar MySQL DB manager) and build a wpDataTable based on this view.

    From version 2.3 we implement feature that you can use multiply separate db connections for (MySQL,MSSQL and PostgreSQL) and for MySQL engine we are dynamically adding accent grave (`). If you use this accent grave (`) in your query, please remove it and searching and filtering will work fine.

    Permalink
    Was this answer helpful ?

    Yes(2) No(1)
    Viewed 326 Times
  • 2. I added a table but see no sorting, filtering or pagination
     

    1. Please check first if PHP version is at least 5.4 or newer. It is required for the proper running of wpDataTables.

    2. The second thing to check is that there are no JS errors in the javascript console. Please check e.g. in Chrome JS console. Usually when we investigate such things we find out that some other plugin or theme are broken, and wpDataTables JS cannot execute.

    3. Try to turn off option "Include bootstrap on front-end" in main settings of the plugin.

    4. Please try to deactivate other plugins one by one and check if some of them are in conflict with wpDataTables.

    5. Please try switching the theme to a different one and see if it helps.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 228 Times
  • 3. Can’t connect to remote MySql database?
     

    If you are using separate MySql connection option to connect to mysql database, you can test if connection can actually be established with “Test MySQL settings” button.
    If connection can’t be established, first please make sure that all entered values needed for connection are correct.
    Also make sure that MySql server is allowing remote connections and that MySql user that you are trying to connect with is allowed to connect from your sites host(IP address).

    From 2.3 version of our plugin there is an option to add more than one separate database connection. Now every table can have its own separate database connection, so tables can pull data from multiple databases and servers.

    If your WordPress is hosted on Azure Web App Services you will need to modify the config.inc.php file, around line 65 find this line of code

    $wdtMsSqlDriver = [
    ‘sqlsrv’ => [‘active’ => false],
    ‘dblib’ => [‘active’ => true, ‘version’ => ‘7.0’],
    ‘odbc’ => [‘active’ => false, ‘driver’ => ‘{ODBC Driver 17 for SQL Server}’],
    ];
    

    and change it to look like this:

    $wdtMsSqlDriver = [
    ‘sqlsrv’ => [‘active’ => true],
    ‘dblib’ => [‘active’ => false, ‘version’ => ‘7.0’],
    ‘odbc’ => [‘active’ => false, ‘driver’ => ‘{ODBC Driver 17 for SQL Server}’],
    ];
    
    Permalink
    Was this answer helpful ?

    Yes(1) No(3)
    Viewed 297 Times
  • 4. What to do if I get error in Console 403 Forbidden?
     

    The 403 Forbidden error is an HTTP status code which means that accessing the page or resource you were trying to reach is absolutely forbidden for some reason. Our suggestion is to check your server log and see if there are some errors and also if you have some security plugins please try to deactivate it and see if it will work after that. Also, check if the mod_security is turn-on on your server.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 195 Times
  • 5. What to do if I get error in Console 404 NOT FOUND?
     

    If you get error admin-ajax.php 404 NOT FOUND in Console of the browser please check do you have some firewall or some security (some plugin or turn on mod_security) on a server that causes not finding WordPress native file admin-ajax.php that we used for ajax calls.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 194 Times
  • 6. What to do if I get error Failed to connect: Network is unreachable?
     

    We suppose that your server is on Bluehost. If the answer is yes, you have to add some code in
    file ../wp-content/plugins/wpdatatables/source/class.wdttools.php around line 147 you will  find this line of code:

    curl_setopt($ch, CURLOPT_REFERER, site_url());
    

    and after it add:

    curl_setopt( $ch, CURLOPT_IPRESOLVE, CURL_IPRESOLVE_V4);
    

    This fix should resolve the issue that is related with Bluehost. Your code should looks like below.

    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
    curl_setopt($ch, CURLOPT_USERAGENT, $agent);
    curl_setopt($ch, CURLOPT_REFERER, site_url());
    curl_setopt( $ch, CURLOPT_IPRESOLVE, CURL_IPRESOLVE_V4);
    
    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 252 Times
  • 7. What can I do if I can't use edit modal?
     

    If you get grey screen when you try to edit or add new data in wpdatatables(like on image) you have some conflict with theme or some other plugin.

    edit modal grey

    Try to add this code in the custom CSS field in wpdatatables settings page

    .wpdt-c .modal-backdrop{ z-index: 0 !important; }
    

    or

    .modal-backdrop{ z-index: 0 !important; }
    
    Permalink
    Was this answer helpful ?

    Yes(1) No(1)
    Viewed 233 Times
  • 8. What can I do if get error "Please provide a valid 2-dimensional array"?
     

    You are probably getting this error because you have formatting in that spreadsheet. Can you please remove that formatting from a file, because when you make wpDataTables you can adjust the look of the table and arranged data how you want. Please note that merge cells can also produce this issue because at the moment they are not supported in wpDataTables.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 199 Times
  • 9. I'm trying to create a table with Google spreadsheet but I get the error message "Table in data source has no rows."?
     

    Google recently changed something about their Sheets service which is causing many people to run into an error when they are using it for making tables in wpDataTables plugin.

    We encounter this issue recently and it looks like that the URL link that you get when you publish the document is not valid. (contain 2PACX in URL)

    So can you please use the URL link that you get from the browser and see if the issue is gone.

    You can find more details in our documentation about Creating Tables in WordPress from Google Spreadsheets

    Permalink
    Was this answer helpful ?

    Yes(1) No(1)
    Viewed 223 Times
  • 10. What can I do if my table is not show properly when I use Limit table width in Internet Explorer?
     

    Because Internet Explorer didn't stick to the guidelines established by World Wide Web Consortium the organization that establishes standards for web technologies, it often would display web pages in ways that made them look entirely different from other browsers Opera, Chrome or Firefox.

    Please try to find this file ../wp-content/plugins/wpdatatables/source/class.wpdatatable.php and around line 2045 find this line:

    $returnData .= $this->isFixedLayout() ? "table.wpDataTable { table-layout: fixed !important; }\n" : '';
    

    after that line add this line of code:

    $returnData .= $this->isFixedLayout() ? "table.wpDataTable thead th { width: 100% !important;}\n" : '';
    
    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 207 Times
  • 11. What are system requirements for wpdatatables?
     

    You can find minimum requirements in our documentation on this link.

    Permalink
    Was this answer helpful ?

    Yes(0) No(1)
    Viewed 211 Times
  • 12. What to do if I get error 413 Request Entity Too Large?
     

    413 Request Entity Too Large errors occur when the request body is larger than the server is configured to allow. Here’s how you can fix it, depending on your web server:

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 204 Times
  • 13. I am using Cherry plugin and tables are not working properly. What can I do?
     

    Cherry plugin cause this issue because it is using jquery version 1.7.2. Our plugin is based on the WordPress built-in version of jquery which is 1.12. You can deactivate jQuery that is included with Cherry framework and request a compatible version for WordPress from the Google CDN. Here are the instructions:

    You have to make folder called site-specific-plugin-adjust-cherry-jquery and in it make file site-specific-plugin-adjust-cherry-jquery.php with content:

    <?php
    /*
    Plugin Name: Update jQuery Cherry framework
    Description: Deactivate jQuery that is included with Cherry framework and request a compatible version for WordPress from the Google CDN
    */
    /* Begin Adding Functions Below This Line */
    
    // Remove themes old version of jQuery and load a compatible version add_action('wp_enqueue_scripts', 'update_jquery_for_cherry_framework', 11);
    function update_jquery_for_cherry_framework() {
        wp_deregister_script('jquery');
        wp_register_script('jquery', '/wp-includes/js/jquery/jquery.js', false, false, true);
        wp_enqueue_script('jquery');
    }
    /* Stop Adding Functions */

    - Upload to wp-content/plugins using your preferred SFTP or FTP client. FileZilla and Cyberduck are free options that are available for multiple platforms.
    - Go to WP-admin (your WP dashboard) --> Plugins. Then locate the plugin in the list and click on Activate.

    Note: this will not install through WP-admin --> Plugins. It must be manually installed as described above.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 208 Times
  • 14. When I push "+New" to fill new values into the table, the popup disappears?
     

    You have some conflict with theme or other plugin. Please insert this in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpdatatables.

    .wpdt-c .modal{ width: inherit !important ; background-color: initial !important; }
    
    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 172 Times
  • 15. How to transfer plugin with all tables from localhost or stage site to production?
     

    When you are moving on live site from local or stage site we can suggest to use Plugin Duplicator. We use it and it's working fine, because he will transfer all the files and also the tables to database.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 216 Times
  • 16. How to allow logged out users to upload attachments?
     

    By default WordPress does not allow this. Reason is: logged out user has no ID (id is 0), and no permissions/capabilities enabled for him.

    A solution would be to create an actual user that will be used as a single user for all logged-out users, and copy his ID (e.g. id = 100).

    Then you can add a simple hook to identify logged out users as User with ID 100. To do this you can use a hook like this:

        function set_loggedout_id( $user_id ){
           if( empty( $user_id ) ){
              $user_id = 100;
           }
           return $user_id;
        }
                
        add_filter( 'determine_current_user', 'set_loggedout_id', 999, 1 );
    

    Basically, it "tells" WordPress to replace the empty ID of a logged out user with a value of 100.
    Then you can allow uploading for this user.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 91 Times
  • 17. How to allow my front-end users to upload attachments in front-end uploader?
     

    By default, WordPress Media Library (used for attachments) allows file uploads only for users who have the upload_files capability. So, everyone who doesn't have this capability (e.g. a subscriber) will receive an error on trying to upload a file.

    To add this capability to subscribers you can e.g. use the User Role Editor plugin. Just enable the upload_files capability for the users which need it and it will work.

    Other option is to add this capability dynamically via a hook. To do this you can add e.g. this code to your theme's functions.php:

                function give_permissions( $allcaps, $cap, $args ) {
                    $allcaps['upload_files'] = true;
                    return $allcaps;
                }
                add_filter( 'user_has_cap', 'give_permissions', 0, 3 );     
    

    Basically, it enables the upload_files capability to everyone - but you can extend this logic to allow it only for certain users at certain moments.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 144 Times
  • 18. I added a table on page but see no style, sorting, filtering or pagination
     
    • Please check is there are no JS errors in the javascript console. Please check e.g. in Chrome JS console. Usually when we investigate such things we find out that some other plugin or theme are broken, and wpDataTables JS cannot execute.
    • Try to turn off option Include bootstrap on front-end in main settings of plugin.
    • Please try switching the theme to a different one and see if it helps.
    • Feel free to open a support ticket, providing us with the URL of the page so we could tell why does it happen.
    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 48 Times
  • 1. How can I hide columns in the table?
     

    First option would be to click on “Column settings” buttons which you can find in header of every column in “Table preview and columns setup” section.
    After that Column settings modal will open and, under “Display” tab, you can find “Visible on front-end” option.

    Second option would be to click on “Complete column list” button wpDataTables complete column list to open a modal where you can quickly access some column settings.
    In the modal you can click on show/hide icon to toggle visibility for each column.

    It is recommended that if you don’t need certain columns to remove it from data source or select query for mysql tables if possible.
    It will speed up loading of the page and result in more clear look of column setup section.

    Permalink
    Was this answer helpful ?

    Yes(1) No(3)
    Viewed 257 Times
  • 2. I can't find option Group column in column settings?
     

    We guess you created tables with server-side processing where this option is disabled. The reason for this is that when it is turn on with server-side processing, row grouping works, but other features of the plugin can have unexpected behavior.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 276 Times
  • 3. How to disable opening links in a popup and make it like button?
     

    In wpDataTables 2.1 and higher, additional settings for URL link columns are available:

    1. You can configure how the link should be opened - in the new tab or in the same tab.
    2. This option allows you to display the link as a button.
    3. You can set the button display text.
    4. You can set the button CSS class.

    URLlinkcolumn

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 274 Times
  • 4. How to add text before/after column values without affecting sorting?
     

    In wpDataTables column settings for every column there are text fields “Cell content prefix” and “cell content suffix”.
    Values from those text fields will be used for adding text before or/and after every cell content in a column.
    This feature uses CSS for displaying entered text, therefore sorting of the columns will not be affected.

    Permalink
    Was this answer helpful ?

    Yes(0) No(2)
    Viewed 275 Times
  • 1. What is yours License police?
     

    As we are using Envato as the marketplace for selling the product, their licensing policies apply: https://codecanyon.net/licenses/terms/regular

    Their policy in general is: one license is per one domain or project.

    If your multiple sites are sub-sites of the same domain, and apply to the same project, you can use one license.

    If these are installed on different domains, and are different projects, you would need a separate license per each.

    Permalink
    Was this answer helpful ?

    Yes(4) No(0)
    Viewed 298 Times
  • 2. What covers included support?
     

    Included support covers help with bugs and general inquiries for the plugin features, but not writing custom code.
    As you're developing some custom solution if you need our assistance we can offer you our paid customization service.

    Please note that standard item support (as defined by Envato's definition of support) does not include:

    - Customization services;
    - Installation services;
    - Writing MySQL queries;
    - Writing advanced CSS;
    - Resolving and debugging third-party software and hardware issues;
    - Preparing files and tables;
    - Skype, Teamviewer calls, Remote sessions or etc.
    Support with such requests can be provided on a paid basis.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 251 Times
  • 3. How customization flow looks like?
     

    Requirements and flow for the customization:
    - Customer request some custom work by providing detailed instructions about it and temporary WordPress admin credentials (if there is some example)
    - Our development team will estimate the price and time which depends on the complexity of the request and business logic of company is this will be implement in core of plugin
    - After the agreement, we are proceeding to the payment via PayPal
    - After received payment, customer provide us temporary WordPress admin credentials​ and we start working on that request

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 222 Times
  • 4. Where Is My Purchase Code?
     

    You can take a look at this link where you can see how you can find your purchase code.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 44 Times
  • 1. How to change color on pie chart(highcharts)?
     

    There is no built in option, but you can use wpdatachart callbacks. Every chart exposes several options that customize its look and feel. Charts usually support custom options appropriate to that visualization. You can use it for adding options that are available in Highcharts API. In this callback in method wpDataChartsCallbacks 15 is id of the chart which you want to change colors.We used hex color codes with some random colors, but you can change it for your needs. There are six of them(if you have six series) if you had it more then you have to add more colors in colors array, separated with comma(except last one). On the end insert this script above shortcode of your chart on page.

    <script type="text/javascript">
    jQuery(window).load(function(){
        if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
        wpDataChartsCallbacks[15] = function(obj){
            obj.options.plotOptions.pie = {
                colors: [
                        '#50B432',
                        '#ED561B',
                        '#DDDF00',
                        '#24CBE5',
                        '#64E572',
                        '#FF9655'
                ]
            }
        }
    });
    </script>
    

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 238 Times
  • 2. How to remove dataLabels and add legend on pie chart (highcharts)?
     

    There is no built-in option, but you can use wpdatachart callbacks. Every chart exposes several options that customize its look and feel. Charts usually support custom options appropriate to that visualization. You can use it for adding options that are available in Highcharts API. In this callback in method wpDataChartsCallbacks 19 is the ID of the chart which you want to change. Insert this script above shortcode of your chart on the page.

    <script type="text/javascript">
    jQuery(window).load(function(){
        if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
        wpDataChartsCallbacks[16] = function(obj){
            obj.options.plotOptions = {
                series: {
                         dataLabels: {
                            enabled: false
                         }
                },
                pie: {
                      allowPointSelect: true,
                      cursor: 'pointer',
                      dataLabels: {
                           enabled: false
                      },
                      showInLegend: true
                }
            };
        };
    });
    </script>
    

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 200 Times
  • 3. How to change color on pie chart (google chart)?
     

    There is no built-in option, but you can use wpdatachart callbacks. Every chart exposes several options that customize its look and feel. Charts usually support custom options appropriate to that visualization. You can use it for adding options that are available in Google Api. In this callback in method wpDataChartsCallbacks 83 is the ID of the chart which you want to change colors. We used hex color codes with some random colors, but you can change it for your needs. There are six of them (if you have six series), if you had it more then you have to add more colors in colors array, separated by a comma (except last one). On the end insert this script above shortcode of your chart on the page.

    <script type="text/javascript">
    jQuery(window).load(function(){
        if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
        wpDataChartsCallbacks[83] = function(obj){
            obj.options.colors = [
                         '#50B432',
                         '#ED561B',
                         '#DDDF00',
                         '#24CBE5',
                         '#64E572',
                         '#FF9655'
            ]
        }
    });
    </script>

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 247 Times
  • 4. How to change color on pie chart(chart.js)?
     

    There is no built-in option, but you can use wpdatachart callbacks. Every chart exposes several options that customize its look and feel. Charts usually support custom options appropriate to that visualization. You can use it for adding options that are available in Chart.js API. In this callback in method wpDataChartsCallbacks 82 is the ID of the chart for which you want to change colors. We used hex color codes with some random colors, but you can change it for your needs. There are six of them (if you have six series), if you had it more then you have to add more colors in colors array, separated by a comma (except last one). On the end insert this script above shortcode of your chart on the page.

    <script type="text/javascript">
    jQuery(window).load(function(){
        if( typeof wpDataChartsCallbacks == 'undefined' ){ wpDataChartsCallbacks = {}; }
        wpDataChartsCallbacks[82] = function(obj){
            obj.options.data.datasets[0].backgroundColor = [
                                                            '#50B432',
                                                            '#ED561B',
                                                            '#DDDF00',
                                                            '#24CBE5',
                                                            '#64E572',
                                                            '#FF9655'
            ]
        }
    });
    </script>

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 219 Times
  • 1. Can I try wpdatatables before purchase?
     

    We created a Sandbox site so that you could try our WordPress table plugin before you buy it. It has a number of pre-defined WordPress tables illustrating the plugin features, and you're free to create a table in WordPress and see how the plugin works.

    Also is available free wpDataTables Lite version of the plugin. While some of the premium features are reduced, wpDataTables Lite is still quite a handy tool which would allow you to quickly create tables in WordPress from different sources: Excel, CSV, JSON, XML and Serialized PHP array.

    Permalink
    Was this answer helpful ?

    Yes(1) No(1)
    Viewed 246 Times
  • 1. How to use URL parameters for filtering?
     

    Tables can be filtered with a query string that consists of “wdtColumnFilter[KEY]” value pairs where KEY is a zero-based numerical index of the column you would like to filter or initial column header. For example:

    ?wdt_column_filter[1]=Asia&wdt_column_filter[country]=Thailand

    Values passed from URL will be used as default filter values, therefore “Advanced filtering” option needs to be enabled on table edit page.

    If you need to pre-filter the table via global search just open the page adding a key to the URL:

    ?wdt_search=filtervalue

    Where ‘filtervalue’ is the value you would like to insert into the filtering field. This would pre-filter the table via global search.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 347 Times
  • 2. How to filter table by invisible columns?
     

    If you like to have invisible columns in filters, that can be achieved by enabling “Filter in form” option in table edit page.
    “Filter in form” option will create filters as a separate section from the table and additionally show filters for all hidden columns.
    You can choose which column filter will be visible/hidden by unchecking/checking the "Add a filter for this column" button in the column settings for the desired column.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 296 Times
  • 3. Can I change position of column filters?
     

    In order to show column filters in a table, you have “Render advanced filter” option where you can choose options “In the header” and “In the footer” on the wpDataTables Settings page.

    If you need to show column filters outside of the table you can do that with option Filter in form. To use it you need to go to the “Sorting and Filtering” tab in the table settings, first enable “Advanced column filters”, and then enable the “Filter in form”.

    "Advanced filter in a widget" (in WordPress sidebar) is one more way with which you can use column filters outside of the table. This way you can define the region of the page where to render the filtering form. More about this and about Advanced filters you can find on this link.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 267 Times
  • 4. How to show/hide table column filters?
     

    For showing and hiding column filters is responsible “Advanced column filters” option on the table settings page.
    You can also hide each column filter in column settings by unchecking the “Add a filter for this column” button in Filtering tab for desired column.
    By checking or unchecking this settings check box and saving, table will show or hide column filters.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 119 Times
  • 1. Is it possible to adjust the pdf export settings so the table can be in landscape rather than portrait orientation?
     

    Yes you can do that by changing some code in file ../wp-content/plugins/wpdatatables/source/class.wpdatatable.php and around line 2800 you can find

    'orientation' => 'portrait',
    

    and replace it with

    'orientation' => 'landscape',
    
    Permalink
    Was this answer helpful ?

    Yes(0) No(1)
    Viewed 256 Times
  • 2. How to change position of wpdatatables blocks (info, search, paginate and rows per page)?
     

    When customizing wpDataTables for your own usage, you might find that the default position of those elements is not quite to your liking. You have to modify some code in the core of plugin.

    Example to move info block above the table is to edit the plugin file. In file ../wp-content/plugins/wpdatatables/source/class.wpdatatable.php around line 2690 find:

    $obj->dataTableParams->sDom = "BT<'clear'>{$showRowsPerPage}{$globalSearch}{$scrollable}{$infoBlock}p";

    and replace it with:

    $obj->dataTableParams->sDom = "B{$infoBlock}T<'clear'>{$showRowsPerPage}{$globalSearch}{$scrollable}p";
    

    If you want info block at the top and bottom of the grid, replace it with:

    $obj->dataTableParams->sDom = "B{$infoBlock}T<'clear'>{$showRowsPerPage}{$globalSearch}{$scrollable}{$infoBlock}p";

    each letter stands for the different block. Our plugin is based on Datatables jQuery plugin and more details about DOM positioning you can check on this link.

    Note: If you made this changes it will be overwritten on the next update so you have to change it again.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 261 Times
  • 1. Can I make editable tables from Gravity forms with your Gravity integration add on?
     

    Yes you can. From Version 1.1, which is released 13.07.2018, Gravity integration for wpDataTables has:

          1.)    Server-side processing for large tables – if a gravity form has more than 3000-5000 entries, this feature allows to add lazy loading to the table.

          2.)   Front-end editing for Gravity Forms-based tables – using this feature you can edit the Gravity forms entries directly from wpDataTables (a standard Gravity editor will appear in a popup).

    Note: Please use with wpDataTables 2.2.3+ only!

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 261 Times
  • 1. How to make my table responsive on desktop?
     

    Firstly “responsive” feature needs to be enabled for the table.
    This can be done in wpDataTables table edit page by ticking the “Responsiveness” checkbox on “Display” tab in table settings and saving changes.

    The second step involves going to the wpDataTables Settings page and setting “Tablet width” option to a large value (e.g. 2000) and saving options.

    Permalink
    Was this answer helpful ?

    Yes(1) No(1)
    Viewed 299 Times
  • 2. Can I use custom Editor roles in wpdatatables?
     

    Yes you can. From version 2.1, if you use some custom roles from other plugins (like it is S2Member, User Role Editor or any other), those roles will be available in the "Editor roles" option under the EDITING tab in the table settings.

    Permalink
    Was this answer helpful ?

    Yes(1) No(1)
    Viewed 185 Times
  • 3. I don’t see the upload media library for attachment column!
     

    Please check if you maybe have some inline JS minifier tool enabled, e.g. W3TotalCache – inline minification of JS breaks the front-end uploader template logic.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 239 Times
  • 4. How to change display date and time format for date and time column?
     

    Display date format of a date column can be changed in wpDataTables Settings page from “Date format” drop-down menu.

    Display time format of a time column can be changed in wpDataTables Settings page from “Time format” drop-down menu.

    Permalink
    Was this answer helpful ?

    Yes(0) No(0)
    Viewed 287 Times
  • 5. How to change thousand and decimal separators for number columns?
     

    This can be changed from “Number format” drop-down menu in the wpDataTables Settings page.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 243 Times
  • 6. How to use Conditional formatting on hidden columns?
     

    Unfortunately when you use option hide on frontend, that column will not be available in DOM of html and that is reason why conditional formatting is not working on hidden columns. What you can do is to turn on this option and then add this code in Custom wpDataTables CSS under the "Custom JS AND CSS" in main settings of wpdatatables.

    table.wpDataTable thead tr th.column-newcolumn, table.wpDataTable tbody tr td.column-newcolumn{
    display:none !important;
    }

    This will be affected on all tables, but if you want just for specific one then insert this code on page where is that table between the style tag.(<style>Code here</style>)

    <style>
    table.wpDataTable thead tr th.column-newcolumn, table.wpDataTable tbody tr td.column-newcolumn{
    display:none !important;
    }
    </style>

    where class column-newcolumn is generated class depends of name of your column name. You can check from Inspect element of the browser how this class is looks like for that column that you need to hide and replace it with this one. Like this column will be available in DOM of html, but will be hidden for users and conditional formatting will work.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 193 Times
  • 7. How can I see all data from users if in table settings is turn on option User can see and edit own data?
     

    Yes you can, but you have to make one more table. From first table where you turn on option User can see and edit own data you can use table name from option MySQL table name for editing which you can find on Editing tab in table settings.

    Then make another table from MySQL query like this:

    SELECT * FROM table_name_for_editing

    Instead of table_name_for_editing you will use table name from option MySQL table name for editing. Like this will be shown all data from all users.

    Permalink
    Was this answer helpful ?

    Yes(2) No(0)
    Viewed 240 Times
  • 8. Can I use shortcodes in table cells?
     

    Yes, you can. You just need to turn on the option "Parse shortcodes" in main Settings of the plugin.

    Permalink
    Was this answer helpful ?

    Yes(1) No(0)
    Viewed 282 Times

Still no luck? We can help!

 

 

Contact us and we’ll get back to you as soon as possible.

Do you have the best

essential plugins installed?
Grab the best 46 plugins. Tested and sorted.

Plugins for SEO, Caching, Security, Design and UX, Stats & analytics, Social sharing. Only the best ones.

By clicking "subscribe" you consent that the information you provide via this form will be securely processed and stored in compliance with EU privacy laws (GDPR).

Thank you for subscribing!

Please check your inbox to download the WordPress goodies.