Bitcatcha's content is reader-supported. When you purchase through links on our site, we may earn an affiliate commission. Learn more

WordPress Custom Fields: How To Add Them To Posts And Pages

UPDATED
May 25, 2024

 

As you gain more experience with your WordPress website, it’s always great to look into the different ways to improve it every now and then. To do this, you can explore some of the platform’s more complex features, such as custom fields.

 

By introducing a custom field to your WordPress post, you can add more helpful information to it, such as a sponsored post disclosure notice, or other important status updates.

 

And it’s super easy to do! In this article, we’ll let you know everything about custom fields in WordPress and how to properly integrate them.

 

 

What Are Custom Fields On WordPress?

 

When you create your website, every page and post you have on the website has its own metadata. This includes the author’s name, the date, and the time in WordPress’s default information. For instance, for the content on Bitcatcha, you can see the metadata displayed under the title.

 

metadata

You can see basic information listed under the post title.

 

But, in some cases such as when you’re not using a managed WordPress hosting platform, you might have to add metadata that WordPress does not support out of the box—and here is where custom fields come in handy.

 

Basically, custom fields in WordPress are a feature that allows you to add more information to a page or post. This allows you to enter data and extend it to your content, making things easier for you in a number of ways:

 

  • Simpler input and updating
    Rather than modifying each post separately, custom fields allow you to simply change and update the data that appears on all your posts.
  • Makes your information consistent
    Custom fields guarantee that the information displayed in each of your posts is consistent and has the same structure.
  • Flexible and easier to customize
    Because custom fields are comprised of code snippets, you’re able to configure and manage how and where they appear on the front end of your website.

 

Super convenient right? Well, you know what else is convenient? Having one of the best web hosting services to store your website’s data. To provide the public with a high-quality service, your brand must have a reliable web host. Applications like systems, virtual marketplaces, blogs, and websites can all benefit from hosting, which has benefits like improved performance and higher security.

 

Now onto the main event – since you now know what custom fields are, here’s how to add them to your website.

 

 

How To Add Custom Fields To WordPress Content

 

We get that the idea of custom fields could seem a little vague, so let’s go through an example to show how this feature actually functions. This basic custom field method has a wide range of uses. You may incorporate status updates in your posts, as well as a disclosure notice for sponsored content, and so much more.

 

But before you do that, don’t forget to back up your website first. You’ll be making adjustments to the main file for your theme if you follow these instructions, so you don’t want to run the risk of making any mistakes that you can’t reverse. It’s also a good idea to create a child theme and use it in place of your base theme for added protection.

 

Once you’re set, just follow the steps below to make your first custom field:

 

Step 1: Add new metadata to your post and enable custom fields

 

The first step is to access the post where you want to insert a custom field. It could be a recent post, or an older one.

 

  1. To do this, go to your WordPress dashboard and find Posts or Pages then click on “All Posts” or “All Pages”.

     

    posts and pages

    This is how you access your WordPress posts and pages.
  2.  

  3. Once you’re there, hover on the post or page that you want to edit. Then, click on “Edit”.

     

    edit page

    Simply click on “Edit” to access the WordPress editor.
  4.  

  5. When you’re in the WordPress editor, click on “Preferences” from the dropdown list by clicking the three dots in the top right corner.

     

    preferences

    The 3 dots can be found at the top right side of the screen.
  6.  

  7. Next, enable Custom fields under Panels in the popup menu. Now, a request to “Enable & Reload” will appear.

     

    custom fields

    The webpage will refresh after clicking on “Enable & Reload”.
  8.  

  9. Now, you’ll find a new section on your Post or Page. You can see this by scrolling to the very bottom of the WordPress editor.

     

    custom fields section

    You might already have certain options available under Name, depending on the themes and plugins you’ve installed.

 

You can now begin adding metadata given that the WordPress custom fields option is now visible.

 

 

Step 2: Adding your new custom field

 

