Customization is one of the main features offered by WordPress as a powerful content management system software. Thanks to the feature, you can create a tailored website according to your needs. One of the customization options you can use is custom fields.
In this article, we will cover everything you need to know about WordPress custom fields. Here are what we will cover:
- What is a custom field
- How to create a custom field
- How to add a custom field in a page builder plugin
- Plugins to create custom fields
What is a custom field
In our previous article, we have covered the anatomy of the single post template in WordPress. What is the correlation with custom fields?. On the single post template of WordPress, you usually find elements like post title, post meta, featured image, and so on. These elements are called fields and they are already provided by WordPress. With PHP knowledge, you can set how to display these default fields. Or, you can also use a page builder plugin such as Elementor, Brizy, and Divi Builder to display those elements if you have no PHP knowledge.
If you need an additional field to store custom metadata, you can create a custom field. In other words, a custom field allows you to store additional information (metadata) about blog posts, page, custom post types, and other content types on WordPress.
What are custom fields used for?
Have you ever used WooCommerce? WooCommerce is the best example of how custom fields can be used. When adding a new product in WooCommerce, you can add such information as product price, product category, product rating, product color, and so on. You can then manage how the products to be displayed on the front-end of your website. In most cases, your visitors are able to sort the products by price, color, category, rating, and other parameters. In the context of WooCommerce, parameters like price, color, rating, and category are examples of custom fields.
Need a simpler example?
Say you want to create a movie review website. Chances are, you want to add parameters such as rating, genre, and summary. Instead of adding those parameters in the content editor like the following:
You can separate those parameters from the main content by creating custom fields as follows:
Separating those parameters in custom fields could give you a flexibility and benefits. For example:
- It helps to ensure that your review posts have the same styling and formating.
- You can create a page that lists the best movies and offers the ability for your users to sort the movies by the available parameters (rating or genre).
In addition to a movie review site and e-commerce site, you can also use custom fields to create other website types such as a lodging site, a vehicle rental site, and so on. By WordPress, custom fields are stored in different tables in the WordPress database.
One of the biggest advantages of WordPress custom fields is that you can create any type of website without relying on plugins. Instead, you can create custom fields yourself according to your needs. If you have to install a plugin, you only need to install one plugin (the plugin to create the custom fields)
How to create a custom field
WordPress actually comes with a default feature to create a custom field, but for a real website, you might don’t want to use it. But if you want to know, you can click the three-dot icon on the top-right corner of the WordPress editor and select Options.
On the appearing window, enable the Custom fields option.
After reloading the editor, you will see a new block beneath the content editor where you can add the custom fields.
To display information from the custom fields, you need to have PHP knowledge.
Alternatively, you can use a plugin to create WordPress custom fields and then display the information using a page builder. This is the best solution if you have no PHP knowledge. ACF (Advanced Custom Fields), Pods, and JetEngine (Elementor only) are examples of plugins you can use.
Pods is the best option if you are looking for a free solution of custom field plugin as it is released as a free plugin. Here is how to use Pods to create WordPress custom fields.
How to create WordPress custom fields using Pods
Pods supports 18 field types, including jQuery-based date picker, color picker, file upload, WYSIWYG editor. You can download it on the WordPress plugin directory.
Once installed and activated, go to Pods -> Add New. You will be faced with two options. If you want to assign the custom fields to a new custom post type, you can select the Create New option. Conversely, you can choose the Extend Existing option to assign the custom fields to an existing content type like blog posts, pages, taxonomies, and so on. We choose the Extend Existing option in this example.
Select the content type as well as the post type you want to assign the custom fields to and click the Next Step button.
To add a field, you can click the Add Field button. Add the field label, field name, and field description. Also select the field type. If you want to set the field as a required field, you can simply tick the Required option. To add additional parameters such as maximum length and HTML placeholder, you can open the Additional Field Options tab. Click the Save Field button to save the field.
You can repeat the steps above to add more custom fields. Once done adding the custom fields, click the Save Pods button to publish the custom fields.
Your custom fields are ready to use.
How to add a custom field in a page builder plugin
Most page builder plugins come with a feature to add custom fields, including our favorite page builders Elementor, Brizy, and Divi Builder. On Elementor and Brizy, the ability to add custom fields is available on the pro versions. Not all custom field plugins are supported by page builders, though. Pods, for instance. It cannot be used on Divi Builder. We have separate articles that cover how to add custom fields in Elementor, Brizy, and Divi Builder. You can read the articles to learn more. Here are the links:
- How to add custom fields in Elementor
- How to add custom fields in Brizy
- How to add custom fields in Divi Builder
4 plugins to create custom fields
As we have just mentioned above, not all custom field plugins are supported by page builders so make sure to install the one that are supported by the page builder you use. Here are 4 of the best plugins to create WordPress custom fields.
If you use Elementor, JetEngine is the first plugin you can take a look. It is a premium Elementor add-on developed by Crocoblock, part of JetPlugins. With JetEngine, you can create a fully customized WordPress-based website without coding with minimum plugins. There are 17 field types you can choose from when creating a custom field group using JetEngine:
- Text area
- Icon picker
JetEngine itself is a versatile enough plugin. In addition to creating custom fields, you can also use it to create a custom form thanks to the Forms module. You can also use it to create a custom post type.
As mentioned, Pods is the best option if you are looking for a free solution of a custom field plugin. The plugin is released as a free plugin, completely free. There are 18 field types supported by Pods.
- Plain Text
- Plain Paragraph Text
- QYSIWYG Editor
- Plain Number
- Color Picker
You can use Pods on Elementor and Brizy.
3. Advanced Custom Fields a.k.a ACF
Advanced Custom Fields (shortened as ACF) is the most popular plugin to create WordPress custom fields. It already has over 1 million installations. Being the most popular custom field plugin, no wonder if ACF is supported by most page builder plugins, including Elementor, Brizy, and Divi Builder. ACF itself is released as a freemium plugin, meaning there is a chance to use it for free. Here are the field types supported by ACF:
- Text Area
- WYSIWYG Editor
- Radio Button
- Button Group
- Post Object
- Page Link
- Google Maps
- Date Picker
- Date Time Picker
- Time Picker
- Color Picker
- Tab Group
Toolset is a paid custom field plugin. There is no option to use it free for free. Toolset is supported by most page builder plugins, including Brizy and Elementor.
The bottom line
The ability to add custom fields is a superior feature offered by WordPress to create a fully customized website with a minimum plugin. Understanding how custom fields work is the key to become a web developer based on WordPress. No PHP knowledge is required. Coupled with your favorite page builder, you can be a web developer by mastering a certain custom field plugin.