Function/Class to list categories with checkboxes

Question

I want a list like in the pictue; witch is here - Posts->New->Select Categories

At the moment i have this

echo '<select name="pn-cats[]" size="8" style="width: 100%" multiple>';
$args = array(
    'type'                     => 'post',
'child_of'                 => 0,
'parent'                   => '',
'orderby'                  => 'name',
'order'                    => 'ASC',
'hide_empty'               => 0,
'hierarchical'             => 1,
'exclude'                  => '',
'include'                  => '',
'number'                   => '',
'taxonomy'                 => 'category',
'pad_counts'               => false 
); 
$categories = get_categories( $args ); 
foreach ($categories as $category) {
    $option = '<option value="'.$category->cat_name.'">';
    $option .= $category->cat_name;
    $option .= ' ('.$category->count.')';
    $option .= '</option>';
    echo $option;
}
echo '</select>';

But i dont like my solution because the categories are not sorted like parent->child in the picture. I need a multi-selectable list.

Do you know any solution? wp_category_checklist don´t work because i need this list in a public page and not in the admin area.

Answer 1

You can make wp_category_checklist() available in any of your templates using:

require_once( ABSPATH . '/wp-admin/includes/template.php' );
wp_category_checklist();

If you would like to have a shortcode for it, that parses the available arguments, here's an example:

    add_shortcode('frontend-category-checklist', 'frontend_category_checklist');
function frontend_category_checklist($atts) {

    // process passed arguments or assign WP defaults
    $atts = shortcode_atts( array(
        'post_id' => 0,
        'descendants_and_self' => 0,
        'selected_cats' => false,
        'popular_cats' => false,
        'checked_ontop' => true
    ), $atts, 'frontend-category-checklist'
    );

    // string to bool conversion, so the bool params work as expected
    $atts['selected_cats'] = to_bool( $atts['selected_cats'] );
    $atts['popular_cats'] = to_bool( $atts['popular_cats'] );
    $atts['checked_ontop'] = to_bool( $atts['checked_ontop'] );

    // load template.php from admin, where wp_category_checklist() is defined
    require_once( ABSPATH . '/wp-admin/includes/template.php' );

    // generate the checklist
    ob_start(); ?>
    <div class="categorydiv">
        <ul class="category-tabs">
            <div id="taxonomy-category" class="categorydiv">
                <div id="category-all" class="tabs-panel">
                    <ul id="categorychecklist" data-wp-lists="list:category" class="categorychecklist form-no-clear">
                        <?php wp_category_checklist(
                            $atts['post_id'],
                            $atts['descendants_and_self'],
                            $atts['selected_cats'],
                            $atts['popular_cats'],
                            null,
                            $atts['checked_ontop']
                        );  ?>
                    </ul>
                </div>
             </div>
        </ul>
    </div>

    <?php
    return ob_get_clean();
}
function to_bool($bool) {
    return ( is_bool($bool) ? $bool :
        ( is_numeric($bool) ? ((bool)intval($bool)) : $bool !== 'false' ) );
}

Now you can use [frontend-category-checklist] in any page or post. All arguments work, except for $walker.

Updated answer: I've made a fiddle with the bulk CSS that you need in order to make it look like the list in dashboard. The checkboxes don't work right in fiddle, but they work on a WordPress frontend (4.1). You are free to clean up the CSS of rules you don't actually need, I didn't have time for that.

NOTE that I have also updated the function in the answer to also generate some more html around the list. You should probably replace the old code with the new one.