When you read blog posts, you can see the author’s name, the topic or category the article belongs to, and the date of publication. However, bloggers may also decide to include other information. In this case, the post will contain more fields. When working with multiple posts, adding the same information over and over again can be extremely time-consuming. The task becomes especially difficult when working with such content-heavy websites as blogs. If you’re using WordPress, however, you can do it much faster by using custom fields.
A сustom field in WordPress enables you to modify the editor, adding a specific place for a certain type of information. This information can be displayed with every post and every page of your site. For example, you can use custom fields to add disclaimers to affiliate content or to include product ratings in reviews. In this article, we will consider custom fields in more detail. You will learn what custom fields are and how you can use them. On the one hand, using custom fields can be considered an advanced technique. On the other hand, it’s much simpler than it seems.
What Custom Fields Are?
Before we consider custom fields in more detail, let’s figure out what they are. When you create a new post in your WordPress blog, the platform stores your information in two ways. First, there is the content itself. Secondly, there is additional information, which is called metadata. Metadata contains various details about your post. It may include numbers, text, dates, etc. It consists of pairs of keys and values, where a key represents the name of a particular field, and its value contains the necessary information. The WordPress editor already includes some fields by default, but if you want to include more types of data, you need to create custom fields.
The custom fields feature is hidden by default. However, you can learn to create custom fields to include any additional information that you want. For instance, if you have an affiliate website where you publish various product reviews, you can add a field with a score to each of your posts so that each product will have its rating.
Custom fields are stored as metadata, but when you categorize your metadata, custom fields enable you to display it on the front end so that people who visit your website can see it.
Why You Need Custom Fields?
Custom fields are a very useful customization tool that enables you to improve the design of your WordPress website and to tailor it to your specific needs. Here are some of the main benefits of adding custom fields to your posts.
- Custom fields give you more control over placement and display. You can control the way your content is displayed by using conditional tags of your WordPress theme.
- Custom fields are also more flexible than widgets. When using widgets, you display the same content on all the pages of your website, while custom fields enable you to adjust the content for each particular page.
- Another great thing about custom fields is that you can also customize them. Simply put, custom fields are code that you add to your theme files. You can edit this code using CSS and change your custom fields as you like.
Now let’s figure out how to add custom field in WordPress, and how you can use custom fields for different purposes.
How to Use Custom Fields?
1. Adding Custom Fields
Start editing the page or post where you want to add a custom field. Open the Edit Post page and find the Custom Fields widget. First, you should specify the name of the new custom field. After this, you should enter the value. For instance, the name of your custom field can be “Location,” and the value can be “New York.” After this, click Add Custom Field.
This information will be stored in the custom fields meta box. If you need to edit this custom field, you can change the necessary information and click Update. You can also delete your custom fields anytime you need it.
2. Showing Custom Fields in WordPress Themes
Once you’ve created a new custom field, the information is saved as metadata. You still need to display it in your theme so that your website visitors can see it. To show your custom fields in a WordPress theme, you can edit the files of your theme.
Find the theme that you want to edit. Ideally, you will display the custom field on a single-post page. In this case, you need to edit the content-single.php or single.php file. You should add custom fields code to the WordPress loop.
Search for a line that looks as follows:
<?php while ( have_posts() ) : the_post(); ?>
You need to add new code before this line:
<?php endwhile; // end of the loop. ?>
Here is code that you should add:
<?php echo get_post_meta($post->ID, 'key', true); ?>
Keep in mind that you must replace the key with the name of your custom field. For instance, the code for the custom field that we’ve created in the first step will look like this:
<p>Current Location: <?php echo get_post_meta($post->ID, 'Location', true); ?></p>
Now you can save changes and check out how your post looks online. You can also use this custom field with your other posts, as well. Create a new post or edit a post that you already have in your blog. Go to the Custom Fields meta box, choose the necessary custom field from the dropdown menu, and enter the necessary value.
3. If You Cannot Find a Custom Field in the Drop-Down Menu
When editing WordPress posts, you may not see all the existing custom fields. The thing is that WordPress only shows 30 custom fields by default. If you’re already using custom fields in some themes and plugins, the chances are that these custom fields will appear in the dropdown menu first. Therefore, if you create a new custom field that isn’t used yet, it might appear at the end of the list and you won’t see it.
You can fix this problem by editing the functions.php file of your theme. Add this code:
add_filter( 'postmeta_form_limit', 'meta_limit_increase' );
function meta_limit_increase( $limit ) {
return 60;
}
This code will limit the number of custom fields in the dropdown menu to 60. If it doesn’t help, you can simply increase this number again.
4. Making a User Interface for Custom Fields
As you can see, you need to select the necessary custom field and to enter its value every time you publish a new post. This is certainly not the best solution if you’re dealing with many custom fields and if your website has multiple contributors.
It would be much more convenient to have a user interface where everyone could enter the necessary values of custom fields by using a simple form. Many WordPress plugins already perform this exact function. For instance, a popular plugin All in One SEO Pack has a custom meta box for an SEO title and meta description.
The Advanced Custom Fields plugin can also be used. This plugin enables you to add new custom fields to your posts and to edit them with no coding knowledge.
5. Creating Custom Fields with Advanced Custom Fields
First of all, you should install the Advanced Custom Fields plugin. Activate the plugin. After this, go to Custom Fields > Field Groups, and click the Add New button. Field groups contain sets of custom fields. By using field groups, you can add multiple panels with different custom fields. Enter the title of a new field group, and then click the Add Field button.
You can add names for your custom fields and choose field types. You can use the Advanced Custom Fields plugin to create different types of fields, including numbers, text, dropdown menus, image upload features, checkboxes, etc.
You can also scroll down and change many other features of a particular custom field according to your requirements. Now you can find a new panel with custom fields in the content editor when creating or editing posts.
6. Using Conditional Statements to Hide Empty Custom Fields
Now you know how to create custom fields and how to show them in your theme. However, there’s no point in displaying a custom field if it’s empty. You can modify the code to only display custom fields that actually have some data in them. For example, here’s what such code will look like when dealing with our Location custom field that we’ve created before:
<?php
$location = get_post_meta($post->ID, 'Location', true);
if ($location) { ?>
<p>Current location: <? echo $location; ?></p>
<?php
} else {
// do nothing;
}
?>
Keep in mind that you will have to replace “Location” with the name of your custom field.
7. Adding Multiple Values to the Same Custom Field
You can reuse the same custom field in the same post, entering different values. To do it, you just need to select the necessary custom field again and to enter another value. However, the code that we used above will only display one value.
If you want to show multiple values in a custom field, you will need to change the code so that it will return data in the form of an array. Below is the code that you should add:
<?php
$location = get_post_meta($post->ID, 'Location', false);
if( count( $location ) != 0 ) { ?>
<p>Current location:</p>
<ul>
<?php foreach($location as $location) {
echo '<li>'.$location.'</li>';
}
?>
</ul>
<?php
} else {
// do nothing;
}
?>
Keep in mind that you will need to replace “Location” with the name of your custom field. You may have noticed that in this code, we’ve switched the last parameter of the get_post_meta function to “false.” This parameter determines whether or not the function will return a single value. When this parameter is switched to “false,” the function can display data as an array.
8. Adding a Guest Author’s Name
Sometimes, bloggers need to publish a guest post but don’t want to create a new user profile for a single post. You can do it easier by including the guest author’s name in a custom field. Add the below code to your theme’s functions.php file:
add_filter( 'the_author', 'guest_author_name' );
add_filter( 'get_the_author_display_name', 'guest_author_name' );
function guest_author_name( $name ) {
global $post;
$author = get_post_meta( $post->ID, 'guest-author', true );
if ( $author )
$name = $author;
return $name;
}
First, the function will check the guest author’s name. If the name exists, the existing author’s name will be replaced with the new name. Now you just need to edit your post’s meta box to include the necessary name as a value of the guest_author field.
9. Showing Contributors to an Article
Quite often, blog posts may have multiple contributors. However, WordPress doesn’t enable you to include several authors for the same article. Fortunately, you can add contributors as custom fields. Start editing the post with multiple contributors, scroll down to the custom fields meta box, and create a “co-author” field with the necessary names. To show co-authors in your theme, add this code to the theme files:
<?php
$contributors = get_post_meta($post->ID, 'co-author', false);
if( count( $contributors ) != 0 ) { ?>
<ul class="contributors">
<li>Contributors</li>
<?php foreach($contributors as $contributors) { ?>
<?php echo '<li>'.$contributors.'</li>' ;
}
?>
</ul>
<?php
} else {
// do nothing;
}
?>
To separate the names of contributors with commas, you can use the following CSS code:
.contributors ul {
display:inline;
}
.contributors li {
display:inline;
list-style:none;
}
.contributors li:after {
content:","
}
.contributors li:last-child:after {
content: "";
}
.contributors li:first-child:after {
content: ":";
}
10. Showing Custom Fields Outside the WordPress Loop
All the tips above will help you display custom fields inside the WordPress loop. However, you may also want to display them outside the loop. For example, you may want to include them in a sidebar of a particular post. In this case, use the following code:
<?php global $wp_query; $postid = $wp_query->post->ID; echo get_post_meta($postid, 'key', true); wp_reset_query(); ?>
Don’t forget to replace “key” with the name of your custom field.
Wrapping Up
Custom fields can be used in various situations. For instance, you can use them to display the names of multiple contributors or to include virtually any other type of information. To display custom fields in your WordPress theme, you will need to use examples of code from our guide. However, you can also install a custom field plugin and work with a simple user interface.
We hope that our tips will help you use custom fields to adjust your WordPress website to your specific needs and to improve its design. If you know any other useful tips, please leave your comments below!
Also Read:
