- This topic has 6 replies, 2 voices, and was last updated 2 days, 20 hours ago by
Peter.
-
AuthorPosts
-
February 11, 2025 at 4:20 AM #47637
John Connor
ParticipantI'm building a website that allows registered users to write reviews and shop. To enhance the user experience, I want to create a centralized 'My Account' page where users can edit all account details used on the site in one place. This includes custom user meta fields that is otherwise spread around, such as a custom avatar, bio, age, and length, weight, as well as WooCommerce-specific meta data like billing address details, shipping address details, billing email address.
The question is: how can I use Meta Box to do this? Where to start? What is the workflow, here?
I plan to use Meta Box to create the custom avatar field, following the guide provided here (https://metabox.io/create-custom-avatar/). I also do know that I will probably need to make a custom fields group and apply it to 'user' to create additional custom meta fields (e.g. bio, age, etc.) and then incorporate it to the central my account page. Lastly, I want WooCommerce's built-in user meta data to also be editable in this central 'My Account' page. How do I do that though? WooCommerce's default my-account page is so incredibly difficult to customize that I rather not touch it at all, and just create a my account page from scratch with Meta Box to be more flexible in design.
I am using Kadence Pro (theme and blocks).
Could you please provide guidance on how to use Meta Box to create a unified 'My Account' page that allows users to edit all their account details, including both custom and WooCommerce-specific meta data?
I am pulling my hair out at this point, so thank you so much for your advise.
February 12, 2025 at 11:07 PM #47644Peter
ModeratorHello John,
You can use the extension plugin MB User Profile to add a user profile form to a page and show a form to edit the user meta fields that are created by Meta Box plugin.
Please follow the documentation https://docs.metabox.io/extensions/mb-user-profile/And it doesn't support including the WooCommerce user meta fields in the user profile form. They have a different way to register the user meta field.
February 14, 2025 at 4:11 AM #47656ParticipantHi!
Thank you! I'd like to constructively explain why your Registration form, Login form and Edit Profile form is not yet the complete solution I would like it to be. If you address some issues it could work, so perhaps you would like to consider these feature requests?1) I see a Registration form, a Login form, and a Edit profile form. However, where is the Lost password form? Normally it is located at /wp-login.php?action=lostpassword. Without this option, the user will be facing a default WP screen sooner or later. How would I make a Lost password form? This is really missing from the list of MB User profile extension.
2) How do I use placeholder texts for input fields instead of label text for the input fields? It is available in the MB Builder when making a custom field group but I don't see this option in the settings list. Perhaps I am not understanding how to use it. Using placeholder texts is important because it reduces the clutter on the front-end a lot because the text is placed inside of the input field.
3) How do I send custom confirmation and notification messages? I don't see a way to do that for the Registration form, Login form and Edit profile form. What I do see is this: 'Confirmation text' setting, but it is unclear if and how I can style this confirmation setting? How to make this message look good? The ability to send good custom notification messages is super important because users must receive links to correct page which holds the login form and the forgot password form (the latter does not exist in MB User Profile.
I did read under 'Email templates' that 'the email templates from the MB User Profile's templates folder' must be copied 'to the mb-user-profile folder that you've just created' and then the new templates should be edited but I don't see these templates. Where exactly should I find them in my website directory?
4) The forms settings shows that Google reCaptcha site key (version 3) is supported. But Google's reCaptcha is not what I want to use. I want to avoid Google. What I like about Meta Box is that you support Open Street Maps in your custom fields group. I would like to make a feature request for you to support non-Google anti-spam measures, like Altcha and I know there is also Hcaptcha.
4) I see no way to require people to use a capital letter, small letter, number, and symbol in their password, and/or to require a minimum length for their password, and/or allowing a password that is only [n] characters long. These options are available in MB Builder as minLength and maxLength. Perhaps this feature can be added, too?
Looking forward to your message.
Warmly!February 14, 2025 at 5:28 AM #47658ParticipantOh, sorry. I forgot two more important things so I will continue my list:
5) I would like to be able to approve or decline a submission. In this way I can gatekeep who gets an account and who not. I don't see this as a setting in the documentation. Is this possible, though? If yes: How do I set that up? If not, please consider this a feature request for MB User Profile.
6) Superimportant! You said:
And it doesn't support including the WooCommerce user meta fields in the user profile form. They have a different way to register the user meta field.
Ah, really? That is so shitty of Woocommerce. It means I won't be able to have one centralised place where people can edit all of their account info. As I said, it is so hard to customize information about the customer that Woocommerce stores... . Can I use Meta Box in any other way to allow users to edit their Woocommerce user meta?
I ask because I had hoped it would be possible to make a custom fields group. In that field group, I would then make custom fields and assign an ID to them so that any info entered their would replace the data stored in the associated Woocommerce user meta. I would then show this custom fields group on the front-end using MB's Edit profile front-end form, and then I thought the data a user enters there would be synced up with Woocommerce user meta. Would this not work?Just to give one example: one of the user meta keys that Woocommerce uses is 'billing_phone', it uses it to store the phone number of the customer. Following my suggested workflow above, can't I just make a custom field with the ID 'billing_phone' and then show that on the front-end using the MB Edit profile form, so that users can then change it from the front-end through that form? This way I would not need the annoying Woocommerce My-account page to edit these sort of details, and I can just use MB's Edit profile as an alternative.
Please, any help/thinking along would be appreciated here. Quite desparate for a solution.
Warmly
February 14, 2025 at 11:20 PM #47665ModeratorHello,
1. The lost password form is available in the login form. Please check this screenshot https://imgur.com/q8Wnp8Z
2. If you use the builder, the placeholder option is available when you edit a
textfield, see this https://imgur.com/aGNe6Ba
if you don't see this option, what is the field type that you are using?3. If you want to send the notification message, you can use the action hook
rwmb_profile_after_process
following the documentation https://docs.metabox.io/extensions/mb-user-profile/#rwmb_profile_after_processIf you use the plugin Meta Box AIO, you can find the confirmation email template in
/wp-content/plugins/meta-box-aio/vendor/meta-box/mb-user-profile/templates/confirmation-email.php
https://imgur.com/aq5oxZJMeta Box supports a basic style and appearance for forms and emails. If you want to have pretty elements, you need to use custom code to style it.
4. Currently, Meta Box plugins don't support other capchas/anti-spam measures. There is a feature request to support hCaptcha in our backlog development and we will work on this for future updates.
5. You can use the custom attribute
patternto set up a validation for thepasswordfield. Please follow the documentation
https://docs.metabox.io/custom-attributes/
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/patternhowever, if you want to customize the
passwordfield of the MB User Profile, you need to create some custom code to override the settings of the field which is created in the code, not in the builder.6. Currently, there isn't an option to approve or decline a user register submission. I will inform the development team to consider supporting this feature in future updates.
7. Yes, it can work like that. You can create a field with the same ID, for example
billing_companyin a field group and add the field group ID to the user profile form so the user can update this field value in the frontend.February 17, 2025 at 8:52 PM #47672ParticipantDear Peter, I hope your weekend was fine. Thank you for responding. I am learning a lot and am still studying your answers. As time goes on, many more people will benefit from your reply. I do have some follow-up questions that have risen.
1. About the lost password form. You showed me that the lost password form is actually *part of* the login form itself. It shows when I click on 'lost password'. That does open up a lost password form. I have three questions about this lost password form:
1a: Can I make the 'lost password' link open the lost password form on a separate page of its own? I like to keep the login form and the lost password form on their own dedicated pages. Now it basically opens up underneath the login form but I don't want that.
1b: Clicking on the 'lost password' link not only shows the lost password form, but also adds '/?rwmb-lost-password=true' to the slug, so now I see 'https://mydomain.com/register/?rwmb-lost-password=true' in my web browser URL. Can I change this slug? I would like it to be something like '/lost-password'. That is way more understandable for my visitors. If so, where do I find the document to change this? I did a search on 'rwmb-lost-password' on the metabox.io site but could not find a reference.
1c: About customizing this lost password form: when I click on the 'lost password' link, the text appears: "Please enter your username or email address. You will receive a link to create a new password via email.". Can I change this text? And, better yet, disable it completely? I ask because I would rather write my own text above the form (am using Kadence). Also, the color of the text is #0c5460, and the color of the background is #d1ecf1, and the border color is #bee5eb. Can these be changed? If yes, how?2. Our second conversation was about how to use placeholder texts for input fields instead of label text for the input fields. You're obviously right: I can use place holder texts in the MB Builder (I use MB AIO lifetime). As a matter of fact, for testing purposes I just inserted a Meta Box: registration form block in my register page, and then also a custom fields group through the block settings (in other words, I added the field group id, which was 'personal-information', in the 'ID' settings box).
The problem is that the default Meta Box Register form already has a Username, Email, Password, and Confirm Password field. I can't edit these fields. Or at least: I don't know how to edit these fields. This leads me to the following two questions:
2a. How do I edit the default Register Form fields used by the Meta Box Registration Form block? From the documentation (https://docs.metabox.io/extensions/mb-user-profile/#default-form-fields) I know that I should use the filter$fields = apply_filters( 'rwmb_profile_register_fields', $fields );but I have a lot of trouble using this to make the default fields have no labels and only placeholder texts. How would I use this filter, and where should I put the final code snippet, in my child theme's functions.php?
2b: To edit the default registration form fields is one thing, but far better for me is to be able to change these fields, because I would wish the registration process for my users to be as frictionless as possible. I want them to only provide an email address, and then if they hit 'submit', an email would be sent their way with a link to set up a password for their account. This means that I need a registration form with only one form field: user_email. The placeholder text should be: 'email'. How do I do that?
2c: And, following up, how do I ensure that the notification email I send to the provided email address (after they pressed 'submit' on the registration form) contains a link where they can generate a password for their email?
2d: How to make it so that this generate password link, brings them to a generate password form that is NOT the default WP generate password form? Currently, I do not see a way for this to work with Meta Box. It is why I have trouble using it. This is essential for the registration process I envision for my site, but don't want my users to see anything that is default WP.3. Thank you for your response on my third question, Peter! I will need to study custom messaging a bit more.
4. Hcaptcha would be a good - and much needed - start. Consider Altcha, also. They are very privacy oriented and I think they are more aligned with you philosophically.
5. You wrote that I can use a custom attribute pattern to set up a validation for the password field. I think I will be able to manage that. But I am not sure why that would help. After all, you also wrote that custom code must be made to override the settings of the field which is created in the code. This is in essence what I want: I would like the password in the Registration form to have to meet certain criteria. It should have A minimum of 10 characters, at least one number, at least one lowercase letter, at least one uppercase letter. I know (kind of :)) how to do that in the MB builder, but ... and this brings be to
5a: How can I create the code so that the password field of the Registration form is only accepted when these criteria are met?
5b: A follow up question is: Obviously, it would be easier if I can just replace the default Password field of the Registration form, so if that is possible please do let me know how I do that.6. Thank you for considering adding a admin approval functionality. This would be amazing. It would be great if your developers could also allow for a notification to be send to the admin, and an option to send the user who wants to register an account a notification to inform them that the team is processing their request for an account. These messages should be easily customizable to be user-friendly.
7. I am very thankful about this answer. It means I have an outlook on creating an integrated my-account screen.
Peter, a word of thanks here. You and your team for your wonderful help so far. Forgive my questions: I am really trying to learn and it is really hard. Consider my questions an indication of where new users need your help. I hope you can use my questions to improve your product. Go Vietnam! Go team Meta Box!
February 18, 2025 at 10:52 PM #47680ModeratorHello,
1.
1a, 1b. No, there isn't an option to open the lost password form on a specific page and remove the parameter "rwmb-lost-password" from the URL.
1c. You can use the filter hook
rwmb_profile_lost_password_fieldsto change the text. Take a look at the functionget_lost_password_fields()to get more details.
For the color, you can create a custom CSS code to change it as I mentioned in another topic https://support.metabox.io/topic/how-to-customize-appearance-of-front-end-user-submission-form-using-kadence/#post-476602.
2a. You can refer to this topic to know how to use the filter hook https://support.metabox.io/topic/sort-the-username-and-email-fields/#post-24766
This is a standard feature of WordPress https://developer.wordpress.org/plugins/hooks/filters/2b, 2c, 2d. MB User Profile doesn't support this feature "an email would be sent their way with a link to set up a password for their account".
5. Check point 2a above to use the filter hook
rwmb_profile_register_fieldsto override default field settings. Here is an example:'password' => [ 'name' => __( 'Password', 'mb-user-profile' ), 'id' => 'user_pass', 'type' => 'password', 'required' => true, 'desc' => '<span id="password-strength" class="rwmb-password-strength"></span>', 'attributes' => [ 'pattern' => '^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[a-zA-Z\d]{10,}$' ] ],NOTE: please understand that, we don't support customization code for your specific needs. If you want to customize your site but don't know how to do that. We offer a customization service for an extra fee. Please contact us here for more details https://metabox.io/contact/
Thank you.
-
AuthorPosts
- You must be logged in to reply to this topic.