Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save ipokkel/170c20ff3968799ffb0fd105ab990f27 to your computer and use it in GitHub Desktop.
Save ipokkel/170c20ff3968799ffb0fd105ab990f27 to your computer and use it in GitHub Desktop.
Example jQuery JavaScript to move a custom user field to after the email field(s) on the checkout page.
<?php
/**
* Moves a custom user field after the email fields using JavaScript.
*
* You can add this recipe to your site by creating a custom plugin
* or using the Code Snippets plugin available for free in the WordPress repository.
* Read this companion article for step-by-step directions on either method.
* https://www.paidmembershipspro.com/create-a-plugin-for-pmpro-customizations/
*/
function my_pmpro_move_user_field_to_account_information() {
// Only run on the checkout page.
if ( ! function_exists( 'pmpro_is_checkout' ) || ! pmpro_is_checkout() ) {
return;
}
?>
<script type="text/javascript">
jQuery(document).ready(function($) {
var fieldName = 'field_name_here'; // The name of the user field you want to move
var userField = $('#' + fieldName + '_div');
// Check if the userField exists
if (userField.length) {
// Look for the parent div containing email fields
var emailContainer = $('.pmpro_form_field-bemail').closest('.pmpro_cols-2');
// Check if the confirm email field exists
var confirmEmailField = $('.pmpro_form_field-bconfirmemail');
// If the email container exists, append website field after it
if (emailContainer.length) {
emailContainer.after(userField);
}
}
});
</script>
<?php
}
add_action( 'wp_footer', 'my_pmpro_move_user_field_to_account_information' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment