Here is one way to add custom fields, to ultimate member account page. This is also applicable to custom created fields not just for ACF fields.
With the current Ultimate Member version 2.1.6, there is no way to add additional fields to the account page. But they do have hooks/actions to call for you to add your desired fields.
ACF – “Use the Advanced Custom Fields plugin to take full control of your WordPress edit screens & custom field data”. Check their plugin, it is very handy in adding multiple fields for specific posts, users, etc.
In this article, we will be using ACF’s fields to save and capture the user data that will be displaying at the account page.
Code
Before we do add the codes, please know that this code snippets can be added inside the functions.php file.
<?php
// action : um_after_account_general
// function name: account_additional_fields
add_action('um_after_account_general', 'account_additional_fields', 100);
?>
The code above is the action that we need to call for us to edit the fields that are being displayed at the account page. By the way, if you are using a class for your functions, you can use this:
<?php
// action : um_after_account_general
// function name: account_additional_fields
add_action('um_after_account_general', [$this,'account_additional_fields'], 100);
?>
Now we have to create the function that will return the html display.
<?php
function account_additional_fields(){
$custom_fields = [
"phone" => 'Phone',
"company" => 'Company',
"job_title" => 'Job Title',
];
foreach ($custom_fields as $k => $title) {
$fields[ $k ] = array(
'title' => $title,
'metakey' => $k,
'type' => 'select',
'label' => $title,
);
apply_filters('um_account_secure_fields', $fields, get_current_user_id());
$val = get_field($k, 'user_'.get_current_user_id() ) ? get_field($k, 'user_'.get_current_user_id() ) : '';
$html = '<div class="um-field um-field-text um-field-'.$k.' um-field-text um-field-type_text" data-key="'.$k.'">
<div class="um-field-label">
<label for="user_'.$k.'">'.$title.'</label>
<div class="um-clear"></div>
</div>
<div class="um-field-area">
<input class="um-form-field valid " type="text" name="'.$k.'" id="user_'.$k.'" value="'.$val.'" placeholder="'.$title.'" data-validate="" data-key="'.$k.'">
</div>
</div>';
echo $html;
}
}
?>
That’s all of the code lol. But let’s try to explain each lines. First is the $custom_fields.
<?php
$custom_fields = [
"phone" => 'Phone',
"company" => 'Company',
"job_title" => 'Job Title',
];
?>
This just lists the fields we wanted to add. The keys are the acf field keys or the meta keys if you are not using acf fields. The values are the titles of each fields.
Inside the foreach loop, we have the $fields declaration.
<?php
$fields[ $k ] = array(
'title' => $title,
'metakey' => $k,
'type' => 'select',
'label' => $title,
);
apply_filters('um_account_secure_fields', $fields, get_current_user_id());
?>
This part is very important, because we need to register the fields to the ultimate member secure fields. And the next line of code, the apply_filters, will do that.
<?php
$val = get_field($k, 'user_'.get_current_user_id() ) ? get_field($k, 'user_'.get_current_user_id() ) : '';
?>
The code above will only capture the value of what we want to display. Since we are using ACF, get_field is the function to do that.
The remaining codes are simply the html code to be displayed. You can change it however you want it.
In some cases, this do display the fields but when user updates the fields, it doesn’t save the values. So we have to be cautious and add another code to do that for us. The action to be used in this case is um_account_pre_update_profile
<?php
// action : um_account_pre_update_profile
// function name: account_additional_fields_update
add_action('um_account_pre_update_profile', 'account_additional_fields_update', 100);
?>
Inside our function is:
<?php
function account_additional_fields_update(){
$fields = ['company', 'phone','job_title'];
foreach( $fields as $f ){
update_field( $f, $_POST[$f], 'user_'.get_current_user_id() );
}
}
?>
The code is quite self explanatory, I guess. After the user profile has been updated, we update our custom fields.
Full codes
<?php
// action : um_after_account_general
// function name: account_additional_fields
add_action('um_after_account_general', 'account_additional_fields', 100);
function account_additional_fields(){
$custom_fields = [
"phone" => 'Phone',
"company" => 'Company',
"job_title" => 'Job Title',
];
foreach ($custom_fields as $k => $title) {
$fields[ $k ] = array(
'title' => $title,
'metakey' => $k,
'type' => 'select',
'label' => $title,
);
apply_filters('um_account_secure_fields', $fields, get_current_user_id());
$val = get_field($k, 'user_'.get_current_user_id() ) ? get_field($k, 'user_'.get_current_user_id() ) : '';
$html = '<div class="um-field um-field-text um-field-'.$k.' um-field-text um-field-type_text" data-key="'.$k.'">
<div class="um-field-label">
<label for="user_'.$k.'">'.$title.'</label>
<div class="um-clear"></div>
</div>
<div class="um-field-area">
<input class="um-form-field valid " type="text" name="'.$k.'" id="user_'.$k.'" value="'.$val.'" placeholder="'.$title.'" data-validate="" data-key="'.$k.'">
</div>
</div>';
echo $html;
}
}
// action : um_account_pre_update_profile
// function name: account_additional_fields_update
add_action('um_account_pre_update_profile', 'account_additional_fields_update', 100);
function account_additional_fields_update(){
$fields = ['company', 'phone','job_title'];
foreach( $fields as $f ){
update_field( $f, $_POST[$f], 'user_'.get_current_user_id() );
}
}
?>
Conclusion
This is an easy setup for adding new fields for the account page. You can pretty much do any additional field types. So go out and be happy! Char.
If this solution works for you, great! Press like? lol or share to your friends.
If you have a better solution, share it at the comments section below.
Cheers!
3 Comments
Rainer · March 8, 2021 at 5:51 pm
Hi!
Does this code also support to use user AFC Fields in Forms like the UM profile form to allow users to edit ACF fields?
I tried your code but it doesn’t seem to support this.
Davy Van Kerschaver · November 8, 2022 at 11:13 am
Hi,
Thanks for the code, it works very wel. The only thing that is missing is validation for the custom fields. Is that possible?
Kind regards
Davy
What is PHP? - Summary – Ryner World · March 31, 2024 at 11:49 am
[…] Codes to Add Additional ACF Fields to Ultimate Member Account […]