Do you want to display custom fields outside of the loop on WordPress?

Normally, custom fields are displayed in the WordPress loop along with other content and metadata.

In this tutorial, we will show you how to display custom fields outside of the loop on WordPress.

Show custom fields outside of wordpress loop 1

What are custom fields on WordPress

Custom fields allow you to add additional metadata in your WordPress posts, in order to display with the content of your publication.

You can add custom fields simply by activating metas boxes of custom fields on the " Screen options " You can also create custom metas boxes on WordPress to give your custom fields a better user interface.

Wordperss custom fieldSince custom fields add metadata to posts, they can be easily displayed in the WordPress loop with other content. However, sometimes you might want to show them outside the loop. For example, in a sidebar widget. At this point, it gets a little tricky.

See also: 6 WordPress plugins to add auto-completion to your forms

That said, let's see how to easily display custom fields outside the loop on WordPress.

How to display custom field data outside the loop on WordPress

Instead of displaying custom field metadata outside of the loop, we'll show you how to use multiple loops in your WordPress themes without affecting the main loop.

This article requires you to add code to files of your WordPress theme.

You will need to add the following code to the different locations on your WordPress theme files where you want to display the meta data.

post->ID; echo get_post_meta($postid, 'Your-Custom-Field', true); wp_reset_query(); ?>

This code uses the global variable $ wp_query to get the item ID. Then it uses the " get_post_meta () To retrieve and display your custom field data.

Don't forget to modify " Your-Personalized-Field With your real custom field.

You can customize the code to meet your needs. You can also use other query arguments to retrieve and display custom field data for different posts and pages.

Let's take a look at another example. This one uses the WP_Query class, which is much better and more flexible for using multiple loops in your WordPress theme files.

Just add this code to your WordPress theme or child theme where you want to display the custom field.

$ args = array (// Post or Page ID 'p' => 231,); // The Query $ the_query = new WP_Query ($ args); // The Loop if ($ the_query-> have_posts ()) {while ($ the_query-> have_posts ()) {$ the_query-> the_post (); echo get_post_meta (get_the_ID (), 'Mood', true); } / * Restore original Post Data * / wp_reset_postdata (); } else {echo 'Nothing found'; }

Do not forget to replace " Mood By the proper name of your custom field and your ID with your own publication or page ID.

Demonstration of custom fields on wordpress

Now you can display custom fields from a post/page on a section other than the WordPress loop. But, if you need a premium solution to manage to display the custom fields of an article/page, we offer you below 3 WordPress plugins premium that will help you in this task.

1. WooCommerce Registration Fields Plugin

Le WordPress Plugin premium WooCommerce Registration, Add Custom Registration Fields allows you to add additional custom fields to your registration form. You will be able to add a text box, a selection box, a check box, an option box, a date picker, a password, and others. Woocommerce registration add custom fields to signup form plugin wordpess

It will also allow you to enable or disable WooCommerce fields by default. The connection feature via Facebook and Twitter is also enabled in this plugin.

Discover How to optimize your images and improve your SEO by clicking on this link.

Other features include: support for an unlimited number of fields on a registration form, support for the Drag and Drop feature, customization of fields for better readability, temporary display or not. a field, the possibility to let the customer modify his profile and many others.

Download Demo | Web hosting

2. Advanced Custom Fields 

As the name suggests, this WordPress Plugin premium lets you create a custom field group as a standalone component that you can reuse in other field groups. Advanced custom fields component field addon plugin wordpess

Later, if you want to modify this component, you only have to modify it once, it will apply to all groups of fields that use this component.

Read also our article on 8 WordPress plugins to boost the engagement of your visitors

It is very easy to use and you can take it in hand very easily. So save time and productivity by just reusing fields or groups of fields that you have already created.

Download | Demo | Web hosting

3. Bookly Custom Fields

It is important to note that this WordPress Plugin premium is an add-on that requires the Bookly WordPress plugin to work. By default, customers or visitors are usually accustomed to filling out several fields such as name, phone number and email address before confirming a reservation.Bookly custom fields add on wordpess plugin

But with this WordPress plugin, you can ask them to fill in more fields, finally get more details or any other type of information. These new fields will appear in step Download du booking process, and the details of the booking will be added to your Bookly calendar.

See also our article on How to hide unnecessary items on the WordPress dashboard

Its features are, among others: the ability to create as many fields as needed, support for different types of fields, the ability to make certain fields mandatory or optional for filling, detailed documentation and much more.

Download Demo | Web hosting

Recommended Resources

Find out about other recommended resources to help you build and manage your website.

Conclusion

Here ! That's it for this tutorial, hopefully it allows you to display custom fields out of the loop on WordPress. If you have any suggestions or remarks, they will be welcome.

However, you will also be able to consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on the WordPress blog creation or the one on Divi: the best WordPress theme of all time.

Don't forget to let us know your Comments, proposals and suggestions on this article. NOTWe also urge you to share this article on your different social networks.

...