New Account Payment Screen in Pro Sites is poorly formatted

Hello,

I updated to the most recent version of Pro Sites and the Account/Payment screen is very poorly formatted and confusing to follow. Nothing seems to be aligned properly. I have attached a screenshot.

I am using WooThemes Canvas theme, and have removed any custom CSS to see if that was this problem, but it was not.

Are there new settings to format this screen? If not, how to I roll back to a previous version so my potential customers can complete the payment process easily?

Thanks,
Chris

  • Patrick
    • Support Monkey

    Hi there @Christopher

    I hope you're having a great day!

    Indeed, the default styling of some themes can cause certain plugin generated elements to look quite off. In the Canvas theme, list elements are bulleted by default with this rule in the style-sheet:
    .entry ul li {list-style-type:disc;}

    ...and elements with a class of title get a bottom margin added with one:
    .page .title {margin:0 0 0 0.5em;}

    But you can override that for the Pro Sites checkout form & snap it into shape by simply adding this custom CSS:

    .entry #psts-checkout-output ul li {list-style-type:none;}
    .page #psts-checkout-output .title {margin-bottom:0;}

    Below are before & after screenshots of the checkout form in Canvas.

    I hope this helps! And thanks for being a member :slight_smile:

  • Christopher
    • The Bug Hunter

    Hey @Patrick,

    I really appreciate the quick response and fix. This makes it look much prettier :slight_smile:

    Do you know why I am seeing the "Page Cannot Be Found" screen when clicking on the trial upgrade link at the top of the Admin pages?

    Thanks,
    Chris

  • Sajid
    • DEV MAN’s Sidekick

    Hi Chris! Welcome back :slight_smile:

    Have you set a checkout page for Pro Sites ? You can do this From Network > Pro Sites > Settings > General Settings > Checkout Page.

    If its configured than post the link of that page here and if its okay for you then please grant support access so we can further troubleshoot this issue.

    Take care and have a great weekend :slight_smile:

    Cheers, Sajid

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Christopher! Hope you are doing good today :slight_smile:

    It requires login to test. Can you please grant support access so I can troubleshoot ? You can grant access from WPMU DEV > Supprt > Support Access > grant access as mentioned in this manual.
    https://premium.wpmudev.org/manuals/wpmu-dev-dashboard-enabling-staff-login/

    I will need admin access of your network area so I can create a test site if required.

    Take care and have a nice day :slight_smile:

    Cheers, Sajid

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Christopher! Hope you are doing good and thanks for extending the access :slight_smile:

    Yes the pro-site page is working fine if I am login and super admin but its throwing 404 error if a new user logged in. I created a testing site on your Network its WPMUSJAVED and the account page/upgrade link is broken to me too.

    Please do a quick plugin/theme/script conflict test and let us know if its still not working. I avoided to any adventure on your live website, specially without having FTP access. For more details see below manual (Flowchart).
    https://premium.wpmudev.org/manuals/using-wpmu-dev/getting-support/

    Take care and have a nice weekend :slight_smile:

    Cheers, Sajid

  • Christopher
    • The Bug Hunter

    Hi @Sajid,

    Thanks for creating a test account and trying to help. I have also tested it and still get the 404 errors, and can't seem to find any theme/plugin conflict.

    I have setup a staging server for us to use for testing. Does your Support access also work on this testing server?: http://wpmusjaved-cfboxsites-com.cfboxsites.staging.wpengine.com

    This way you can test without effecting the live site.

    Thanks again for your assistance.

    Chris

  • Patrick
    • Support Monkey

    Hi again @Christopher

    I hope you had a great weekend!

    Does your Support access also work on this testing server?

    It only works if you click the Grant Access button in your WPMU DEV Dashboard under Support. So to grant us access to that site, you must first install the WPMU DEV Dashboard on that site, then click the button. :slight_smile:

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Christopher! Hope you are doing good today :slight_smile:

    I need access to main site that "cfboxsites.staging.wpengine.com". Its not active or either the support access expired.

    Please grant support access for this staging server so we can troubleshoot.

    Cheers, Sajid

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Christopher! Hope you are doing good :slight_smile:

    I tried to troubleshoot the problem but could not figure out why its happening on staging server. Here is what I did.

    1. Deactivated all plugins (no luck).
    2. Checked with canvas theme (no luck).
    3. Installed twentyfiftee theme (no luck).
    4. Updated Pro Sites from 3.5.0.2 to 3.5.0.3 (no luck)
    5. Deleted the Pro Sites plugin completely and then installed again (no luck).

    I noticed you have a WordPress Toolbar Editor. Tried to check its settings but could not find the account page link.

    On staging server its forcing to use HTTPS and ends with no certificate error.

    Do you remember if you have changed this item's (Upgrade/Account) URL ?

    Do you have any redirect rule in .htaccess file from http to https ?

    I also checked you have some mu-plugins. Is there any code that you added for HTTPS and forgot ?

    Can you try a fresh WordPress Multisite install and test the link ?

    Look forward towards your response :slight_smile:

    Cheers, Sajid

  • Christopher
    • The Bug Hunter

    Hi @Sajid,

    Which of these items would you like for me to try first? I have this exact same setup running on other installs and have not run into this issue before. Same plugins, same host, same everything, that's what makes this frustrating.

    Here is one more thing I have noticed:

    If I click on the FREE trial alert bar in Admin I get the 404 error. If I click on the blue "My Account" button in the upper right of Admin it forces me to login through the Pro-Site page, then redirects me to the WordPress login page, which then tells me I am trying to access a site I don't have access to. If I then click on View Dashboard, I finally get back into Admin.

    Now if I click in the blue "My Account" button in the upper right I finally get sent to the Pro Sites payment page.

    Does this make sense? Seems like a lot of extra steps to get to the payment screen.

    Thanks,
    Chris

  • Sajid
    • DEV MAN’s Sidekick

    Hi @Chris! Welcome back :slight_smile:

    Which of these items would you like for me to try first?

    First of all I want you to remove HTTPS from prosites checkout page so I can finally get to the checkout page and debug the original issue. On sandbox/staging sites it freezes on HTTPS error (see screenshot). So it seems, I am getting different problem on staging website.

    Yes it totally makes sense. You have to login first to get to the pro sites checkout page that is expected behaviour. Because you are logged in on subsite and the checkout page is on main website. That checks you don't have active session and pops you up to login. Yes! Besides extra steps it finally started working on main website :slight_smile:

    On your main website, the "My Account" button seems to be working now to me. Here is the flow:
    1. Access http://wpmusjaved.cfboxsites.com/wp-admin/ after login
    2. Clicked on blue "My Account" button
    3. It took me here https://cfboxsites.com/pro-site/?bid=30 (so original problem seems to be resolved)
    4. Logged in using my account credentials
    5. Visit Dashboard
    6. Again clicked on blue "My Account" button
    7. Then finally able to change the plan (see screenshot)

    So besides the flow and I agreed its complicate. It worked for me too :slight_smile: I noted the points and will discuss with developer to further simplify the process. Thanks for your feedback :slight_smile:

    If I click on the FREE trial alert bar in Admin I get the 404 error.

    Where I can see this alert in http://wpmusjaved.cfboxsites.com/wp-admin/.

    Cheers, Sajid

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.