Building a membership portal with membership2 pro

Hi,
I'm trying to build a video academy that can be accessible only for paid members (going to be a multisite. So, I'm thinking this is purely going to be a membership only page with login page as the homepage). I was wondering if it is possible to create a fronted login page (only for customers) that can be customized (redirects, backgrounds, look, feel etc). I understand that there are shortcodes, but is it possible to customise them? Also, when users are logged in, I want to redirect them to the course home page (not saying you are logged in as... like it does in the short code). Also, I'm confused about the registration process for members. I want to create a paid members only (recurring) website (users can't access if they don't pay). Is there a way to accept payments during the registration process itself? Or do they have to register and choose the package they want?

  • Kasia Swiderska

    Hello Senor Chavez,

    I was wondering if it is possible to create a fronted login page (only for customers) that can be customized (redirects, backgrounds, look, feel etc). I understand that there are shortcodes, but is it possible to customise them?

    Customization is possible with additional CSS and shortcode parameters. You can check parameters of login shortcode in Membership 2 -> Help -> Shortcodes

    If you are not familiar with CSS, we can help with that.

    Also, when users are logged in, I want to redirect them to the course home page (not saying you are logged in as... like it does in the short code).

    Membership 2 has add-on Redirect Control where you define your individual URL to display after a user is logged-in or logged-out.

    Also, I'm confused about the registration process for members. I want to create a paid members only (recurring) website (users can't access if they don't pay). Is there a way to accept payments during the registration process itself? Or do they have to register and choose the package they want?

    You can create direct registration for membership - so after user fill the registration form and click signup it will land on checkout page where they will do payment. So there will be no selecting memberships from list.
    That direct link can be created by using [ms-membership-buy id="48"] shortcode.
    You will find right shortcode for your membership on membership list

    Let me know if you have more questions.

    kind regards,
    Kasia

  • Senor Chavez

    Hi Kasia,

    Thank you so much for getting back to me! I would really love some assistance in creating the frontend customisation and the CSS ( I've used the ultimate branding plugin before. For some reason, I'm getting this error in the install: Installation of Ultimate Branding failed. Most likely reason for this are wrong folder permissions of your wp-contents folder.)
    Thank you so much for the clear explanations! I will test out the rest of the extensions and get back to you on that. Have a wonderful day!

  • Senor Chavez

    Hi Kasia,

    I had a chance to play around with the plugins. Here are my issues.

    P.S. To reiterate my plan, I'm trying to create a membership only website with the login page as the homepage

    1. If I use the shortcode to create a login page and make it as the home page. Then every time the members hovers back to the homepage, they will look at a page like the first screenshot (login.png)

    2. If I restrict access to all the pages, so that people can login through the protected content page(my website.com/protected-content), then I'm not able to customise it. It seems like it is a container inside the webpage. (Protected-Content.png)

    Both the solutions have varied problems. Is there a way redirect users to the link mywebsite.com/login if they have to login and mywebsite.com/protected-content if they do not have access to that particular content?

  • Senor Chavez

    Since I'm launching a beta version, I found a makeshift way to redirect the users from the login page using this shortcode:
    [ms-user="loggedin"] <meta http-equiv="refresh" content="0;URL=https://stanutley.wpengine.com/course-introduction"/>[/ms-user][ms-user type="guest"] [ms-membership-login] [/ms-user]
    I'm hoping to launch it ASAP and it would be really awesome if you could help me out soon Thank you so much!

  • Senor Chavez

    Hi Kasia Swiderska

    I was able to handle the issues with respect to the login! But the other membership2 pages look cluttered and not really good (except maybe the protected content page which I was able to change a little). I want to customise the buttons, the font, font size, the text color, etc., within the shortcodes) . I use Optimize press for page templates. I'm attaching screenshots of the pages. Please reply as soon as possible since we are running on crunch time. My website link is (it is still in production): stanutley.wpengine.com Thank you so much for your time and help.

  • Nithin

    Hi Senor Chavez,

    I was able to handle the issues with respect to the login! But the other membership2 pages look cluttered and not really good (except maybe the protected content page which I was able to change a little). I want to customise the buttons, the font, font size, the text color, etc., within the shortcodes) .

    Glad to know you figured out the issues with login, if I had missed out any specific question regarding this, please do point that out, and we'll make sure to get back to you on that asap.

    Regarding the Membership2 pages looking cluttered, it entirely depends upon one theme, to another. You'll have to include Custom CSS to make changes on how the pages look in your website.

    If you could be more specific like what color, font and size etc you are looking for, then we could provide the exact CSS, for the /register page, you might find the following CSS helpful:

    #register {
    
    	background: rgb(254,231,154);
    	background: -moz-linear-gradient(top, rgba(254,231,154,1) 0%, rgba(254,193,81,1) 100%);
    	background: -webkit-linear-gradient(top, rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
    	background: -o-linear-gradient(top, rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
    	background: -ms-linear-gradient(top, rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
    	background: linear-gradient(top, rgba(254,231,154,1) 0%,rgba(254,193,81,1) 100%);
    	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fee79a', endColorstr='#fec151',GradientType=0 );
    	-webkit-border-radius: 30px;
    	-moz-border-radius: 30px;
    	-ms-border-radius: 30px;
    	-o-border-radius: 30px;
    	border-radius: 30px;
    	-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
    	-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
    	-ms-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
    	-o-box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
    	box-shadow: 0 1px 0 rgba(255,255,255,0.8) inset;
    	border: 1px solid #D69E31;
    	color: #85592e;
    	cursor: pointer;
    	float: center;
    	font: bold 13px Helvetica, Arial, sans-serif !important;
    	height: 35px;
    	position: absolute;
    	text-shadow: 0 1px 0 rgba(255,255,255,0.5);
    	width: 150px;
    
    }
    
    .ms-form-element .wpmui-field-label {
    	color: black;
            font-size: 13px;
            font-family: "Times New Roman", Times, serif;
    }

    In the above given CSS, please change the color, font size, and font according to your needs. You might find the following helpful in changing fonts.

    Or did you meant how to make changes using optimizepress? OptimizePress seems to be a premium service, so I'm sure how that works. Could you please enable support access, so that we could have a better idea regarding how you are making use of this.

    Regarding the /membership page, could you please mention what are the exact style changes you are looking, so that we could provide exact CSS.

    You can add the above CSS code, using Custom CSS box(if your theme offers), or either using a Child theme, or add the CSS under the default WordPress customizer, under Appearance > Customize > Additional CSS.

    Please advise if I'm missing something here, let us know once you enable support access. Have a nice day.

    Best Regards,
    Nithin

  • Senor Chavez

    Hi Nithin!
    Thank you so much for the explanation! I have given support access so that you would be able to take a look at the situation. With respect to the customisations, I was able to take care of all the pages except the registration page. To give you a walkthrough, I created a new page using the optimize press live editor and added the shortcodes with the custom HTML/Shortcode widgets. After that I linked them to the Membership2 Pages in the settings --> general section of Membership2. After which, like you said, I added the the custom CSS codes. It seemed to work fine for all the pages except the registration page (CSS worked but look at the attached screenshot).
    Also with respect to the Membership list/Pricing table, I was wondering if you would be able to help with customising it to look like a pricing card rather that how it's laid out right now. This is how I envisioned it: https://stanutley.wpengine.com/membership-list/ It would be really awesome if you could help me out with these issues.

  • Rupok

    Hi Senor Chavez,

    It seemed to work fine for all the pages except the registration page (CSS worked but look at the attached screenshot)

    So sorry to hear the inconvenience. I went to the registration page on your site, but I could not see the registration form as shown in your screenshot. Rather, I'm seeing this:

    Am I missing anything there or you got it working by now?

    I was wondering if you would be able to help with customizing it to look like a pricing card rather that how it's laid out right now

    Sure. Can you please try the following custom CSS Code to make the membership list page showing like your provided example page?

    .ms-membership-details-wrapper {
      float: left;
      width: 31%;
      margin: 1%;
    }
    .ms-price-details {
      min-height: 300px;
    }
    .ms-top-bar {
      background: #0076ee none repeat scroll 0 0;
    }
    .ms-top-bar h4 {
      color: #fff;
      font-size: 15px;
      text-align: center;
    }
    .ms-form-price-boxes {
      text-align: center;
    }
    .ms-signup-button {
      margin: 0 42% !important;
    }
    .ms-price.price {
      font-size: 24px;
      font-weight: bold;
      margin-top: 25px;
    }

    You can add this to a theme's stylesheet, in a child theme, or using a plugin like Simple Custom CSS.

    Please let us know if you have any further query. We will be glad to help.

    Have a nice day. Cheers!
    Rupok

  • Senor Chavez

    Hi Rupok,

    Thank you so much for the pricing card CSS. That worked really well!

    So sorry to hear the inconvenience. I went to the registration page on your site, but I could not see the registration form as shown in your screenshot. Rather, I'm seeing this: .........
    Am I missing anything there or you got it working by now?

    Well, yes and no. Since we had to release the beta version, we just created the placeholder registration there. If you notice closely, the whole page looks like a container (with the registration form in the middle). It is because normal pages in optimize press inherits settings from it's posts. So, I want to edit it using the optimise press live editor (just like the other pages). But, if I do that, the registration page is duplicating itself (like the screenshot I posted in my last post).
    It would be really awesome if I can find a solution for this. Thank you so much! I really appreciate the help.

  • Rupok

    Hi Senor Chavez,

    Thanks for your detailed reply. I think I get the issue now. You are saying that when you create the registration page in the "OptimizePress > Create New Page" section, it shows the registration form elements twice and in a black background like your screenshot? But when you use native WordPress page, it shows in a container. Am I right?

    If yes, then I need to test this by changing your current registration page to a Live Editor page. I didn't do this because I don't know if your site is live or not and if I'm allowed to make those changes for testing. Testing this will take a couple of minutes but if this is a live site, then your users might have bad experience visiting that page. That's why I'm asking for confirmation.

    Is it okay if we do these tests on your site to find a solution? We will jump in as soon as you confirm.

    Have a nice day. Cheers!
    Rupok

  • Senor Chavez

    Hi Rupok,

    Yes! and the Black Background is the footer. Since the website is still in Beta, testing the website will not be a problem. So, please go ahead and do your testing.
    I also noticed one more thing. But, I'm not sure if this is an issue since I still haven't set up the payment gateway. After users register and choose their plan from the membership list ( One free and two paid plans), they are supposed to go to the thank you page (after the payment gateway in the paid plan). This works perfectly fine for the free plan (They sign up and go to the thank you page). But, In the paid plan, after choosing their package, they are directed to a join membership page which looks like the screenshot (again, the same duplication problem and it also has the exact same URL as the pricing plan/membership list page). Let me know if this is an issue or if it'll be resolved after setting up the payment gateway. Thank you so much!

  • Kasia Swiderska

    Hello Senor Chavez,

    I can see issue on your site. I have seen before similar problem with other site builder, but I need or coding experts to take a look on that on. Because OprimizerPress is not free theme so we don't have access to it could you send it to us for testing purposes? If yes could you please send in the following via our secure contact form https://premium.wpmudev.org/contact/ :

    - Mark to my attention, the subject line should contain only: ATTN: Kasia Swiderska
    - Do not include anything else in the subject line, doing so may delay our response due to how email filtering works.
    - Link back to this thread
    - Link to zipped theme
    - Include any relevant URLs for your site

    IMPORTANT: Please make sure you select "I have a different question" for your topic, so it doesn't go back to the forums - this and the subject line ensure that it gets assigned to me.

    Please confirm here that you send those credentials

    As for the second issue - about testing payments. To test paid memberships you have to have configured payment gateway. All gateways have option to be enabled in test mode (sandbox) so there is no need to make them live in testing phase, but gateways need to be configured for the paid memberships.
    Paid membership without gateway won't behave like free one - it will be broke.

    kind regards,
    Kasia

  • Senor Chavez

    Hi Kasia Swiderska ,

    Quick update, I have sent the secure form your way with all the information.

    Also, I found another major issue with the plugin. New members are not able to view any content in the website (lessons menu is missing, videos are missing, any of the locked elements that they are supposed to have access to are missing). I narrowed the problem to Object Caching and after disabling Cache, the problem did not replicate. I reached out to my hosting platform to find a solution. After explaining the issue to them and troubleshooting, the caching issue was narrowed down to membership 2 pro plugin. Here's the excerpt of the conversation:

    It sounds like there are plugins that aren't really caching friendly, we could exclude them.

    * Deactivated membership2 pro plugin, activated caching and added a subscriber, everything worked fine (without drip content and all the jazz that comes with the plugin)*

    If you can find the cookies / pages causing issues we can exclude it from cache.

    *asked if cookies from the particular plugin can be excluded from caching since the plugin cannot be deleted*

    It's more or less I would need to know exactly what pages are being set, what cookies it is using (not just the name of the plugin). That information usually comes from the developer.

    * Told them I'll reach out to the developers and get back to them*

    Since the website is under Beta, I have disabled caching and reenabled membership2 pro plugin. Let me know what would be the best way to tackle this issue moving forward(exclude the cookies/pages or finding a workaround with the plugin code). Thank you so much for the timely replies and troubleshooting!

    P.S. I use WPEngine for hosting.

  • Kasia Swiderska

    Hello Senor Chavez,

    As for the request from WPEngine: our Membership 2 plugin doesn't use cookies at all. The only cookies that are being used around are: WordPress authentication cookie and PHP session cookie.

    I'm not sure what pages they would want to exclude because Membership can protect elements like menu, so protection will work across the whole site.

    That said, I think you may want to "nag" WP Engine so they disable Object/Transient Caching both in the WP Engine side and on the site install. Can you ask them to do that?

    I received access and I'm downloading those files right now.

    kind regards,
    Kasia

  • Mahlamusa

    Hello Senor Chavez,

    I am sorry you are having issues building your website but if we can do anything to help we will be always happy to assist you.

    Regarding the duplicated "Membership 2" elements, I have done some search and found that this is a known issue for OptimizePress to duplicate elements when rendering. I quote from their website:

    Sometimes certain plugins that are designed to render social media icons or other items to a page will show up as duplicates throughout your LiveEditor (below each element)

    This is because the plugin is set to render these items after the "Wordpress Loop" and because of the advanced nature of our platform we have mulitple content loops on each of our LiveEditor pages

    To remove them go to the Dashboard > Global Settings > Advanced WP Filters and tick any items you see there. This will allow you to disable these items from rendering inside the LiveEdtior or on your published pages that are created with the LiveEditor.

    In my test install, I was able to replicate the issue and also verified that changing the settings as described in the OptimizePress help center, I was able to get rid of the duplicates rendering on published pages. You can achieve the same by going to "OptimizePress > Dashboard > Advanced WP Filters" and check the checkbox for 'clear_content_memory' as seen in the screenshot below and save the settings.

    Here is what I was seeing on my setup. Duplicate registration forms as follows:

    And no duplicates but only one registration form after changing the settings

    The theme developer admits this to be a problem on their theme so if something similar happens please feel free to search their support platform and should you have issues directly relating to Membership 2 or anyone of our plugins, please let us know and we will be happy to assist.

    Please let us know if you need any further help relating to this issue.

    I hope you enjoy your day further.

    Cheers,
    Mahlamusa

  • Senor Chavez

    Hi Kasia Swiderska ,

    Thank you so much for troubleshooting all my issues till date.

    1. I'm still confused on how I can tweak my user flow. Right now, it seems like a really long process when a potential customer comes in. This is how it looks like now: User comes in from the landing page --> Pricing Card/Choosing Package --> Registration --> Join Membership Page (where the user clicks on Pay with Card) --> Pay --> Thank You Page and then they are sent to Course home page. What I really want them to do is: User comes in from landing page --> In the same page, register for the account + Choose the Package + Pays for the package + Accepts Terms and Conditions --> Thank you Page. Could you please walk me through this process again?

    2. Custom Email Templates: Even though I have activated the custom email templates, Users are still receiving a successful user account registration from the wordpress console. The custom emails are not being sent either. Please help me troubleshoot this issue.

    Thank you so much.

    Senor Chavez

  • Kasia Swiderska

    Hello Senor Chavez,

    What I really want them to do is: User comes in from landing page --> In the same page, register for the account + Choose the Package + Pays for the package + Accepts Terms and Conditions --> Thank you Page. Could you please walk me through this process again?

    That is not possible without custom coding. Process for joining membership is how you described it works now on your site. There is no way to put everything on one page unless you will write a custom process. if you are not familiar with custom coding I can suggest hiring a developer here on Jobs and Pros board (this task extends scope of this forum)

    2. Custom Email Templates: Even though I have activated the custom email templates, Users are still receiving a successful user account registration from the wordpress console. The custom emails are not being sent either. Please help me troubleshoot this issue.

    Please add to wp-config.php this line:

    define( "MS_DISABLE_WP_NEW_USER_NOTIFICATION", true );

    before /* That's all, stop editing! Happy blogging. */ - it will stop default WordPress emails.
    Also could you try downloading attached file, unzip it and place it inside class-ms-model-communication.php file to /wp-content/plugins/membership/app/model/ folder overwriting the old file and see if the email is sent after that?

    kind regards,
    Kasia

  • Senor Chavez

    Hello!

    The fix for the emails seems to work! But the emails still seems to come for Wordpress. Is there any way I can use a custom email address? (see the from address in screenshots).

    Also, I discovered that in the accounts section, a lot of information seems to be inaccurate (see screenshots). For example, in the "your membership" section, it says you have no memberships activated (whereas he has signed up for the yearly membership). In the invoices and activities section, it seems to pull the invoices and activities of all the members in the portal which seems like an information that I wouldn't want to disclose. Please help me fix this problem.

    With respect to the process for joining the membership, Just to give a context:

    What I really want them to do is: User comes in from landing page --> In the same page, register for the account + Choose the Package + Pays for the package + Accepts Terms and Conditions --> Thank you Page. Could you please walk me through this process again?

    I understand that it requires custom coding, the Jobs and Pros board doesn't seem to be of much help. I will be able to get some external help if I have a general direction of where I'm looking at ( Should I use shortcodes? Which ones do I use? How do they all integrate? etc.,). I did have a look at a theme in envato that uses membership pro plugin and has a registration page similar to what I'm looking at:
    http://preview.codecanyon.net/item/ultimate-membership-pro-wordpress-plugin/full_screen_preview/12159253?_ga=1.18855920.85967901.1492044049
    If you click on the register page in this theme and click on the elite package, you will see the registration page that I'm thinking of. ( Registration + User Details + Terms of Service + Captcha). I would completely understand if this is out of scope of service but a direction would really help me go a long way. I really commend the team for helping me out! Thank you so much.

  • Nithin

    Hi Senor Chavez,

    Hope you are doing good today.

    Is there any way I can use a custom email address? (see the from address in screenshots).

    You can add the following code as a /mu-plugin, and it should change the from name, and from email address according to the given ones.

    <?php
    add_filter( 'wp_mail_from', 'your_email' );
    function your_email( $original_email_address ) {
    
    	return 'your@email-address.com';
    
    }
    
    add_filter( 'wp_mail_from_name', 'custom_wp_mail_from_name' );
    function custom_wp_mail_from_name( $original_email_from ) {
    
    	return 'Your Site Name';
    
    }

    Please check the following manual on how to implement it as a /mu-plugins:
    https://premium.wpmudev.org/manuals/wpmu-manual-2/using-mu-plugins/

    Also, I discovered that in the accounts section, a lot of information seems to be inaccurate (see screenshots). For example, in the "your membership" section, it says you have no memberships activated (whereas he has signed up for the yearly membership). In the invoices and activities section, it seems to pull the invoices and activities of all the members in the portal which seems like an information that I wouldn't want to disclose. Please help me fix this problem.

    It seems like you are still using the old version, ie v 1.0.3.3. Do you still get this error? If yes, please enable support access, so that I could give a closer look. You can grant access from WPMU DEV > Support > Support Access > Grant Access, or check this manual: http://premium.wpmudev.org/manuals/wpmu-dev-dashboard-enabling-staff-login/

    Please let us know once you enable access, so that we could give a closer look.

    ( Should I use shortcodes? Which ones do I use? How do they all integrate? etc.,). I did have a look at a theme in envato that uses membership pro plugin and has a registration page similar to what I'm looking at:

    You'll have to use shortcodes, you can find all the related shortcodes in the plugin, under Membership 2 > Help > Shortcodes.

    Maybe, you could use the following one, where id reflects the membership id, and it'll create a signup button to that particular membership.
    [ms-membership-buy id="5" label="Buy now!"]

    You can use a plugin like Google Captcha to add reCAPTCHA in the register/login forms:
    https://wordpress.org/plugins/google-captcha/

    Regarding terms, and conditions maybe you could use the Terms of service plugin:
    https://premium.wpmudev.org/project/terms-of-service/

    I suppose these should help get you started, please let us know if you still need any further assistance. Have a nice day.

    Best Regards,
    Nithin

  • Senor Chavez

    Hi Nithin ,

    I tried adding the php code as an mu-plugin but it doesn't seem to work. The website shows a blank screen as soon as I inject the code. Please let me know if there are any other alternate measures.

    Regarding the invoices,

    It seems like you are still using the old version, ie v 1.0.3.3. Do you still get this error? If yes, please enable support access, so that I could give a closer look. You can grant access from WPMU DEV > Support > Support Access > Grant Access, or check this manual: http://premium.wpmudev.org/manuals/wpmu-dev-dashboard-enabling-staff-login/

    I'm still noticing the same error with respect to the accounts page. I have granted support access. Please let me know what's happening and how to fix it.

    Thanks!

    Senor Chavez

  • Nithin

    Hey Senor Chavez,

    Sorry for the delay in getting back to you, if I'm not mistaken, the current issue now in your system is related to making custom email address work, right? Rest of the issues have be solved after the plugin update, I suppose?

    I did test the above custom email address code in my system, and it did work fine. To have a better understanding of this, could you please send us your credentials so that I could give a closer look, and see what's being missed here.

    You can send credentials by using our secure contact form: https://premium.wpmudev.org/contact/#i-have-a-different-question

    - To Mark to my attention, the subject line should contain only: ATTN: Nithin Ramdas
    -WordPress admin username
    -WordPress admin password
    -login url
    -FTP credentials (host/username/password)
    -link back to this thread for reference
    -any other relevant urls

    Have a nice day.

    Kind Regards,
    Nithin

  • Senor Chavez

    Hi Nithin ,

    Thanks for the reply! After the new update, My optimize press live editor is not responding properly. I'm not able to create a new page (it just keeps loading) and the editor is not responding and when I click on edit page, everything below the heading is empty. Could you please look into this?

    Regarding the credentials, I'm sending them to you right away! Thank you so much.

    Senor Chavez