Add Fields to Taxonomy Terms

https://rudrastyh.com/wordpress/add-custom-fields-to-taxonomy-terms.html

<?php  
add_action( 'post_tag_add_form_fields', 'misha_add_term_fields' );
function misha_add_term_fields( $taxonomy ) {
	echo '<div class="form-field">
	<label for="misha-text">Text Field</label>
	<input type="text" name="misha-text" id="misha-text" />
	<p>Field description may go here.</p>
	</div>';
}
add_action( 'post_tag_edit_form_fields', 'misha_edit_term_fields', 10, 2 );
function misha_edit_term_fields( $term, $taxonomy ) {
	$value = get_term_meta( $term->term_id, 'misha-text', true );
	echo '<tr class="form-field">
	<th>
		<label for="misha-text">Text Field</label>
	</th>
	<td>
		<input name="misha-text" id="misha-text" type="text" value="' . esc_attr( $value ) .'" />
		<p class="description">Field description may go here.</p>
	</td>
	</tr>';
}
add_action( 'created_post_tag', 'misha_save_term_fields' );
add_action( 'edited_post_tag', 'misha_save_term_fields' );
function misha_save_term_fields( $term_id ) {
	update_term_meta(
		$term_id,
		'misha-text',
		sanitize_text_field( $_POST[ 'misha-text' ] )
	);
}
add_filter( 'simple_register_taxonomy_settings', 'misha_fields' );
function misha_fields( $fields ) {
	$fields[] = array(
 		'id'	=> 'mishatest',
 		'taxonomy' => array( 'post_tag' ),
 		'fields' => array(
			array(
				'id' => 'misha-text',
				'label' => 'Text Field',
				'type' => 'text',
			),
 		)
 	);
	return $fields;
}
?>

Add Fields to Taxonomy Terms

Today WordPress has meta field support for nearly everything – post types, users, comments, blogs within a multisite network and yes, taxonomy terms.

Screenshots of what we are going to create:Simple text field on add new term screen in WordPress admin areaWe are going to create a simple text field and this is how it is going to look on add new term pages.We added a custom text field and populated it with the data on edit term screenThis is how our field is going to look on edit term pages.

1. Add Fields to the Add New Term Screen

To add the fields on the “Add new” screen we are going to use an action hook {Taxonomy}_add_form_fields and all we have to do is to echo the fields.

1
2
3
4
5
6
7
8
9
10
11
add_action( 'post_tag_add_form_fields', 'misha_add_term_fields' );
 
function misha_add_term_fields( $taxonomy ) {
 
	echo '<div class="form-field">
	<label for="misha-text">Text Field</label>
	<input type="text" name="misha-text" id="misha-text" />
	<p>Field description may go here.</p>
	</div>';
 
}
  • I decided to add a field to post_tag taxonomy, so my action hook is post_tag_add_form_fields. But you can use any custom taxonomy name here.

  • Taxonomy name as $taxonomy variable is available inside the function.

  • Do not forget to wrap the field inside a div with form-field class.

Result:Simple text field on add new term screen in WordPress admin areaWe can add fields to the Add New tag page with post_tag_add_form_fields action hook.

2. Add Fields to the Edit Term Screen

Very similar to the previous part of the tutorial, the main difference is that we have to populate the field in case the metadata is presented.

Let’s begin with an action hook {Taxonomy}_edit_form_fields. For post_tag taxonomy it is going to be post_tag_edit_form_fields, for your custom taxonomy it could be misha_taxonomy_edit_form_fields.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
add_action( 'post_tag_edit_form_fields', 'misha_edit_term_fields', 10, 2 );
 
function misha_edit_term_fields( $term, $taxonomy ) {
 
	$value = get_term_meta( $term->term_id, 'misha-text', true );
 
	echo '<tr class="form-field">
	<th>
		<label for="misha-text">Text Field</label>
	</th>
	<td>
		<input name="misha-text" id="misha-text" type="text" value="' . esc_attr( $value ) .'" />
		<p class="description">Field description may go here.</p>
	</td>
	</tr>';
 
}
  • Function has two parameters: $term – which is a currently edited term object, $taxonomy – taxonomy name.

  • We’re using get_term_meta() function here to get the term meta data.

  • Do not forget to escape the data you get from the database.

And we have it:We added a custom text field and populated it with the data on edit term screenWe can add fields to the Edit Tag page with post_tag_edit_form_fields action hook.

3. Save Fields

The last step is to save our fields values into the database. Guess what – we also have two action hooks for that – created_{Taxonomy} and edited_{Taxonomy}. Luckily we can connect the same callback function to both of them.

1
2
3
4
5
6
7
8
9
10
11
12
add_action( 'created_post_tag', 'misha_save_term_fields' );
add_action( 'edited_post_tag', 'misha_save_term_fields' );
 
function misha_save_term_fields( $term_id ) {
 
	update_term_meta(
		$term_id,
		'misha-text',
		sanitize_text_field( $_POST[ 'misha-text' ] )
	);
 
}

That’s it.

Not so difficult, but below I am going to show you even more simple way to create taxonomy term fields!

4. Simple Example

Sometimes it takes to long to create fields from scratch. So I decided to create a plugin which allows to simplify the process and to save a lot of time.

So, if you have my plugin installed on your website, just insert the below code to your current theme functions.php and a text field will appear on your add/edit term pages.

add_filter( 'simple_register_taxonomy_settings', 'misha_fields' );
 
function misha_fields( $fields ) {
 
	$fields[] = array(
 		'id'	=> 'mishatest',
 		'taxonomy' => array( 'post_tag' ),
 		'fields' => array(
			array(
				'id' => 'misha-text',
				'label' => 'Text Field',
				'type' => 'text',
			),
 		)
 	);
 
	return $fields;
 
}

Last updated

Was this helpful?