search
HomeCMS TutorialWordPressA brief analysis of how to add a custom field panel in WordPress

How to add a custom field panel in WordPress? The following article will introduce to you how to add a custom field panel in WordPress. I hope it will be helpful to you!

A brief analysis of how to add a custom field panel in WordPress

## When we write articles in WordPress, we often use some custom fields, such as the two meta tags of web page description and keywords. Regarding these two For a tag, you can read an article I wrote before:

WordPress sets independent Description and Keywords

Usually when adding custom fields and their values, we do it manually It seems a bit troublesome to select the corresponding field in the drop-down box of the "Custom Field" module, then enter its value, and finally submit and wait for a short period of time. So is it possible to create a separate panel for these commonly used custom fields and just fill in the content directly? Just like article tags, you can add tags directly without submitting them separately. The answer is yes, here is the rendering:

A brief analysis of how to add a custom field panel in WordPress

I will teach you how to operate it below. Place all the following codes into functions.php of the current theme.

1. Create the required field information

Here we will add two custom fields, named _description_value and _keywords_value respectively. You can give The following array adds multiple elements to achieve the purpose of adding multiple custom fields.

The first element of the array, name, is the name of the custom field. In this code, the name of the custom field is the name value plus _value to prevent conflicts with other codes, such as _description_value; std is self Define the default value of the field. When you publish an article and no value is filled in the custom field, the default value will be used; title is the title of the custom field module, such as "Abstract", "Category" and "Tag" on the article editing page ", these are module names.

$new_meta_boxes =array(
  "description" => array(
    "name" => "_description",
    "std" => "这里填默认的网页描述",
    "title" => "网页描述:"),

  "keywords" => array(
    "name" => "_keywords",
    "std" => "这里填默认的网页关键字",
    "title" => "关键字:"));

2. Create a custom field input box

The following code will be used to create a custom field and input box, just copy it

function new_meta_boxes() {
  global $post, $new_meta_boxes;

  foreach($new_meta_boxes as $meta_box) {
    $meta_box_value = get_post_meta($post->ID, $meta_box['name'].'_value', true);

    if($meta_box_value == "")
      $meta_box_value = $meta_box['std'];

    // 自定义字段标题
    echo&#39;<h3 id="meta-box-title">&#39;.$meta_box[&#39;title&#39;].&#39;</h3>&#39;;

    // 自定义字段输入框
    echo &#39;<textarea cols="60" rows="3" name="&#39;.$meta_box[&#39;name&#39;].&#39;_value">&#39;.$meta_box_value.&#39;</textarea><br />&#39;;
  }
   
  echo &#39;<input type="hidden" name="ludou_metaboxes_nonce" id="ludou_metaboxes_nonce" value="&#39;.wp_create_nonce( plugin_basename(__FILE__) ).&#39;" />&#39;;}

3. Create a custom field module

The following code will add a custom field module to the article editing page, which uses WordPress’s add module function

add_meta_box. This is exactly the opposite of what was done in the previous article WordPress article editing page to delete related modules.

function create_meta_box() {
  if ( function_exists(&#39;add_meta_box&#39;) ) {
    add_meta_box( &#39;new-meta-boxes&#39;, &#39;自定义模块&#39;, &#39;new_meta_boxes&#39;, &#39;post&#39;, &#39;normal&#39;, &#39;high&#39; );
  }}

4. Save article data

All preparations have been made before, the most important thing is to save the data in our custom fields information.

function save_postdata( $post_id ) {
  global $new_meta_boxes;
   
  if ( !wp_verify_nonce( $_POST[&#39;ludou_metaboxes_nonce&#39;], plugin_basename(__FILE__) ))
    return;
   
  if ( !current_user_can( &#39;edit_posts&#39;, $post_id ))
    return;
               
  foreach($new_meta_boxes as $meta_box) {
    $data = $_POST[$meta_box[&#39;name&#39;].&#39;_value&#39;];

    if($data == "")
      delete_post_meta($post_id, $meta_box[&#39;name&#39;].&#39;_value&#39;, get_post_meta($post_id, $meta_box[&#39;name&#39;].&#39;_value&#39;, true));
    else
      update_post_meta($post_id, $meta_box[&#39;name&#39;].&#39;_value&#39;, $data);
   }}

5. Connect the function to the specified action

This is the last step and the most important step, we have to do The purpose is to connect the function to the specified action (action) to let the WordPress program execute the function we wrote before:

add_action(&#39;admin_menu&#39;, &#39;create_meta_box&#39;);
add_action(&#39;save_post&#39;, &#39;save_postdata&#39;);
Okay, that’s all we have to do, now you can To call these two custom fields in your theme, use a text editor to open header.php in the theme directory, and copy the following code to to customize the description and keywords for your web page. Tags, please use the search engine for more specific operations:

<?phpif (is_single()) {
  // 自定义字段名称为 description_value
  $description = get_post_meta($post->ID, "_description_value", true);

  // 自定义字段名称为 keywords_value
  $keywords = get_post_meta($post->ID, "_keywords_value", true);

  // 去除不必要的空格和HTML标签
  $description = trim(strip_tags($description));
  $keywords = trim(strip_tags($keywords));

  echo &#39;<meta name="description" content="&#39;.$description.&#39;" />
<meta name="keywords" content="&#39;.$keywords.&#39;" />&#39;;
}
?>

Recommended learning: "

WordPress Tutorial"

The above is the detailed content of A brief analysis of how to add a custom field panel in WordPress. For more information, please follow other related articles on the PHP Chinese website!

Statement
This article is reproduced at:露兜即刻. If there is any infringement, please contact admin@php.cn delete
Is WordPress suitable for e-commerce?Is WordPress suitable for e-commerce?May 13, 2025 am 12:05 AM

Yes, WordPress is very suitable for e-commerce. 1) With the WooCommerce plugin, WordPress can quickly become a fully functional online store. 2) Pay attention to performance optimization and security, and regular updates and use of caches and security plug-ins are the key. 3) WordPress provides a wealth of customization options to improve user experience and significantly optimize SEO.

How to add your WordPress site in Yandex Webmaster ToolsHow to add your WordPress site in Yandex Webmaster ToolsMay 12, 2025 pm 09:06 PM

Do you want to connect your website to Yandex Webmaster Tools? Webmaster tools such as Google Search Console, Bing and Yandex can help you optimize your website, monitor traffic, manage robots.txt, check for website errors, and more. In this article, we will share how to add your WordPress website to the Yandex Webmaster Tool to monitor your search engine traffic. What is Yandex? Yandex is a popular search engine based in Russia, similar to Google and Bing. You can excel in Yandex

How to fix HTTP image upload errors in WordPress (simple)How to fix HTTP image upload errors in WordPress (simple)May 12, 2025 pm 09:03 PM

Do you need to fix HTTP image upload errors in WordPress? This error can be particularly frustrating when you create content in WordPress. This usually happens when you upload images or other files to your CMS using the built-in WordPress media library. In this article, we will show you how to easily fix HTTP image upload errors in WordPress. What is the reason for HTTP errors during WordPress media uploading? When you try to upload files to Wo using WordPress media uploader

How to fix the issue where adding media buttons don't work in WordPressHow to fix the issue where adding media buttons don't work in WordPressMay 12, 2025 pm 09:00 PM

Recently, one of our readers reported that the Add Media button on their WordPress site suddenly stopped working. This classic editor problem does not show any errors or warnings, which makes the user unaware why their "Add Media" button does not work. In this article, we will show you how to easily fix the Add Media button in WordPress that doesn't work. What causes WordPress "Add Media" button to stop working? If you are still using the old classic WordPress editor, the Add Media button allows you to insert images, videos, and more into your blog post.

How to set, get and delete WordPress cookies (like a professional)How to set, get and delete WordPress cookies (like a professional)May 12, 2025 pm 08:57 PM

Do you want to know how to use cookies on your WordPress website? Cookies are useful tools for storing temporary information in users’ browsers. You can use this information to enhance the user experience through personalization and behavioral targeting. In this ultimate guide, we will show you how to set, get, and delete WordPresscookies like a professional. Note: This is an advanced tutorial. It requires you to be proficient in HTML, CSS, WordPress websites and PHP. What are cookies? Cookies are created and stored when users visit websites.

How to Fix WordPress 429 Too Many Request ErrorsHow to Fix WordPress 429 Too Many Request ErrorsMay 12, 2025 pm 08:54 PM

Do you see the "429 too many requests" error on your WordPress website? This error message means that the user is sending too many HTTP requests to the server of your website. This error can be very frustrating because it is difficult to find out what causes the error. In this article, we will show you how to easily fix the "WordPress429TooManyRequests" error. What causes too many requests for WordPress429? The most common cause of the "429TooManyRequests" error is that the user, bot, or script attempts to go to the website

How scalable is WordPress as a CMS for large websites?How scalable is WordPress as a CMS for large websites?May 12, 2025 am 12:08 AM

WordPresscanhandlelargewebsiteswithcarefulplanningandoptimization.1)Usecachingtoreduceserverload.2)Optimizeyourdatabaseregularly.3)ImplementaCDNtodistributecontent.4)Vetpluginsandthemestoavoidconflicts.5)ConsidermanagedWordPresshostingforenhancedperf

How customizable is WordPress, really?How customizable is WordPress, really?May 11, 2025 am 12:11 AM

WordPress is very customized, providing a wide range of flexibility and customizability. 1) Through the theme and plug-in ecosystem, 2) use RESTAPI for front-end development, 3) In-depth code level modifications, users can achieve a highly personalized experience. However, customization requires mastering technologies such as PHP, JavaScript, CSS, etc., and pay attention to performance optimization and plug-in selection to avoid potential problems.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

Powerful PHP integrated development environment

SecLists

SecLists

SecLists is the ultimate security tester's companion. It is a collection of various types of lists that are frequently used during security assessments, all in one place. SecLists helps make security testing more efficient and productive by conveniently providing all the lists a security tester might need. List types include usernames, passwords, URLs, fuzzing payloads, sensitive data patterns, web shells, and more. The tester can simply pull this repository onto a new test machine and he will have access to every type of list he needs.

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor