Back to contents

JetEngine: Meta Field Types Overview

We’ll explore the settings of custom meta fields made with the JetEngine plugin and take a closer look at the types of these fields.

This tutorial reveals the process of working with custom meta fields made with the JetEngine plugin.

What is a Meta Field?

Custom Meta Fields display additional information about the custom or default post. In the default state of the post, that metadata isn’t visible to the website visitors. You can display it only with the help of dynamic widgets. However, the information you type into the meta fields can be used in various places.

Meta Fields can be added to the Custom Post Type or Meta Box. In each case, they are placed into a Meta Fields block.

Meta Field Settings

Navigate to JetEngine > Post Types. Mind that you can also perform the same actions in the Meta Boxes editor. Initially, let’s take a look at the general meta fields settings.

meta field basic settings
  • Label — the title of the field that will be shown to you and other users furtherly;
  • Name/ID — this value is generated automatically, according to the text you put into the Label bar. If you want to change it, keep in mind that the ID shouldn’t include spaces and make sure it consists only of the letters and numbers. The auto-fill will also add a random number to the name if it is not unique. The fields with identical IDs could confuse you and cause some trouble if you’d like to use them somewhere else. That’s why the auto-fill prevents the usage of similar IDs. By the way, if you fill the Label bar with Cyrillic letters, the auto-fill will transliterate it to English;
  • Object type — the type of the meta field. The Field option means that you will be able to add values there. Tab, Accordion, and Endpoint will create a specific layout.

Meta Field Types

Select the custom meta field type from the drop-down in the Field type option below. Let’s find out about the use of each type.

Text

If you want to add an extra field with custom text to the post type, this type perfectly meets your requirements. You can add supplemental information about posts using this field. Also, you can specify the available number of characters in the field.

text field settings
  • Description — an additional piece of information to notify about the meta field purpose;
  • Field width — a value that is set to the “100%” option by default. Change the width to make the meta field layout more compact;
  • Character limit — a field responsible for the meta field input limitation;
  • Default value — a default input for the meta field that can be changed if desired;
  • Is required — if enabled, this toggle makes the field required;
  • Quick edit support — a toggle that makes the field editable during the Quick edit mode;
  • Conditional Logic — a toggle that makes a meta field visible under the set conditions.

Date

Provide information about the date of events, meetings, and conferences with the help of this meta field.

date field settings

Except for the fields mentioned above in the Text type meta field description, those settings are entirely repeated in the Date field. Nonetheless, the Date field also includes one more switcher.

save as timestamp

Save as timestamp option saves the date as a timestamp allowing you to query the posts by date, display the date on the front end using the Dynamic Field widget, and set the needed format via callback.

When setting the query, you can use the date with macros that will return it as a timestamp.

Time

This type is suitable for adding a time marker for posts. Add the particular time of events, meetings, and conferences in this meta field.

time field settings

Datetime

This custom meta field allows picking date and time in the same place conveniently.

datetime field settings

Textarea

You can use this field type to add a textual area to posts and arrange the text line by line.

textarea field settings

WYSIWYG

By selecting this type, you will add a basic editor in the custom field. It is possible to add content with a particular layout and customize its appearance directly in the WordPress Dashboard.

wysiwyg field settings

Switcher

You can add a toggle as a custom field to posts, products, events, etc., which allows you to turn on/off the appropriate option in the meta field block.

switcher field settings

Checkbox

This type allows you to add checkboxes to default and custom posts with different options to choose from.

checkbox field settings

Check more information about Allow Custom, Get Options from the glossary, and Save as array fields below in the Custom values in Checkbox and Radio Field types article section.

Also, learn more about displaying checkbox meta field data in the How to use Checkbox type Meta Field with Listing Grid tutorial.

Iconpicker

Create an icon picker meta field to choose an appropriate icon for the posts.

iconpicker field settings

Media

This type will assist in adding media files, images in particular, to the posts.

media field settings value format dropdown list
  • Value Format — the media format that will be stored in the database. Choose between “Media ID,” “Media URL,” and “Array with media ID and URL” options to display media with the help of both ID and URL.

Gallery

With the help of this meta field type, you will be able to add multiple images to the posts and products in the form of a gallery.

gallery field settings value format
NOTE
To display the Gallery meta field on the front end, you need to activate the Grid Gallery for Dynamic Field and Slider Gallery for Dynamic Field modules.

Radio

Radio type is perfect for adding radio options for choosing one option from all the available ones.

radio field settings

Find out more about the Allow Custom and Get options from the glossary fields below in the Custom values in Checkbox and Radio field types article section.

Repeater

This type will help you add the repeating content block for every post, product, event, etc., which you will be able to fill with value in the WordPress Dashboard.

repeater field settings

Here the “New Repeater Field” button becomes available. Click on it to set the needed fields.

