Starting with WordPress Metafields | RainaStudio

Starting with WordPress Metafields

WordPress metafields simply opens a process by which WordPress can store data for a particular post in database and shows them when we call them with the key we wrote while registering. WordPress developer made it simple and easy to add custom metafields for developers. WordPress itself uses post metafileds for store data for each post.

Step 1: Register a WordPress Metafields add_meta_boxes action hook.

We need to register to WordPress head that we need a metafields on a post type. There is a action call add_meta_box which is designed to do this.

add_meta_box takes a few parameters but here we will talk about the most used parameters.

  • $id : $id is the unique string by which you will call and save this metafields data to database. Won’t take any spaces. Example: ‘rs_team_meta_member_profile_page’.
  • $title: $title will be shown in the edit post page where the metafields will be displayed as a title of the metabox section
  • ‘meta_field_callback_function’: This is the function name which will echo or output the html needed for wordpress to display the field you want. Anything you output with this function it will be displayed in that post metabox section.
  • $which_post_type_to_show: Very important! This is what you tell the WordPress where to show this metafields. You need to write post type here. Example: ‘post’, ‘page’, or ‘custom_post_type_id’ .
  • $where_to_show: This the position param that wordpress takes to determain where to show the metafield section. It can be ‘side’ if you want it in the right side or ‘normal’ if you want to have it below post editor.
  • $priority: This is another parameter for the position. We told the wordpress if side or normal in the last parameters now we tell whether it is to show on top of right/below section. This is the horizontal position of that meta box. You can write ‘core’ means auto, ‘high’ or ‘low’;

Here is a function by which we are able to add an actual WordPress metafield.

Let’s see another function which initialized php $variable. This is the same function as above written in slight differences. Use the one you like to see or write.

Step 2: Output the input field’s html using the call back function we wrote in the previous step.

We are ready to write the markup for the input field. As we know there are many input type, this step is different to cases to cases. Let’s see few example of that. Since we named this callback function ‘rs_tp_position’ , we will use this in the below examples.

  • Example 1: For input type ‘text‘.

    • global $post : It is bringing the global $post object into the function. Why? ok Let’s see.
    • wp_create_nonce: Nonce is a security filtering for the input we get.  Basically we creating some input type hidden filed with some special value so that with that data we can verify whether it has come from that page while we will save this data to database in step 3. read more wp_create_nonce.
    • get_post_meta: We are building a input field in the post edit page right, so we need to be able to show the already saved data(if any) in the input field. $position = get_post_meta($post->ID, ‘_position’, true) is returning the already saved data for this key from the database into a variable. We wrote global $post to use that in this line. ‘_position’ is the key which has not been added as a input field name yet.
    • Input type text field: We will write type as ‘text’ and name is the key same as we wrote in get_post_meta() function. so we write ‘_position’ here. Value will contain the value that we save in a variable called $position in previous line. And we can also add some fancy class to it!
  • Example 2: For input type ‘checkbox‘.
    • Everything is same from the text filed different is in the html of the field and the value that we need to make a checkbox checked and unchecked.
    • ($position == 1) ? $check_mark = “checked” : $check_mark = “”; by this line we are saying that if the $position, the value of the metefield, is equal to 1(as we write the value as 1 in the field html below) then make a variable called $check_mark and fill ‘checked’ string in it and if the value anything else make the $check_mark empty.
    • As it is a checkbox we are writing type as ‘checkbox’ name as same as the key in which we want to save it in database. value is whatever you can put and make sure use same value while verifying. we are include ‘.$check_mark.’ inside out echo statement so that the ‘checked’ or ‘(empty)’ string can be printed from the $check_mark that we made earlier.
  • Example 3: For input type ‘select‘.
    • To select a option field from a select filed we need a attribute called ‘selected’ if browser sees this attribute in any option box it will show that option as selected. So we are check a string $checkmark with that string ‘selected’ then we are giving it conditionally to the option field we added next. We are echoing out the field here we are returning for the sake of the situation.
  • Example 4: Input type ‘number‘.
    • Only change from the text field; type =’number’.

Step 3: Saving the data when submitted; into the database.

  • wp_verify_nonce: It is a function by which we can verify the nonce we created by writing we_create_nonce. Basically it is varying using those special token value of input type hidden field. read more wp_veryfy_nonce.
  • DOING_AUTOSAVE:  Checking if it is not the auto save request. In our case we only need to save the data when user press update of post edit page. If you need to save even in autosave request remove this condition.
  • current_user_can: It again a WordPress function which return how much access do the current user have. So are check the current user capability to edit post. Any editor have this access. if we only need to save from administrator we can write ‘manage_options’ read more WordPress roles and capabilities .
  • $team_meta[‘_position’] = $_POST[‘_position’] by this we are getting that data submitted by the user after checking all the staff before this in a array named $team_meta with a key named out metaled key ‘_position’ . You can get the data in a simple variable also but we did it case we will be able to save a lot of meta filed data by some code by creating array with key.
  • Then we are running a ‘foreach’ loop which will do the same written inside for every element of  $team_meta array. We are also taking as key = value at once. Now we can save this as a post meta in database with using update_post_meta or add_post_meta with the key of the array what we set before. You can keep this ‘foreach’ loop same for you code just change the array name $team_meta if you changed it in your code.

This is all I think to have a go in WordPress Metafields. If you want to share your opinion in the comment box I’m happy to rely. I will also be interested if you ask any wuesiton related to the subject. Thanks for reading.

Jaber Molla

His childhood ​passion for tech helped him to build his wide-ranging experience in back-end web programming. ​He insists on best practice and clean code to avoid vulnerability and other critical problems that arises from poor design of coding.