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 custom PMPro user field(s)s to after the email field(s) on the checkout page.
<?php
/**
* Moves custom PMPro user fields 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($) {
// Enter your user field names here.
var userFieldNames = ['mobile_phone', 'company_name'];
// Look for the parent div containing email fields.
// We assume the billing email field has class 'pmpro_form_field-bemail' and is within 'pmpro_cols-2'.
var emailContainer = $('.pmpro_form_field-bemail').closest('.pmpro_cols-2');
// Check if the confirm email field exists (currently unused but kept from original).
var confirmEmailField = $('.pmpro_form_field-bconfirmemail');
// If the email container exists, move the user fields to the account information section.
if (emailContainer.length) {
userFieldNames.reverse();
userFieldNames.forEach(function(fieldName) {
var userField = $('#' + fieldName + '_div');
if (userField.length) {
// Get the original parent fieldset before moving the field.
var originalFieldset = userField.closest('fieldset.pmpro_form_fieldset');
// Move the userField to be after the emailContainer.
emailContainer.after(userField);
// After moving, check if the originalFieldset is now empty of other user fields.
if (originalFieldset.length) {
var remainingFields = originalFieldset.find('.pmpro_form_fields div[class*="pmpro_form_field-"]');
if (remainingFields.length === 0) {
originalFieldset.remove();
}
}
}
});
}
});
</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