Home » Php » php – Can I use the WP_List_Table class to render tables on a page?

php – Can I use the WP_List_Table class to render tables on a page?

Posted by: admin February 25, 2020 Leave a comment

Questions:

I am currently using shortcodes to display a list of items obtained from a table and displaying it on a page of my website but since the list of information is very large, I want to add a page and in the future a small filtering menu for the records.

I found the WP_List_Table class in the worpdress documentation which, from what I understood, is a class that allows you to create tables with a list of elements but I have also read in some tutorials like this or this one in which they indicate that this class is used to create a list of elements but for the wordpress admin.

Can I use this class normally in the function my shortcode will render? Or is there any other class that is more appropriate, taking into account the functionalities that I wish to add in the future?

The function and the shortcode that I use to render the information is this:

function opt_menu_cactaceas_frontend() {

    global $wpdb;
    $tabla_cactaceas = $wpdb->prefix . 'cactaceas2';
    $aspirantes = $wpdb->get_results("SELECT * FROM $tabla_cactaceas");

    //echo '<table class="wp-list-table widefat fixed striped">';
    echo '<table>';
    echo '<thead><tr><th width="70%">Nombre Cientifico</th><th width="30%">Imagen</th></tr></thead>';
    echo '<tbody id="the-list">';

    foreach ( $aspirantes as $aspirante ) {

        $genero = esc_textarea($aspirante->genero);
        $especie = esc_textarea($aspirante->especie);
        $subespecie = esc_textarea($aspirante->subespecie);
        $autor = esc_textarea($aspirante->autor);

        if ( $subespecie == '' ):

            $nombreCactacea = "<i>$genero $especie</i> $autor";
        else: 
            $nombreCactacea = "<i>$genero $especie</i> subsp. <i>$subespecie</i> $autor";

        endif;

        $imagen_cactus = wp_get_attachment_image( 263, 'thumbnail' );

        echo "<tr><td><a href='#' title='$motivacion'>$nombreCactacea</a></td><td>$imagen_cactus</td></tr>";
    }
    echo '</tbody></table>';
}

//funcion - agrega el shortcode en la pagina que se le llame
add_shortcode('srt_code_add_list_cactaceas', 'formulario_registro');

The table so far is rendered like this:

enter image description here

How to&Answers:

The WP_List_Table mainly used for WordPress backend. If you want to render the table and want to look as same as the backend, then make sure that you have included proper resources like the admin does (eg. list-tables).
Otherwise, you can use bootstrap data-table as well or you can try below plugin.

https://wordpress.org/plugins/custom-list-table-example/