New to the community? Start here

How can I set up a pop-up account sign up & payment gateway similar to https://premium.wpmudev.o

Hello, I need some help with the membership 2 pro sign up process.

What I am trying to accomplish is very similar to https://wpmudev.com/#pricing … when you select a pricing option- a pop-up up appears with the signup form & payment gateway, which is exactly what my client needs!

Can you explain how something like is created/managed?? Also, I would love to integrate gravity forms and pop-up pro if possible.

Please view the memberships page: http://sitehubdevelopment.com/melfitness/customized-training/

and “signup” button … which right now when clicked takes you to an oddly formatted sign up form. At first I wanted to redirect users to this page- http://sitehubdevelopment.com/melfitness/sign-up/ … but couldn’t find a solution to do that.

Either solution would be very helpful, but speed is definitely a factor on this project. Also, one more question- is there a way I can change the text on the “signup” buttons??

Thanks for your help!

Wed, 24 Feb 2016 9:26:33
  • Predrag Dubajic
    • Support

    Hey Sean,

    Hope you’re doing well today :slight_smile:

    Using a popup on signup is something custom developed on our site and it’s not something that could be done with Membership 2 without some complex coding.

    Users can’t be redirected directly to that desired register page since the URL to each membership is unique, based on ID, so it needs to use M2 registration page.

    You can use CSS to customize M2 signup page and below I have added some code to help you get started with styling it similar to your current signup page:

    .ms-form-element.ms-form-element-last_name,
    
.ms-form-element.ms-form-element-first_name {
    
width: 50%;
    
}
    

    
.ms-form-element .wpmui-field-input {
    
width: 100%;
    
}
    

    
.ms-form-element .wpmui-field-input {
    
margin-top: 0;
    
margin-bottom: 0;
    
width: 40%;
    
height: 40px;
    
float: none;
    
margin-left: auto;
    
margin-right: auto;
    
display: block;
    
}
    

    
.ms-form-element.ms-form-element-first_name .wpmui-field-input {
    
float: right;
    
width: 38%;
    
}
    

    
.ms-form-element.ms-form-element-last_name .wpmui-field-input {
    
float: left;
    
width: 38%;
    
}
    

    
.ms-form-element.ms-form-element-first_name .wpmui-label-first_name {
    
text-align: right;
    
padding-right: 12%;
    
}
    

    
.ms-form-element.ms-form-element-last_name .wpmui-label-last_name {
    
text-align: left;
    
padding-left: 12%;
    
}

    Let us know if you need further help with this.

    Best regards,

    Predrag

  • Sean
    • WPMU DEV Initiate

    Oh great ! Thank you very much for taking the time to do that-

    I believe we won’t need anymore help here, but maybe WPMU can provide some documentation for that awesome membership pop-up some time soon! It really is awesome :thumbsup: :thumbsup:

    Thank you Predrag

    Best