Add custom field to Category

I’d like to add custom fields to a certain category.
A category only has the following fields:

Name:

Read More

Slug:

Parent:

Description:

Since I have a TV Series Site, I want to add some more fields, I want something like this, when I create a new category (Category=Series)

Name:

Artist:

Year:

Type:

Genre:

Summary:

Slug:

Parent:

Description:

And so on…

Any help please?
Thanks in advance.

Related posts

Leave a Reply

4 comments

  1. I posted an How To about it a week ago http://en.bainternet.info/2011/wordpress-category-extra-fields

    hope this helps.

    Ohad.


    Here are the details of the post:

    The first thing we need to do is add the extra fields to the category edit form using the hook edit_category_form_fields and we use a simple function that will print out the extra fields.

    <?php
    //add extra fields to category edit form hook
    add_action ( 'edit_category_form_fields', 'extra_category_fields');
    
    //add extra fields to category edit form callback function
    function extra_category_fields( $tag ) {    //check for existing featured ID
        $t_id = $tag->term_id;
        $cat_meta = get_option( "category_$t_id");
    ?>
    <tr class="form-field">
    <th scope="row" valign="top"><label for="cat_Image_url"><?php _e('Category Image Url'); ?></label></th>
    <td>
    <input type="text" name="Cat_meta[img]" id="Cat_meta[img]" size="3" style="width:60%;" value="<?php echo $cat_meta['img'] ? $cat_meta['img'] : ''; ?>"><br />
            <span class="description"><?php _e('Image for category: use full url with '); ?></span>
        </td>
    </tr>
    <tr class="form-field">
    <th scope="row" valign="top"><label for="extra1"><?php _e('extra field'); ?></label></th>
    <td>
    <input type="text" name="Cat_meta[extra1]" id="Cat_meta[extra1]" size="25" style="width:60%;" value="<?php echo $cat_meta['extra1'] ? $cat_meta['extra1'] : ''; ?>"><br />
            <span class="description"><?php _e('extra field'); ?></span>
        </td>
    </tr>
    <tr class="form-field">
    <th scope="row" valign="top"><label for="extra2"><?php _e('extra field'); ?></label></th>
    <td>
    <input type="text" name="Cat_meta[extra2]" id="Cat_meta[extra2]" size="25" style="width:60%;" value="<?php echo $cat_meta['extra2'] ? $cat_meta['extra2'] : ''; ?>"><br />
            <span class="description"><?php _e('extra field'); ?></span>
        </td>
    </tr>
    <tr class="form-field">
    <th scope="row" valign="top"><label for="extra3"><?php _e('extra field'); ?></label></th>
    <td>
            <textarea name="Cat_meta[extra3]" id="Cat_meta[extra3]" style="width:60%;"><?php echo $cat_meta['extra3'] ? $cat_meta['extra3'] : ''; ?></textarea><br />
            <span class="description"><?php _e('extra field'); ?></span>
        </td>
    </tr>
    <?php
    }
    

    As you can see i added 4 new fields and all of them are in an array Cat_meta[key] because that way we only create on row in the options table to save all of the category’s extra fields instead of a row for each field.

    Next we need to save the extra fields in to the database once a user submits the category edit form and we do that using “edited_category” with a function that will run through each of the submitted fields and insert them to the database using the update_option function, like this:

    <?php
    // save extra category extra fields hook
    add_action ( 'edited_category', 'save_extra_category_fileds');
    
    // save extra category extra fields callback function
    function save_extra_category_fileds( $term_id ) {
        if ( isset( $_POST['Cat_meta'] ) ) {
            $t_id = $term_id;
            $cat_meta = get_option( "category_$t_id");
            $cat_keys = array_keys($_POST['Cat_meta']);
                foreach ($cat_keys as $key){
                if (isset($_POST['Cat_meta'][$key])){
                    $cat_meta[$key] = $_POST['Cat_meta'][$key];
                }
            }
            //save the option array
            update_option( "category_$t_id", $cat_meta );
        }
    }
    

    From the code above you can see that all of the extra fields we’ve added are stored in the database’s options table with the name ‘category_ID’ , where ID is the id of the specific category we just edited and that means we can call this data in our plugins or theme files easily using the get_option function.

    say for example my category id is 25 then my code will look like

    <?php $cat_data = get_option('category_25'); ?>
    

    As I stated in the beginning, I need to display a different image for each category, so in that case I added these few lines of code to my theme’s category.php right after the code that displays the category title:

    <?php
    //first get the current category ID
    $cat_id = get_query_var('cat');
    
    //then i get the data from the database
    $cat_data = get_option("category_$cat_id");
    
    //and then i just display my category image if it exists
    if (isset($cat_data['img'])){
        echo '<div class="category_image"><img src="'.$cat_data['img'].'"></div>';
    }
    

    Nice and easy and we are all done. The result should look similar to this:

    enter image description here

  2. As of WordPress 4.4, the add_term_meta(), the update_term_meta() and get_term_meta() functions have been added. This means that the code as provided by MxmastaMills can be updated to use a far less hacky approach.

    Here is my update of it. There is only one field as I wanted to add a custom title, but it’ll work the same for all the fields you want to add.

    function addTitleFieldToCat(){
        $cat_title = get_term_meta($_POST['tag_ID'], '_pagetitle', true);
        ?> 
        <tr class="form-field">
            <th scope="row" valign="top"><label for="cat_page_title"><?php _e('Category Page Title'); ?></label></th>
            <td>
            <input type="text" name="cat_title" id="cat_title" value="<?php echo $cat_title ?>"><br />
                <span class="description"><?php _e('Title for the Category '); ?></span>
            </td>
        </tr>
        <?php
    
    }
    add_action ( 'edit_category_form_fields', 'addTitleFieldToCat');
    
    function saveCategoryFields() {
        if ( isset( $_POST['cat_title'] ) ) {
            update_term_meta($_POST['tag_ID'], '_pagetitle', $_POST['cat_title']);
        }
    }
    add_action ( 'edited_category', 'saveCategoryFields');
    
  3. This code works:

    add_action ( 'category_edit_form_fields', function( $tag ){
        $cat_title = get_term_meta( $tag->term_id, '_pagetitle', true ); ?>
        <tr class='form-field'>
            <th scope='row'><label for='cat_page_title'><?php _e('Category Page Title'); ?></label></th>
            <td>
                <input type='text' name='cat_title' id='cat_title' value='<?php echo $cat_title ?>'>
                <p class='description'><?php _e('Title for the Category '); ?></p>
            </td>
        </tr> <?php
    });
    add_action ( 'edited_category', function( $term_id ) {
        if ( isset( $_POST['cat_title'] ) )
            update_term_meta( $term_id , '_pagetitle', $_POST['cat_title'] );
    });