{"id":113456979,"date":"2024-03-25T13:04:17","date_gmt":"2024-03-25T11:04:17","guid":{"rendered":"https:\/\/thrivethemes.com\/?post_type=ht_kb&#038;p=113456979"},"modified":"2025-10-31T10:28:55","modified_gmt":"2025-10-31T08:28:55","slug":"creating-the-specific-types-of-advanced-custom-fields-needed-for-thrive-architect-elements","status":"publish","type":"ht_kb","link":"https:\/\/thrivethemes.com\/docs\/creating-the-specific-types-of-advanced-custom-fields-needed-for-thrive-architect-elements\/","title":{"rendered":"Creating the Specific Types of Advanced Custom Fields Needed for Thrive Architect Elements"},"content":{"rendered":"\n<p>There are six specific custom field types that you may need to set up, depending on which compatible <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/architect\/\" target=\"_blank\" rel=\"noopener\">Thrive Architect<\/a> element you want to use them with. These custom field types are the following:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cText\u201d field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cURL\u201d field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cImage\u201d field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cNumber\u201c field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cFile\u201d field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cDate Time Picker\u201d field<\/span> <\/li>\n<\/ol>\n\n\n\n<p>Before being able to use custom fields, when editing your pages\/post with Thrive Architect, you will need to:<\/p>\n\n\n\n<p><b>\u2192<\/b> <b>Add these types of custom fields<\/b> to the \u201cField Group\u201d you have created, in your \u201cAdvanced Custom Fields\u201d (ACF) dashboard (if you require detailed information on how to create the \u201cField Group\u201d, take a look at this step-by-step guide <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-custom-fields-using-the-advanced-custom-fields-plugin\/\" target=\"_blank\" rel=\"noopener\">here<\/a>).<\/p>\n\n\n\n<p><b>\u2192<\/b> <b>Assign value for the custom field types<\/b> in the WordPress editor for each post\/page you will want to use them on.<\/p>\n\n\n\n<p>We will take each one from the above-mentioned custom field types and detail these two steps for them, in this article.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"add--set-up-the-different-types-of-custom-fields\">Add &amp; set up the different types of custom fields<\/h3>\n\n\n\n<p>First, you should decide what type of custom field you will need. Here is a list of the compatible elements and the custom field types you need for each of them.<\/p>\n\n\n\n<p>You can choose which custom field type to set up, based on which element you will want to use it with.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cText\u201d element \u2192 \u201cText\u201d field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cHyperlink\u201d \u2192 \u201cURL\u201d field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cImage\u201d element \u2192 \u201cImage\u201d field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cAudio\u201d element \u2192 \u201cFile\u201d field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cVideo\u201d element \u2192 \u201cFile\u201d field type or &#8220;URL&#8221; field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cProgress Bar\u201d element \u2192 \u201cNumber\u201c field type, set between 0 &#8211; 100<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cFill Counter\u201d element \u2192 \u201cNumber\u201c field type, set between 0 &#8211; 100<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cStar Rating\u201d element \u2192 \u201cNumber\u201c field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cCountdown\u201d element \u2192 \u201cDate Time Picker\u201d field type<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">\u201cGoogle Map\u201d element \u2192 \u201cText\u201d field type of coordinates with no space between, such as -33.8346756,151.1904268<\/span> <\/li>\n<\/ul>\n\n\n\n<p>Then, go to your WordPress admin dashboard and click on the <b>\u201cCustom Fields\u201d<\/b> item from the left side menu:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf6.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open your \u201cAdvanced Custom Fields\u201d dashboard. Look for the <b>\u201cField Group\u201d<\/b> you want to add the custom field(s) to. When you have found it, hover over it and click on the <b>\u201cEdit\u201d<\/b> option that appears:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/newacf.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>\u00a0<b>Note:<\/b> <i>If you did not create a \u201cField Group\u201d in your \u201cAdvanced Custom Fields\u201d dashboard yet, follow the steps from <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-custom-fields-using-the-advanced-custom-fields-plugin\/\" target=\"_blank\" rel=\"noopener\">this article<\/a> to create one, and add the fields you would like in it.<\/i><\/p>\n\n\n\n<p>After you click on the &#8220;Edit&#8221; button, the editing page of the \u201cField Group\u201d opens. Click on the <b>\u201cAdd Field\u201d<\/b> button from it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf9.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>The drop-down section where you can set up and add the field will open. The first thing you have to do is to add a <b>\u201cField Label\u201d<\/b> and a <b>\u201cField Name\u201d<\/b> for your new field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes1.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>These will help you find the custom field more easily. Complete the \u201cField Label\u201d with the label\/name you want the new field to have.<\/p>\n\n\n\n<p>Then, if you click anywhere outside the field, you will see that the \u201cField Name\u201d will also be completed automatically, with the computer version of the label you have entered. Here is an example:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes2.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Then comes the main focus of this article: <b>setting up the type of the new field<\/b> you are adding.<\/p>\n\n\n\n<p>You can do this in the \u201cField Type\u201d section. By default, the \u201cText\u201d field type is selected here.<\/p>\n\n\n\n<p>Click on the field with it, from the <b>\u201cField Type\u201d<\/b> section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes3.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open a drop-down list with various field types you can choose from:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/select-custom-field-type.png\" alt=\"\" class=\"wp-image-113473855\"\/><\/figure><\/div>\n\n\n<p>Select the type of custom field you want to have from here and set it up as follows:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"1-text-field-type\">1. \u201cText\u201d field type<\/h4>\n\n\n\n<p>You will be able to use a \u201cText\u201d custom field with the dynamic option of the \u201cText\u201d element in Thrive Architect. If you want the custom field you add to be the \u201cText\u201d type, click on <b>\u201cText\u201d<\/b> from the drop-down list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf47.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Then, below the \u201cField Type\u201d section you will have various sections with more <b>options\/settings<\/b> for this field type:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes6.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>These options\/settings can be used to customize the \u201cText\u201d custom field you are about to add. Here are details about each of them:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"instructions\">Instructions<\/h4>\n\n\n\n<p>This section is useful if you want to <b>give\/leave instructions<\/b> regarding how to use this custom field, for the authors of your website. Complete the \u201cInstructions\u201d section with the text you want:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes7.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Then, the instructions you completed here will be displayed, whenever someone will want to assign a value for the custom field.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"required\">Required<\/h4>\n\n\n\n<p>The next setting is the \u201cRequired\u201d setting. This is a simple one. You can select whether you want the custom field <b>to be required or not<\/b>. By default, the custom fields are set not to be required:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes8.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>However, if you want the field to be required, simply <b>click on the box<\/b> from the \u201cRequired\u201d section and the field will be a required one. This is also shown by the \u201cYes\u201d that will appear here:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes9.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Keep in mind, that if you set a field to be required, it will be mandatory to assign a value for it, before being able to save\/update a post\/page in the WordPress editor.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"default-value\">Default Value<\/h4>\n\n\n\n<p>Just as its name says, you can <b>enter a default value<\/b> in the \u201cDefault Value\u201d section, like this:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes10.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>If you do this, the custom field will not appear empty, later on, when you want to assign a value for it, in the WordPress editor, but instead, it will display the default value:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes11.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Nevertheless, in order to be able to properly use the custom field, you will have to delete this default value and replace it with the actual value you want to assign to the custom field, in the WordPress editor.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"placeholder-text\">Placeholder Text<\/h4>\n\n\n\n<p>The \u201cPlaceholder Text\u201d option allows you to add a text that will stay as <b>an example text<\/b> in the custom field, it will be a placeholder, until you assign the actual content, the value for the custom field.<\/p>\n\n\n\n<p>Simply <b>enter the text<\/b> that you want as a placeholder in the field from this section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes12.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This way, when you will want to assign a value for the custom field for a specific post\/page, you will see the placeholder text first in the \u201cWordPress editor:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes13.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p><b>Note:<\/b> <i>The \u201cPlaceholder Text\u201d will only appear when no values (including a default value) exist for the custom field.<\/i><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"prepend--append\">Prepend &amp; Append<\/h4>\n\n\n\n<p>These settings can be used to <b>add a visual text<\/b> before (\u201cPrepend\u201d) or after (&#8220;Append\u201d) the custom field. You can enter these texts in the designated fields from these sections:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes14.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>The \u201cPrepend\u201d and the \u201cAppend\u201d settings work the same way, the only difference being that the \u201cPrepend\u201d will appear before the custom field, and the \u201cAppend\u201d will appear after the custom field, when you will assign a value to the field, for posts\/pages in the WordPress editor:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/prepend-append-example.png\" alt=\"\" class=\"wp-image-113473857\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"character-limit\">Character Limit<\/h4>\n\n\n\n<p>This setting allows you to <b>limit the number of characters<\/b> for the custom field. If this is something that you want to set, then enter the limit number in the field from the \u201cCharacter Limit\u201d section of the settings:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes16.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After you set this up, it will not be possible to assign a value with a greater character number than the one you defined for the custom field.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"conditional-logic\">Conditional Logic<\/h4>\n\n\n\n<p>You can enable this setting if you want to <b>customize the logic<\/b> behind when this custom field will be displayed. In order to do that, click on the box from this section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes17.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once you do that, more settings will appear and you can use them to <b>create rules<\/b> that determine when the custom field is visible. You can set up one or more rule here, on an \u201cand\u201d or an \u201cor\u201d basis, using the different drop-downs, as well as the <b>\u201cand\u201d<\/b> and the <b>\u201cAdd rule group\u201d<\/b> buttons:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/add-custom-field-rule-group.png\" alt=\"\" class=\"wp-image-113473858\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"wrapper-attributes\">Wrapper Attributes<\/h4>\n\n\n\n<p>Last, but not least the \u201cWrapper Attributes\u201d section can be used to define <b>a width<\/b>, <b>a class,<\/b> and <b>an ID<\/b>, in order to create a wrapping element for the field. This way, you will have more control over the layout of the field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/wrapper-attributes-custom-field.png\" alt=\"\" class=\"wp-image-113473859\"\/><\/figure><\/div>\n\n\n<p>These wrapper attributes are specific to the backend display of the fields. You can define these attributes in the designated fields from the \u201cWrapper Attributes\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/define-width-class-id.png\" alt=\"\" class=\"wp-image-113473860\"\/><\/figure><\/div>\n\n\n<p>You are welcome to use these options\/settings if you wish, but it is not mandatory to do so.<\/p>\n\n\n\n<p>Some of these settings are <b>general<\/b> and will be available for every field type you set up for a &#8220;Field Group&#8221;.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"2-url-field-type\">2. \u201cURL\u201d field type<\/h4>\n\n\n\n<p>The \u201cURL\u201d field type is useful, if you will want to use this custom field as a hyperlink on your website, or if you want to use the custom field as the link for a video on your website. In order to add a \u201cURL\u201d custom field type, click on the <b>\u201cURL\u201d option<\/b> from the \u201cField Type\u201d drop-down list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes22.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Then, you will see the settings related to this field type appear in the sections below the \u201cField Type\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes24.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>All of these settings are the same ones as described <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-the-specific-types-of-advanced-custom-fields-needed-for-thrive-architect-elements\/#tve-jump-170fc0a9d53\" target=\"_blank\" rel=\"noopener\">above<\/a>, in the case of the \u201cText\u201d field type, therefore, you can use them in <b>the same way<\/b>.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"3-image-field-type\">3. \u201cImage\u201d field type<\/h4>\n\n\n\n<p>If you will want to use a custom field with image values, you need to add an \u201cImage\u201d field type to your \u201cField Group\u201d. For that, select the <b>\u201cImage\u201d type<\/b> option from the \u201cField Type\u201d drop-down list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes23.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once you do that, you will see the settings that you can use for the \u201cImage\u201d custom field type, in the sections below the \u201cField Type\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/image-custom-field-settings.png\" alt=\"\" class=\"wp-image-113473862\"\/><\/figure><\/div>\n\n\n<p>Some of these settings are the same ones as described <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-the-specific-types-of-advanced-custom-fields-needed-for-thrive-architect-elements\/#tve-jump-170fc0a9d53\" target=\"_blank\" rel=\"noopener\">above<\/a> for the \u201cText\u201d field type, so you can use them the same way. There are, however, other settings as well here which are <b>specific to the \u201cImage\u201d<\/b> field type. Here is how you can use these specific ones:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"return-format\">Return Format<\/h4>\n\n\n\n<p>With this setting, you can choose what format the returned data from this custom field should be. You can choose between <b>\u201cImage Array\u201d<\/b>, <b>\u201cImage URL\u201d<\/b> and <b>\u201cImage ID\u201d<\/b>. Simply click on the one you want to use from the \u201cReturn Format\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes26.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"preview-size\">Preview Size<\/h4>\n\n\n\n<p>This setting refers to the size that the value (the image) will be displayed at when you assign it to the \u201cImage\u201d field type while editing in WordPress.<\/p>\n\n\n\n<p>By default, the \u201cMedium (300 x 300)\u201d size is set here. If you want to change this, click on the field with this size from the \u201cPreview Size\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes27.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open a drop-down with various image sizes. <b>Click on the one you want<\/b> to use and it will be selected:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes28.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"library\">Library<\/h4>\n\n\n\n<p>If you want to <b>limit the file selection<\/b>, when assigning values to the \u201cImage\u201d custom field type, use the \u201cLibrary\u201d setting. There are two options you can use from here. In order to select one, simply click on it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes29.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<ul class=\"wp-block-list\">\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">If you select the <\/span><b>\u201cAll\u201d<\/b><span style=\"font-weight: var(--g-regular-weight, normal);\"> option, you will be able to choose an image from all the images that were uploaded in the Media Library, as the value for the field<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">If you select the <\/span><b>\u201cUploaded to post\u201d<\/b><span style=\"font-weight: var(--g-regular-weight, normal);\">, then only the images that were uploaded to the specific page\/post, you will be editing in WordPress, will be available as possible values for the field.<\/span> <\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"minimum-and-maximum\">Minimum and Maximum<\/h4>\n\n\n\n<p>The \u201cMinimum\u201d and \u201cMaximum\u201d settings refer to <b>restrictions<\/b> you can set up when it comes to the <b>width<\/b>, <b>height,<\/b> and <b>file size<\/b> of the image that will be the value of this \u201cImage\u201d custom field.<\/p>\n\n\n\n<p>In the \u201cMinimum\u201d section you can set up a specific width and height in pixels, as well as specific file size in megabytes that will be the minimum requirement for the image that will be assigned for the \u201cImage\u201d field.<\/p>\n\n\n\n<p>In the \u201cMaximum\u201d section you can define the maximum width, height (in pixels), and file size (in megabytes) for the image that will be assigned for the \u201cImage\u201d field.<\/p>\n\n\n\n<p>In order to define these values, you just have to enter them in the corresponding fields of the \u201cMinimum\u201d and \u201cMaximum\u201d sections:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/min-max-width-height-size.png\" alt=\"\" class=\"wp-image-113473866\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"allowed-file-types\">Allowed file types<\/h4>\n\n\n\n<p>If you want to <b>limit the file types<\/b> that will be used for the \u201cImage\u201d field you are setting up right now, then you should complete the field from the \u201cAllowed file types\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes31.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Simply enter the file types you want to allow separated by commas.<\/p>\n\n\n\n<p><b>Note:<\/b> If you do not want to specify file types here, then leave the field blank. This will mean that all file types are allowed.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"4-number-field-type\">4. \u201cNumber\u201c field type<\/h4>\n\n\n\n<p>In case you want to add a \u201cNumber\u201d custom field type (this can be used with more Thrive Architect elements, like the \u201cProgress Bar\u201d, \u201cStar Rating\u201d and the \u201cFill Counter\u201d elements), then you should select the <b>\u201cNumber\u201d type<\/b>, from the \u201cField Type\u201d drop-down list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes32.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After you select the \u201cNumber Type\u201d, you will see all the settings related to this field type, in the sections below the \u201cField Type\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/Edit-Field-Group-E2-80-B9-My-Blog-E2-80-94-WordPress.jpg\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Most of these settings are the general settings that you can use the same way as described above for the \u201cText\u201d field type. There are, however, three different settings here as well. These are <b>specific for the \u201cNumber\u201d field<\/b> type and you can use them as follows:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"minimum-value-and-maximum-value\">Minimum Value and Maximum Value<\/h4>\n\n\n\n<p>These two settings let you define a minimum and a maximum numeric value for the field. The default \u201cMinimum Value\u201d is 0 and the default \u201cMaximum Value\u201d is 100.<\/p>\n\n\n\n<p>If you want to specify a different \u201cMinimum\u201d and \u201cMaximum Value\u201d for the \u201cNumber\u201d field you are setting up, then simply <b>enter the values<\/b> you want in the corresponding fields, from these sections:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes33.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This way, while editing pages\/posts in WordPress, no smaller number than the \u201cMinimum Value\u201d, and no higher number than the \u201cMaximum Value\u201d, will be allowed to be assigned as the actual number for this \u201cNumber\u201d custom field.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"step-size\">Step Size<\/h4>\n\n\n\n<p>The \u201cStep Size\u201d setting allows you to specify the increment value at which a numeric value can be set. The default \u201cStep Size\u201d is 1, if you want to change this, <b>enter or select <\/b>a different value in the \u201cStep Size\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes34.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"5-file-field-type\">5. \u201cFile\u201d field type<\/h4>\n\n\n\n<p>In case you will want to display a video, or an audio file with your custom field, you need the custom field to be the \u201cFile\u201d type. In order to have that, select <b>\u201cFile\u201d<\/b> from the \u201cField Type\u201d drop-down list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes42.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After you select the \u201cFile\u201d type, you will have the option of customizing the field, using the settings from the sections that appeared below the \u201cField Type\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/newfiletype.jpg\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Some of these settings are the general ones, which you can use the same way as detailed above for the \u201cText\u201d field type.<\/p>\n\n\n\n<p>Furthermore, you will also see other settings that are <b>specific to the \u201cFile\u201d<\/b> custom field type. Here are the details about how to use these:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"return-value\">Return Value<\/h4>\n\n\n\n<p>This setting allows you to define what format the returned data from this custom field (meaning the value you will assign to it) should be.<\/p>\n\n\n\n<p>In order to choose a format, click on it from the \u201cReturn Value\u201d section. You can select <b>\u201cFile Array\u201d<\/b>, <b>\u201cFile URL\u201d<\/b> or <b>\u201cFile ID\u201d<\/b>:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes43.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"library\">Library<\/h4>\n\n\n\n<p>With this setting you can <b>limit the selection<\/b> that is available when you assign a value to the field in the WordPress editor:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes44.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<ul class=\"wp-block-list\">\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">You can either leave the <\/span><b>\u201cAll\u201d<\/b><span style=\"font-weight: var(--g-regular-weight, normal);\"> option selected in the \u201cLibrary\u201d section, which means that you will have the possibility to choose any file from the ones uploaded in the Media Library, as the value for the field.<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">Or you can click on the <\/span><b>\u201cUploaded to post\u201d<\/b><span style=\"font-weight: var(--g-regular-weight, normal);\"> option to select it. This means that only the files that were uploaded specifically to the page\/post (which you will be editing in WordPress), will be available as possible values for the field.<\/span> <\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"minimum-and-maximum\">Minimum and Maximum<\/h4>\n\n\n\n<p>The \u201cMinimum\u201d and \u201cMaximum\u201d settings allow you to <b>limit the size<\/b> of the files that will be assigned as values for your \u201cFile\u201d field.<\/p>\n\n\n\n<p>If this is what you want to do, simply enter in the corresponding fields, the values (in megabytes) that you want the minimum and the maximum sizes allowed for this \u201cFile\u201d field to be:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes45.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"allowed-file-types\">Allowed file types<\/h4>\n\n\n\n<p>If you want to <b>limit the file types<\/b> that can be assigned as the value for the \u201cFile\u201d field, then use the \u201cAllowed file types\u201d setting. Just enter the file types you want to allow, separated by commas, in the field from the \u201cAllowed file types\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes46.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>If you leave this section empty, it will be possible to choose any file type as the value for the &#8220;File&#8221; field.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"6-date-time-picker-field-type\">6. \u201cDate Time Picker\u201d field type<\/h4>\n\n\n\n<p>If you will want to display a date and a time (for e.g. while using the \u201cCountdown\u201d element) with your custom field, then you should pick the <b>\u201cDate Time Picker\u201d<\/b> from the \u201cField Type\u201d drop-down list. You have to scroll down a little, to see it in the list:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes35.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once you have chosen this field type, you will see its settings in the sections below the \u201cField Type\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes36.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>The majority of these settings are general settings. You can use these the same way as detailed for the \u201cText\u201d field type above. Nevertheless, there are also three settings here that are <b>specific for the \u201cDate Time Picker\u201d<\/b>. Here is how you can use them:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"display-format\">Display Format<\/h4>\n\n\n\n<p>The \u201cDisplay Format\u201d setting lets you choose a <b>date and time format<\/b> for the field you are setting up now. The format you select here will be used when you will assign a value (select a date and time) for the custom field in your WordPress editor.<\/p>\n\n\n\n<p>In order to select a format just click on it from the \u201cDisplay Format\u201d section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes37.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"return-format\">Return Format<\/h4>\n\n\n\n<p>The \u201cReturn Format\u201d refers to the format that <b>will be returned<\/b> when the value of the \u201cDate Time Picker\u201d will be loaded (in our case, when you will use the custom field with the Thrive Architect elements).<\/p>\n\n\n\n<p>Click on the format you prefer from the \u201cReturn Format\u201d section in order to select it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes38.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"week-starts-on\">Week Starts On<\/h4>\n\n\n\n<p>The \u201cWeek Starts On\u201d setting is very self-explanatory. Here you can set <b>on which day<\/b> will the week start for this \u201cDate Time Picker\u201d field.<\/p>\n\n\n\n<p>By default, this is set to Monday. If you want to change this, first click on the field with \u201cMonday\u201d in it, from this section:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes39.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open a drop-down with the days of the week. <b>Click on the one you want<\/b> to use and it will be selected:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes40.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After you have finished setting up any (or all) of these six custom field types, you can click on the <b>\u201cClose Field\u201d<\/b> button from the \u201cAdd Field\u201d drop-down:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf14.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Add as many custom fields as you need. Then, you can also revise the other aspects of the \u201cField Group\u201d, if needed. When you have finished, don\u2019t forget to save the changes you made for the group, by clicking on the <b>\u201cUpdate\u201d<\/b> button from the upper-right part of the page:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes41.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<h4 class=\"wp-block-heading\" id=\"assign-value-to-the-custom-fields\">Assign value to the custom fields<\/h4>\n\n\n\n<p>Once you have set up &amp; added the different types of custom fields to your \u201cField Group\u201d, you will need to <b>assign values<\/b> to the fields for each post\/page you will want to use them on.<\/p>\n\n\n\n<p>Click on the <b>\u201cPosts\u201d<\/b> or <b>\u201cPages\u201d<\/b> item from the left side menu of your WordPress admin dashboard:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf22-1.png\" alt=\"\"\/><\/figure><\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf23.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once there, look for the post or page, you want to display the custom fields on. When you found it, hover over it and click on the <b>\u201cEdit\u201d<\/b> option that appeared below it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf24.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open the WordPress editor, where you can assign the values to the custom fields for the particular post\/page you have chosen to edit. The <b>\u201cField Group\u201d<\/b> containing the custom fields you have set up should appear <b>below the editing option<\/b> of the post\/page:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes47.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p><b>Note:<\/b> <i> In case you do not see the \u201cField Group\u201d with the fields you have set up, check the \u201cLocation\u201d rules of the \u201cField Group\u201d, to make sure the post\/page you are editing meets them. If you need details on how to define the \u201cLocation\u201d of a \u201cField Group\u201d, please check out <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-custom-fields-using-the-advanced-custom-fields-plugin\/#tab-con-9\" target=\"_blank\" rel=\"noopener\">this article<\/a>.<\/i><\/p>\n\n\n\n<p>Here is how you can assign values to the six field types we have described, that you need for the compatible Thrive Architect elements:<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"1-text-field-type\">1. \u201cText\u201d field type<\/h4>\n\n\n\n<p>If you have set up a \u201cText\u201d type of custom field, you can easily assign a value to it. Look for the \u201cText\u201d custom field, while editing the post\/page and when you have found it, simply <b>enter the text<\/b> you want as its value, in the field below the name of the \u201cText\u201d custom field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes48.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<div class=\"intercom-container intercom-align-center\"><\/div>\n\n\n\n<p>The text you add here as the value will be displayed every time you will use this custom field, with compatible elements, while editing this post\/page with Thrive Architect.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"2-url-field-type\">2. \u201cURL\u201d field type<\/h4>\n\n\n\n<p>The \u201cURL\u201d custom field works similarly to the \u201cText\u201d custom field. You can <b>enter the URL<\/b> that you want as this field\u2019s value, in the field below the name of the \u201cURL\u201d custom field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes49.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once you do this:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">the URL you add here will be displayed every time you will use this \u201cURL\u201d custom field as a hyperlink while editing this post\/page with Thrive Architect;<\/span> <\/li>\n\n\n\n<li> <span style=\"font-weight: var(--g-regular-weight, normal);\">or if you add the URL of a video here, that video will be displayed if you use this &#8220;URL&#8221; custom field as the dynamic source for the &#8220;Video&#8221; element, while editing this post\/page with Thrive Architect.<\/span> <\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"3-image-field-type\">3. \u201cImage\u201d field type<\/h4>\n\n\n\n<p>You can assign a value to an \u201cImage\u201d custom field by using the <b>\u201cAdd Image\u201d<\/b> button that appears below the name of the field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes50.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>When you click on this button your Media Library will open. You can either <b>select an image<\/b> that is already uploaded to the library, by clicking on it; or you can use the <b>\u201cUpload Files\u201d<\/b> tab to upload the image first, and then click on it to select it.<\/p>\n\n\n\n<p>After you have chosen the image, click on the <b>\u201cSelect\u201d button<\/b>, from the bottom right corner of the Media Library:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf29.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Doing this will add the selected image as the value for your custom field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes51.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This way, whenever you will use this \u201cImage\u201d custom field in the Thrive Architect editor, with the compatible elements, this image will be displayed.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"4-number-field-type\">4. \u201cNumber\u201c field type<\/h4>\n\n\n\n<p>Assigning a value to a \u201cNumber\u201d custom field type can also be done easily. Just look for the \u201cNumber\u201d custom field, and when you found it, <b>complete the field<\/b> below its name with the number you want as its value:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes52.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Once this is done, the number you have entered here will be displayed, whenever you will use this \u201cNumber\u201d custom field on this post\/page with the compatible Thrive Architect elements.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"5-file-field-type\">5. \u201cFile\u201d field type<\/h4>\n\n\n\n<p>You can assign a value to the \u201cFile\u201d custom field type similar to how values can be assigned to an \u201cImage\u201d field type. The only difference being that instead of an image, you need to select a file as the value.<\/p>\n\n\n\n<p>Look for the \u201cFile\u201d custom field you have previously set up. When you have found it, click on the <b>\u201cAdd File\u201d<\/b> button that appears below it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes53.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open your Media Library. You can select the file you want from there by <b>clicking on it<\/b>, or you can <b>upload it first<\/b>, with the options from the \u201cUpload Files\u201d tab, and then click on it to select it.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p><b>Note:<\/b> <i>Depending on how you have previously set up the \u201cAllowed file types\u201d for this \u201cFile\u201d custom field, it may happen that not all files from your Media Library will be accessible here, and you will not be able to add some of them as the value for this field.<\/i><\/p>\n\n\n\n<p><i>Such files will be greyed out in your library. Furthermore, if you will try to select such a file that has a type that is not allowed, you will see an error message in the upper right corner of the Media Library:<\/i><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/file-type-error.png\" alt=\"\" class=\"wp-image-113473869\"\/><\/figure><\/div>\n\n\n<p><i>If this happens, you can either look for another file that has an allowed type for this \u201cFile\u201d custom field, or you can go back to the \u201cField Group\u201d and change the <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-set-up-the-specific-types-of-advanced-custom-fields-needed-for-thrive-architect-elements\/#tab-con-28\" target=\"_blank\" rel=\"noopener\">\u201cAllowed file types\u201d<\/a> setting for the respective \u201cFile\u201d custom field.<\/i><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p>After you have chosen the file in the Media Library, click on the <b>\u201cSelect\u201d<\/b> button, that appeared in the bottom-right corner, to add it as the value of this field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2024\/04\/select-media-file.png\" alt=\"\" class=\"wp-image-113473870\"\/><\/figure><\/div>\n\n\n<p>Once done, the added file will be the value for this \u201cFile\u201d custom field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes56.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>Therefore, this is the file that will be displayed when you will use the \u201cFile\u201d custom field with the compatible elements while editing this post\/page with Thrive Architect.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"6-date-time-picker-field-type\">6. \u201cDate Time Picker\u201d field type<\/h4>\n\n\n\n<p>In order to add a date and a time as the values for your \u201cDate Time Picker\u201d field, look for the respective field and when you found it <b>click in the field below<\/b> its name:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes57.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This will open a pop-up where you can select the date, as well as the time, you want as the values for the field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes58.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p><b>Choose the date and the time<\/b> from the pop-up and when you are done, click on the <b>\u201cDone\u201d<\/b> button from it:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes59.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After you do that, the date and time you have chosen will be added as the values for this field:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/fieldtypes60.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>This means that this date and time will be displayed, whenever you will use the \u201cDate Time Picker\u201d field with compatible elements while editing this post\/page with Thrive Architect.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"update-the-postpage\">Update the post\/page<\/h4>\n\n\n\n<p>After you have finished assigning values to your custom fields, you need to update the post\/page you are working on, in order to save the assigned values. To do that, click on the <b>\u201cUpdate\u201d<\/b> button, from the upper-right corner of the WordPress editor:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/mlpxhq8ztvyc.i.optimole.com\/cb:p0Z2.44bbf\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/thrivethemes.com\/wp-content\/uploads\/2023\/12\/acf32.png\" alt=\"\"\/><\/figure><\/div>\n\n\n<p>After all of this is done, the custom fields and their values will be saved for the respective post\/page.<\/p>\n\n\n\n<p>Nevertheless, they will only be available for this post\/page.<\/p>\n\n\n\n<p>If you will want to use the custom fields on other posts\/pages too, then, you have to <b>repeat these steps<\/b> and assign values for the custom fields separately for each of those posts\/pages as well.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"use-the-custom-fields-with-thrive-architect-elements\">Use the custom fields with Thrive Architect elements<\/h4>\n\n\n\n<p>After you have finished assigning values to the different custom field types, these will become <b>available<\/b> when editing your posts\/pages with Thrive Architect.<\/p>\n\n\n\n<p>You will be able to use and display them with the <b>\u201cDynamic\u201d option<\/b> of the compatible elements. If you require detailed information on how to do this, check out our separate article about it <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/tkb_item\/how-to-use-fields-setup-with-the-advanced-custom-fields-plugin-in-thrive-architect\/\" target=\"_blank\" rel=\"noopener\">here<\/a>.<\/p>\n\n\n\n<p>In case you want to find out how other features and options in Thrive Architect work, don&#8217;t forget to also check out our knowledge base <a class=\"intercom-content-link\" href=\"https:\/\/thrivethemes.com\/thrive-knowledge-base\/\" target=\"_blank\" rel=\"noopener\">here<\/a>.<\/p>\n\n\n\n<p>Hopefully, this article was useful for you. If so, please reward it with a smile below \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"<p>There are six specific custom field types that you may need to set up, depending on which compatible Thrive Architect element you want to use them with. These custom field types are the following: Before being able to use custom fields, when editing your pages\/post with Thrive Architect, you will need to: \u2192 Add these [&hellip;]<\/p>\n","protected":false},"author":253020,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"ht-kb-category":[34093],"ht-kb-tag":[],"class_list":["post-113456979","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-integration-with-third-party-tools","post-wrapper","thrv_wrapper"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/ht-kb\/113456979","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/users\/253020"}],"replies":[{"embeddable":true,"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/comments?post=113456979"}],"version-history":[{"count":0,"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/ht-kb\/113456979\/revisions"}],"wp:attachment":[{"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/media?parent=113456979"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/ht-kb-category?post=113456979"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/thrivethemes.com\/wp-json\/wp\/v2\/ht-kb-tag?post=113456979"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}