How to add custom fields to categories

How to add custom fields to categories

This article is a tutorial of how to add custom fields to taxonomies, and in particular categories. (categories are taxonomies too). You can do this in 3 steps.

First, add the fields into the add and edit forms:

function wcr_category_fields($term) {
    // we check the name of the action because we need to have different output
    // if you have other taxonomy name, replace category with the name of your taxonomy. ex: book_add_form_fields, book_edit_form_fields
    if (current_filter() == 'category_edit_form_fields') {
        $short_description = get_term_meta($term->term_id, 'short_description', true);
        $color_code = get_term_meta($term->term_id, 'color_code', true);
        ?>
        <tr class="form-field">
            <th valign="top" scope="row"><label for="term_fields[short_description]"><?php _e('Short description'); ?></label></th>
            <td>
                <textarea class="large-text" cols="50" rows="5" id="term_fields[short_description]" name="term_fields[short_description]"><?php echo esc_textarea($short_description); ?></textarea><br/>
                <span class="description"><?php _e('Please enter short description'); ?></span>
            </td>
        </tr>
        <tr class="form-field">
            <th valign="top" scope="row"><label for="term_fields[color_code]"><?php _e('Color code'); ?></label></th>
            <td>
                <input type="text" size="40" value="<?php echo esc_attr($color_code); ?>" id="term_fields[color_code]" name="term_fields[color_code]"><br/>
                <span class="description"><?php _e('Please enter color hex code'); ?></span>
            </td>
        </tr>   
	<?php } elseif (current_filter() == 'category_add_form_fields') {
        ?>
        <div class="form-field">
            <label for="term_fields[short_description]"><?php _e('Short description'); ?></label>
            <textarea cols="40" rows="5" id="term_fields[short_description]" name="term_fields[short_description]"></textarea>
            <p class="description"><?php _e('Please enter short description'); ?></p>
        </div>
        <div class="form-field">
            <label for="term_fields[color_code]"><?php _e('Color code'); ?></label>
            <input type="text" size="40" value="" id="term_fields[color_code]" name="term_fields[color_code]">
            <p class="description"><?php _e('Please enter color hex code'); ?></p>
        </div>  
    <?php
    }
}

// Add the fields, using our callback function  
// if you have other taxonomy name, replace category with the name of your taxonomy. ex: book_add_form_fields, book_edit_form_fields
add_action('category_add_form_fields', 'wcr_category_fields', 10, 2);
add_action('category_edit_form_fields', 'wcr_category_fields', 10, 2);

Second, save the fields values into options:

function wcr_save_category_fields($term_id) {
    if (!isset($_POST['term_fields'])) {
        return;
    }

    foreach ($_POST['term_fields'] as $key => $value) {
        update_term_meta($term_id, $key, sanitize_text_field($value));
    }
}

// Save the fields values, using our callback function
// if you have other taxonomy name, replace category with the name of your taxonomy. ex: edited_book, create_book
add_action('edited_category', 'wcr_save_category_fields', 10, 2);
add_action('create_category', 'wcr_save_category_fields', 10, 2);

Third, get the saved info by using get_term_meta built-in function:

// $term_id = 4, $key = 'short_description'
echo get_term_meta(4, 'short_description', true);

// $term_id = 4, $key = 'color_code'
echo get_term_meta(4, 'color_code', true);
  • Ralf Römling.

    Hi Overthere,
    exactly what I need :-)
    But I can’t seem to get it to work :-(
    Maybe you can have a look?

    What I did:
    – added the functions to functions.php
    – deleted the ShortDescription parts
    – replaced variable “color_code” with “category_subline”

    which leads to CustomField showin’ in the Category section.

    – Then placed the get_term_meta part in my archive.php below the “title” but it’s not rendered.

    Any idea what I’m missing? (I assume I’m implementing the method in a wrong manner…)

    In case you need functions.php and archive.php please let me know.

    And sorry, if this is a dumb question but I’m a relativly php noob.

    Thx a lot in advance,
    Ralf

  • Maike

    Hi, thank you for the incredible article!
    I tried to use this, but, the category don’t be displayed in the front-end.
    Can u help?

  • Maike

    Hello!
    could you help me to show in the front end?

Leave a Reply

Get our Wordpress
freebies to your inbox