Now that you have the custom fields setting enabled, it’s time to get on to the next step, which is adding the custom field itself.

 

  1. To start, in the section for Add New Custom Fields, select “Enter New” to create a new custom field.
  2. Then, simply enter a name for your custom field and its value.
  3. Once you’re done, click on “Add Custom Field” to save it.

     

    name and value

    Give your custom field a name and a value.
  4.  

  5. After saving it, your custom field will then look like this in the custom fields meta box. You can adjust this custom field whenever you like, and then click the Update button to save your changes. If necessary, you can also click on “Delete” to get rid of it.

     

    delete up

    Click on “Update” to save your new changes and “Delete” to delete the custom field.

 

And that’s it, you now have a custom field! But, you’re not done just yet.

 

 

Step 3: Display your custom field in your WordPress theme file

 

You can include back-end metadata by making a custom field, but you’ll need to make changes to the files for your active theme if you wish to show this information on the front end. Here’s how to do it.

 

  1. Firstly, you need to go to your WordPress dashboard.
  2. Then, look for the Appearance tab and click on “Theme File Editor”. Since this part makes it possible for you to make modifications directly to the files of your website, you must proceed with extreme caution.

     

    theme file editor

    Make sure to be careful when accessing files directly on your website.
  3.  

  4. Once you’re in the Theme File Editor, look for “Single Post” (single.php) in the right sidebar.

     

    singlephp

    Single.php is located in the right sidebar of the editor.
  5.  

  6. After finding it, click on it and find the line that says “Start the Loop”. If you can’t find it, look for something similar. WordPress basically uses a piece of code called a loop to pick which blog posts are displayed on each page.
  7. Here, we’ll be entering a custom field code inside the loop. You should look for a line that looks like this.

     

    start the loop

    This is where you’ll find the loop.
  8.  

  9. You then want to make sure your code is added before the line after this one.

     

    end of the loop

    This is where you’ll find the end of the loop.
  10.  

  11. Now you can add this line of code between the start of the loop and the end of the loop.

     

    line of code

    You should put this code inside the loop.
  12.  

  13. See how the first line of code contains a value that reads “key”? You must fill in that placeholder with the name of the custom field you made in the first step. That code instructs WordPress to find the name of the custom field and determine what value it has. If it locates that custom field for a particular post or page, it will then show its value.
  14. Once you’re done with that, you can then save your changes by clicking on “Update File” at the bottom of the screen.

     

    update file

    Click on “Update File” to save your changes.

 

You’re all set! You can now visit one of your posts or pages and see the custom field in action.

 

 

Bonus: Use A Custom Fields Plugin For More Flexibility

 

You now understand how to include custom fields and metadata in your WordPress pages and posts. But what if you want this functionality to be more flexible or simply want to make the process a lot easier?

 

We’re dealing with WordPress here, so of course you’ll find plugins that can be useful. Although there aren’t many plugins for custom fields, there are a few good ones available. Let’s take a look at some of them:

 

  • Pods
    If you want to get the most out of your custom fields, this plugin is a good place to start. All custom content is managed by Pods using a user-friendly interface. As a result, adding custom fields to your posts, pages, or other custom content types is made simpler.
  • Advanced Custom Fields
    This popular, free plugin makes it so much easier to add custom fields to WordPress. It provides more options for where metadata, such as users, media, and comments, can be added. And, it includes tools to give you more choices for showing custom field values in your theme files. If you want to take things further, you can even pay for a premium version with more features available.
  • Custom Fields Suite
    In essence, Custom Fields Suite is a more compact version of Advanced Custom Fields. It provides a number of new and helpful custom field types for your web page. Also, it makes implementing and organizing custom fields simpler without providing you with an excessive amount of options to choose from.

 

That’s all there is to it. Now you have so many ways to add custom fields to your website.

 

 

Use Custom Fields To Make Things Easier For You

 

Repeatedly adding the same details to numerous entries can become time-consuming, especially when working with sites that have a lot of content.

 

Luckily, custom fields are here to save the day.

 

While it can seem pretty intimidating to add one to your website at first, it’s actually a lot easier than you’d think. All it takes is a few steps, and you can even use a plugin to make the process a lot easier for you. So, after following our guide, you’ll be able to add a custom field in no time flat!