Displaying Custom fields outside the WordPress loop

If you have ever wondered how to display custom fields out side of the WordPress loop. Then you wish is coming true normally we display the custom fields inside the WordPress loop together with other WordPress content. But, specifically in this blog you will learn how to display the custom fields outside of the loop.

  • Custom Fields

So, let begin with answering what basically custom fields are in WordPress. Custom fields are additional input boxes that allow you add some additional meta data along with your post default data.

As of now we know that custom fields are used to add some additional data with post, so hence its really easy to display then with post data inside the loop but in some occasion, you may want to display then outside the loop like that could in sidebar for example or in a widget in footer or something like that.

Now that we know what custom fields are and why do we need them and also why would we want to query them out side of the loop so let’s begin with how to display then outside the loop.

Displaying Them outside the loop.

Solets being.                                                                                                                                                                                       In order to show the meta data outside the WordPress main loop we will use multiple loops so that we don’t disturbing the themes main loop.                                                                                                                  Just add the below given code to your WordPress theme where ever you want to display your meta data fields on your website.

1
2
3
4
5
6
<?php
global$wp_query;
$postid= $wp_query->post->ID;
echoget_post_meta($postid, 'Your-Custom-Field', true);
wp_reset_query();
?>

So now lets understand what this code does.

The first line loads up the global WordPress variable “ $wp_query ” once its been loaded then using this variable we can get the id of the post. Simply by writing “ $wp_query->post->ID ”. After that you can simply get the post meta by “ get_post_meta() “ providing it post id as first argument and the field name as second the third prams is optional and in the last statement we just reset the query.

Now as we have understood how to get the post meta lets do it using another way.

This time lets use the WP_Query class and just for your information this much suitable and preferred way of doing things getting post meta or getting custom post types.

All you have to do is just paste the code to your theme or child theme.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<?php
$args= array(
// Post or Page ID
'p'=>$postid,
);
 
// The Query
$the_query= newWP_Query( $args);
 
// The Loop
if( $the_query->have_posts() ) {
 
    while( $the_query->have_posts() ) {
        $the_query->the_post();
        echoget_post_meta( get_the_ID(), 'Mood', true);
        }
 
     
    /* Restore original Post Data */
    wp_reset_postdata();
 
} else{
 
echo'Nothing found';
     
}
?>

It’s the same thing but just we did in a different manner instead of directly writing the function we took the function inside the WordPress loop.

So that’s all for this tutorial hope you did learned something form it if you have any problem just leave a comment down below and I will come to that as soon as I can.

About Author

Leave A Reply