Hide Name and Email fields from User Profile block

Custom Coding
62

Agree that a temporary green button upon update is unclear. Not sure why a simple success message wasn’t deployed. Perhaps too many functions for this block to have a particular default message?

Since it’s been advised by Softr to use this block for onboarding after a user reaches it from the sign in with code block or magic link, can you please provide a code that simply removes the “Old password” field. Users haven’t entered a new password at this point in their journey, so it’s confusing when they see an “Old password” field. All they should see is the “New password” field.

63

Hey folks, I have some good news. We deployed an improvement to show a success message when updating the profile or changing the password on the User Profile block

64

I need a lot of help, I am trying to use the user profile block, because I need to update data quickly that affects the visibility of the components, the issue is that these fields were previously sent through a zappier cath and it is very slow, I used the option to show the information in tables and be able to view them but it doesn’t look good.

I have put the indicated code and it does not work, is there another alternative.

Thank you!!

65

Hi folks, have an updated code for this purpose. Place it in page settings → Custom code → Head, replace the BLOCKID with your actual block name, save and preview/publish

<script>
window.addEventListener('block-loaded-BLOCKID', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>
1 Like
66

I have tried the above code to hide the name and email field (only want the avatar field) but its not working.

<script>
window.addEventListener('block-loaded-user-accounts1', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#BLOCKID .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>
67

Hi @katedani looks like the 3rd blockid in your code is not replaced with user-accounts1

It should be like this:

<script>
window.addEventListener('block-loaded-user-accounts1', () => {
    setTimeout(()=>{
        if(document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder').length>2){
            let inputsToRemove = [...document.querySelectorAll('#user-accounts1 .wrapper-container>form .form-input-holder')].splice(0, 2);
            inputsToRemove.forEach((input)=>{
                input.remove();
            })
        }
    }, 200)
});
</script>
1 Like
68

Thank you!

1 Like
69

I know why you want this - same here. I just want to allow people to replace their image, not “add” a new image then the profile image will have multiples. Roll on better profile page. Desparately needed a profile page that can be altered, customised and add elements. Formatting (like centring etc)

70

Hey Folks!
A new user profile block is expected to be launched this quarter, stay tuned!

Best,

1 Like
71

Wow this is exciting as would have a great impact on customer experience :slight_smile:

72

@matthieu_chateau Does this script still work? I plugged it into the header, but no luck. Thank you!

73

Hi Brent!

Just to be sure, do you want to hide the upper part of the account form (name and email)?

74

FYI: yesterday I used this script to hide the first 2 form fields and that worked:

76

FYI:

I had a page with 2 forms (due to a tab container) and in order to hide the name and email fields in both forms I used this code in the header:
(created with help of AI)

<script>
function hideFirstTwoFields(formId) {
    setTimeout(() => {
        const formInputs = document.querySelectorAll(`#${formId} .wrapper-container > form .form-input-holder`);
        if (formInputs.length > 2) {
            let inputsToRemove = [...formInputs].splice(0, 2);
            inputsToRemove.forEach((input) => {
                input.remove();
            });
        }
    }, 200);
}

window.addEventListener('block-loaded-BLOCKID1', () => {
    hideFirstTwoFields('BLOCKID1');
});

window.addEventListener('block-loaded-BLOCKID2', () => {
    hideFirstTwoFields('BLOCKID2');
});
</script>