repeater field settings new repeater field
  • Label — a label displayed while editing the post;
  • Name — a repeater field name that will be used as the value to display meta field information filled in the post on different pages;
  • Type — repeater field type that will define how the meta field will look during editing the post.

Find out how to showcase your posts on a Single Post page in the form of a grid using Repeater meta fields from this tutorial.

Select

Use this content type to add a drop-down selector to the post.

select field settings
  • Placeholder — a text displayed as the placeholder in the Select field;
  • Multiple — a toggle that allows setting several values in the Select field at once. This value can also be shown using the proper callback for the Dynamic Field.

Once the “New Field Option” button is pushed, you will see the following customization fields.

select field settings new option
  • Option Value — a value that will be stored in the database;
  • Option label — a label displayed as the option title;
  • Is checked (selected) — a switcher that makes an option selected by default.

Number

If you need a field filled with numbers only, this will be a perfect one.

number field settings
  • Min value — a value that will be the minimal for completing the meta field;
  • Max value — a value to represent the maximal number;
  • Step value — a field that represents the amount between the selectable values. For instance, if the “2” value is picked and there are no minimal and maximal values set, you can choose 1, 3, 5, etc., values for completing the meta field.

Colorpicker

You can add a color picker tool to the posts by choosing this type of meta field.

colorpicker field settings

Posts

This type will allow setting and displaying related posts from the WordPress Dashboard. To do that, one needs to use the Related posts list callback in the Dynamic Field widget, added to a listing.

post field settings
  • Search in post types — a drop-down list to choose the post type as the searching source.

HTML

You can add custom information to the post editing page with the HTML meta field.

This meta field is not intended to be completed in the custom post but to display some information on the backend statically. It is obligatory to add an HTML markup for data to be shown.
Paste the code in the HTML Code and style it with CSS Classes in the following field.

html field settings

Map

This field allows adding the address or the location coordinates to a post.

map meta field

You can set one of the three formats of the value that will be stored in the database: 

  • String with location Lat and Lng separated with a comma;
  • Array with location Lat and Lng;
  • Location Address.

In addition, there is an option to set the needed height of the map. Default map height is 300px. 

NOTE!
The Map meta field can only be added if the Maps Listings module is enabled..

Custom Values in Checkbox and Radio Field Types

ATTENTION!
The following functionality can be used for Custom Posts, Custom Taxonomies and Options Page.

Two additional options appear when you choose the Checkbox or Radio meta field types: Allow Custom and Get options from the glossary.

Allow Custom

allow custom options

This toggle switcher allows adding custom values to the fields, saving them to a database of the current post without saving it to the default values list. Enable the Save Custom toggle to save the custom field options you add to the field during editing the post. Therefore, all the posts will contain the new values of the Checkbox field.

Here’s how this recently added custom value looks in the custom post. Add the value by pressing the “Add Custom Value” button and specifying the value itself.

checkbox custom field

The Allow Custom option lets you add different custom values to various posts. That means that each post can have different values.

ATTENTION!
The Radio type of meta field is set up by analogy of the Checkbox one described above.

Get options from the glossary

checkbox get options from the glossary

If you turn this toggle on, you can add the options from Glossaries to the list. You will be able to specify the needed glossary. Find more details about this feature in the Glossaries functionality overview.

Save as array

checkbox save as array

The checked values will be stored as a plain PHP array when this option is enabled. You need to use this option to edit this field in the form on the front end. If you don’t enable the Save as array option, the field won’t be pre-filled in the form.

NOTE!
It’s recommended to enable this option while creating meta fields. If you fill this field in the CPT and enable the Save as array option, the field will be reset, and you’ll need to add data again.

Quick edit support

The Quick edit support option makes it possible to display some meta fields from JetEngine in the default area for quick editing. It allows you to quickly change the values of some meta fields without opening posts. The following fields are available for quick editing:

  • Text;
  • Date;
  • Time;
  • Datetime;
  • Textarea;
  • Checkbox (only if the Save as array option is enabled);
  • Radio;
  • Select;
  • Number.

After enabling the Quick edit support toggle in some meta fields, they will be displayed in the default area. By clicking the “Quick Edit” action in the Post Type, you will be able to edit them right there.

For example, we enabled Quick edit support for the “Rooms” and “Rating” meta fields, now displayed in the quick edit section.

custom post type quick edit support
NOTE!
Be aware that the meta fields in Meta Boxes with enabled Quick edit option ignore Visibility Conditions. that the meta fields in Meta Boxes with enabled Quick edit option ignore Visibility Conditions.

Conditional Logic allows you to make fields visible only if some conditions are met.

After adding as many meta fields as you need, click the “Update Post Type/Update Meta Box” button to save the changes.

You’re free to display the content you’ve added into the custom meta fields using Elementor in the listings and single post templates.