Custom Fields in WordPress refers to any input field—it can be of the type: text, textarea, dropdown, checkbox, checkboxes, gallery, date, time, etc.— that can hold some custom data related to post, page, category, or any other type of content. The data that goes into these custom fields can be fetched with utility functions provided by WordPress.
Clients always love to have a separate place to enter their custom data. By creating custom fields for them, you empower your clients to control their content without messing up its presentation.
Three ways to create Custom Fields
Through WordPress Inbuilt Custom Fields
These are available only for post types (if supported) and not for any other content type. For categories, tags, taxonomies, profile, customizer, you have to create custom fields by next two methods.
How to make inbuilt custom fields visible: follow steps as shown below:
Where they show up: see below:
Pros and Cons of Inbuilt Custom Fields
Pros:
- Available by default. Nothing extra need to be installed or done to create them.
Cons:
- The inbuilt custom fields are pretty basic and limited. You can only save simple text data in them.
- They make interface look messy.
- You have to create these custom fields for each entity (post, page, etc.)
Creating fields through Custom Coding
This is the most tedious way to create custom fields. If you are a programmer and you love to build custom solution for your clients, only then choose this route, otherwise prefer using some plugin. It is a lengthy process and it requires you to have understanding of PHP, WordPress, HTML, and CSS. Let’s see how to create custom fields for post_type = ‘post’.
WordPress has a concept of MetaBoxes. A MetaBox is a container that can hold any content, and we want it to hold our custom fields.
To create a MetaBox for post_type = ‘post’, see code below:
<?php
/**
* ===============================
* Register meta box(es).
* ===============================
*/
add_action( 'add_meta_boxes', 'your_prefix_register_meta_boxes' );
function your_prefix_register_meta_boxes () {
add_meta_box(
'meta-box-id',
__( 'Meta Box Label', 'textdomain' ),
'your_prefix_display_fields',
'post'
);
}
Use following code to render fields into this MetaBox:
<?php
/**
* ===========================================
* Meta box display callback.
*
* @param WP_Post $post — Current post object.
* ===========================================
*/
function your_prefix_display_fields( $post ) {
// Add an nonce field so we can check for it later.
wp_nonce_field( 'your_prefix_custom_box', 'your_prefix_custom_box_nonce' );
// Use get_post_meta to retrieve an existing value from the database.
$value = get_post_meta( $post->ID, 'your_prefix_first_custom_field', true );
// Display the form, using the current value.
?>
<label for="your_prefix_first_custom_field">
<?php _e( 'Your First Custom Field', 'textdomain' ); ?>
</label>
<input type="text" id="your_prefix_first_custom_field" name="your_prefix_first_custom_field" value="<?php echo esc_attr( $value ); ?>" />
<?php
}
To save fields, use below code:
<?php
/**
* ===========================================
* Save meta box content.
*
* @param int $post_id Post ID
* ===========================================
*/
add_action( 'save_post', 'your_prefix_save_meta_box' );
function your_prefix_save_meta_box( $post_id ) {
/*
* We need to verify this came from the our screen and with proper authorization,
* because save_post can be triggered at other times.
*/
// Check if our nonce is set.
if ( ! isset( $_POST['your_prefix_custom_box_nonce'] ) ) {
return $post_id;
}
$nonce = $_POST['your_prefix_custom_box_nonce'];
// Verify that the nonce is valid.
if ( ! wp_verify_nonce( $nonce, 'your_prefix_custom_box' ) ) {
return $post_id;
}
/*
* If this is an autosave, our form has not been submitted,
* so we don't want to do anything.
*/
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
return $post_id;
}
// Check the user's permissions.
if ( 'page' == $_POST['post_type'] ) {
if ( ! current_user_can( 'edit_page', $post_id ) ) {
return $post_id;
}
} else {
if ( ! current_user_can( 'edit_post', $post_id ) ) {
return $post_id;
}
}
/* OK, it's safe for us to save the data now. */
// Sanitize the user input.
$your_first_field_value = sanitize_text_field( $_POST['your_prefix_first_custom_field'] );
// Update the meta field.
update_post_meta( $post_id, 'your_prefix_first_custom_field', $your_first_field_value );
}
To get the field value in your template, use following code:
<?php
$value = get_post_meta( get_the_ID(), 'your_prefix_first_custom_field', true );
// When you echo the value, use proper escaping, for eg.:
?>
<h3><?php echo esc_html($value); ?></h3>
<?php
Pros and Cons of creating Custom Fields by Custom Coding
Pros:
- Extreme Flexibility.
- You learn in inner working of how custom fields works under the hood.
Cons:
- A long and tedious process.
- You have to handle security issues that itself is challanging.
- Code you write should not conflict with others. You have to use your custom prefixes everywhere.
Creating fields through Plugins
This is the most recomended way to create custom fields in your various WordPress admin screens. They let you build custom fields with tiny effort when compared to custom coding. There are lots of free WordPress plugins available in market that will solve most of your problems.
Each plugin comes with its own way of creating and managing custom fields. Most of Custom Field plugins has their Free and Pro versions.
Below are some of the Custom Fields Plugins:
- Effortless Custom Fields: This plugin is developed by our team, and we have done everything to remove all limitations that we experienced with other WordPress plugins available in the market. It has 32 free field types. Only one field—Repeater—is in PRO. The other things in PRO are layout fields: Accordion and Tabs. Effortlessness as promised is delivered.
- Advanced Custom Fields: This is the most popular plugin in WordPress. It has around 34 field-types, 4 of which are available in PRO version. If you need to use Gallery field, you need to use their PRO version.
- MetaBox: It lets you customize custom fields with much flexibility. Their free version don’t allow you to create fields in WordPress admin. You have to use their online fields code generator. Then copy the code to your theme—a messy process. You can create unlimited custom meta boxes and fields with it.
- Pods: It lets you create not just Custom Fields, but also Custom Content Types. It has a lot but is complex.
- Bonzer Custom Fields: This is also a good plugin. It lets you create many types of custom fields quickly and assign at many locations. It’s great if you don’t need huge number of fields. It become messy when number of fields goes beyond certain limits. On positive side: It’s quick, light, and does the job. It offers 15 field types and has no PRO version.
Share this Post