WP User Form Layout

  • Resolved Pattern Storm Designs

    (@pattern-storm-designs)


    3 years, 11 months ago

    Good day, please if anyone can assist or guide me. I’m just a beginner wp designer, and love UsersWP. I wanted to show our subscribers name when logged in, but the form was very bulky and took up lots of space. So I was able to make it work, I’m just stuck now. I cannot seem to get the Login button next to the form fields? And I dont know why the username and password are swopped around? But thats okay. Is there anyway that I can just get the login button to be smaller and next to the username field? Thank you so much for any advice or assistance. I really appreciate it.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Contributor Paolo

    (@paoltaia)

    3 years, 11 months ago

    Hi and thanks for using UWP,

    unfortunately, we cannot inspect the page.

    It looks like you are using something to prevent right-clicking.

    Please disable it and we will look into it.

    Thanks,

    Thread Starter Pattern Storm Designs

    (@pattern-storm-designs)

    3 years, 11 months ago

    Good day Paolo,

    Thank you for your reply. My apologies I did forget to turn off the right click function. I have disabled it now. Let me know. Thank you again for your help I really appreciate it.

    Plugin Support alexrollin

    (@alexrollin)

    3 years, 11 months ago

    First you need to remove the following CSS from your site which can be in Appearance->Customise->Additional CSS or somewhere else you have added as that is commonly applies to all our elements and floating the element to right.

    .bsui *, .bsui *::before, .bsui *::after {
    box-sizing: border-box;
    float: right;
}
Now try adding following CSS and let us know if it helps or not:
.uwp-login-form .form-group {flex: 1;}
form.uwp-login-form.uwp_form {
    display: flex;
}
form.uwp-login-form .btn.uwp_login_submit {
    flex: 1;
    margin: 0 0 0 10px !important;
    padding: 0px !important;
    width: auto !important;
    height: calc(1.6em + 0.9rem + 2px);
    font-size: 1rem;
    border-radius: 1.25rem;
}
@media only screen and (max-width: 767px) {
	form.uwp-login-form.uwp_form {
	    display: block;
	}
}
    Thread Starter Pattern Storm Designs

    (@pattern-storm-designs)

    3 years, 11 months ago

    Thank you Alex, you are an Angel! Let me do that and I will let you know.

    Thread Starter Pattern Storm Designs

    (@pattern-storm-designs)

    3 years, 11 months ago

    Alex you are the biggest Angel ever! Like Oh my gosh, its exactly how I visioned it! Wow! Thank you sooo much! Looks amazing! Cannot thank you enough! God bless!

    Plugin Support alexrollin

    (@alexrollin)

    3 years, 11 months ago

    Happy to help!

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘WP User Form Layout’ is closed to new replies.