Add a Custom Field in WordPress Posts Using Code Snippets and ChatGPT

We will be exploring how to add a custom field in WordPress to posts using Code Snippets and ChatGPT. Custom fields can enhance your posts with additional data, while Code Snippets and ChatGPT simplify the process, making it accessible to all users.

What are WordPress Custom Fields?

Custom fields, also known as post meta, are a feature in WordPress that allows you to add additional information to your posts. This information is typically not part of the default post content and can be anything from extra text, links, or even images.

A custom field in WordPress provides a way to structure and display this additional information in a consistent manner across your posts. They can be used to add specific data, features, or functionality to a post that is not included in the standard WordPress post format. This could include things like a custom rating for a review, additional author information, or even specific styling or layout instructions.

Steps to Add a Custom Field in WordPress

1. Install the Code Snippets Plugin
   Navigate to your WordPress dashboard, go to ‘Plugins’, click on ‘Add New’, and search for ‘Code Snippets’. Install and activate the plugin.
2. Create a New Snippet including Title
   In your WordPress dashboard, navigate to ‘Snippets’ and click on ‘Add New’. Give your snippet a meaningful title that describes its function.
3. Generate Your Code with ChatGPT
   Go to the ChatGPT interface and input your requirements for the custom fields. ChatGPT will generate a PHP code snippet based on your input. In this case, the following prompt was used: “How can I add three custom fields to WordPress Posts without a Plugin. The custom fields are Reading Time, Level, and Source. The Reading Time field will be numeric. The Level field will be a drop-down field with the following entries; Basic, Intermediate, and Advanced. The Source field is a text field.”
4. Add Your Code to the Snippet
   Copy the code generated by ChatGPT and paste it into the ‘Code’ section of your new snippet in WordPress. In this case we got the following code:

   function add_custom_fields() {
       // Add custom field: Reading Time
       add_meta_box(
           'reading_time',                 // Unique ID
           'Reading Time',                 // Title
           'display_reading_time_callback', // Callback function to display the field
           'post',                         // Post type
           'normal',                       // Context
           'high'                          // Priority
       );
   
       // Add custom field: Level
       add_meta_box(
           'level',                        // Unique ID
           'Level',                        // Title
           'display_level_callback',       // Callback function to display the field
           'post',                         // Post type
           'normal',                       // Context
           'high'                          // Priority
       );
   
       // Add custom field: Source
       add_meta_box(
           'source',                       // Unique ID
           'Source',                       // Title
           'display_source_callback',      // Callback function to display the field
           'post',                         // Post type
           'normal',                       // Context
           'high'                          // Priority
       );
   }
   
   function display_reading_time_callback($post) {
       // Retrieve the current value of the field
       $reading_time = get_post_meta($post->ID, 'reading_time', true);
   
       // Output the field HTML
       echo '<label for="reading_time">Reading Time (minutes):</label>';
       echo '<input type="number" id="reading_time" name="reading_time" value="' . esc_attr($reading_time) . '" />';
   }
   
   function display_level_callback($post) {
       // Retrieve the current value of the field
       $level = get_post_meta($post->ID, 'level', true);
   
       // Output the field HTML
       echo '<label for="level">Level:</label>';
       echo '<select id="level" name="level">';
       echo '<option value="Basic" ' . selected($level, 'Basic', false) . '>Basic</option>';
       echo '<option value="Intermediate" ' . selected($level, 'Intermediate', false) . '>Intermediate</option>';
       echo '<option value="Advanced" ' . selected($level, 'Advanced', false) . '>Advanced</option>';
       echo '</select>';
   }
   
   function display_source_callback($post) {
       // Retrieve the current value of the field
       $source = get_post_meta($post->ID, 'source', true);
   
       // Output the field HTML
       echo '<label for="source">Source:</label>';
       echo '<input type="text" id="source" name="source" value="' . esc_attr($source) . '" />';
   }
   
   function save_custom_field_data($post_id) {
       // Save the custom field data: Reading Time
       if (isset($_POST['reading_time'])) {
           $reading_time = sanitize_text_field($_POST['reading_time']);
           update_post_meta($post_id, 'reading_time', $reading_time);
       }
   
       // Save the custom field data: Level
       if (isset($_POST['level'])) {
           $level = sanitize_text_field($_POST['level']);
           update_post_meta($post_id, 'level', $level);
       }
   
       // Save the custom field data: Source
       if (isset($_POST['source'])) {
           $source = sanitize_text_field($_POST['source']);
           update_post_meta($post_id, 'source', $source);
       }
   }
   
   add_action('add_meta_boxes', 'add_custom_fields');
   add_action('save_post', 'save_custom_field_data');

   Source: Code Snippets

5. Save and Activate Your Snippet
   Click on ‘Save Changes and Activate’ to implement your custom fields.

Frequently Asked Questions

What are some examples of a Custom Field in WordPress?

Custom fields can be anything from additional text, links, images, to more complex features like ratings or author bios. They are used to add specific data, features, or functionality to a post that is not included in the standard WordPress post format.

What is ChatGPT and how does it help with adding custom fields?

ChatGPT is an AI developed by OpenAI. In this tutorial, we use it to generate the PHP code for our custom fields, simplifying the process and making it accessible to users with little to no coding experience.

Can I use custom fields to improve SEO?

Absolutely. A custom field in WordPress can be used to add SEO-friendly information to your posts, such as meta descriptions and keywords. They can also improve the user experience by adding additional, relevant information to your posts.