Subscription - Sign-up Form - Sub. Description Issues

From the Admin view, my subscriptions only show the descriptions when I highlight that area. This starts at Step 2. There is no Step 1. From the visitor viewpoint, there are no subscription options but instead an Account Sign-up form. This is in Scholar theme running Buddypress and Membership.

I had started this issue before but things got consolidated, moved, etc. so I have been advised to restart. Thanks to all past and future helpers.

  • Mason

    Hiya,

    I may not be tracking correctly, but I believe this is default behavior. If you're already logged in, going to the subscription form will take you straight to the subscriptions for purchase. If you're not logged in, you must first register and then you'll be allowed to select a subscription.

    Is that what's happening for you? What are you expecting to see? We'll get some clarity here and get ya sorted.

    Thanks!

  • CoachJo

    Thanks, it seems I'm not being very clear...

    When somebody comes to my website, I want them to become a member by buying a subscription on the Sign-up page. Once they buy that subscription, I want them to receive a confirming email that gives them a registration code they will use at the Confirm Registration page where they will fill out a detailed form (now held in the extended profile) that will help us assign them to the right group and coach. At that time, they will also choose their username and password. That will get them access to the General Membership area, available to all levels of paid members and containing Tools, Links, Forum, Resources, Articles, etc. and one-time only access to assessments. That's my vision.

    Right now, if somebody comes to my website, signing up doesn't tell them anything about our programs (subscriptions) or ask them for payment and there's nothing they get for doing so. I intend to install a pop-up just to capture name and email later.

    My subscriptions look to be all set up nicely when I'm logged on as an admin EXCEPT the type on the descriptions must be set as white because it only shows up if I highlight it.

  • Mason

    Hiya CoachJo,

    That's a very specific flow for signup - especially the confirmation or registration code won't be possible with membership by default. It'll require some custom development.

    One of the other issues I see is signing up for a subscription BEFORE you actually have a username/password is that there is nothing to attach the subscription to a particular person.

    So the order really needs to be signup for username/password and select subscription. Once this is complete, you can have membership send a confirmation email with a link to their full profile (assuming you're using BuddyPress for user profiles?). They can then head to the site, log in, and begin accessing the content for their level.

    Take a look at this site which uses membership: http://staypress.com/purchase-staypress/

    That's just a custom page written to provide the various subscription buttons. You'll notice clicking any of them produces a popup where you first are signing up for a username/password and then taken to PayPal for completion.

    My subscriptions look to be all set up nicely when I'm logged on as an admin EXCEPT the type on the descriptions must be set as white because it only shows up if I highlight it.

    This sounds to me like a styling issue with the theme. If you have a link to the site maybe we cna take a look ourselves and assist more easily.

    Thanks!

  • CoachJo

    This is still not resolved. I copied subscriptionform.css to the child theme and here it is but I don't know what to modify:

    /* @override http://dev.site/wp-content/plugins/membership/membershipincludes/css/subscriptionform.css?ver=3.0.1 */

    #reg-form .formleft td label {
    display:inline;
    }

    #reg-form table {
    clear: both;
    }

    .error {
    background-color: #ffebe8;
    border-color: #c00;
    border-width: 1px;
    border-style: solid;
    padding: 0.5em !important;
    margin: 5px;
    clear: both;
    }
    .error ul {
    margin: 0;
    padding-left: 20px;
    }
    #reg-form .discount {
    background-color: #C6FFB4;
    border-color: #008000;
    border-width: 1px;
    border-style: solid;
    padding: 0.5em !important;
    margin: 5px 15px 2px;
    clear: both;
    -moz-border-radius: 3px;
    -khtml-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    }
    #reg-form a#login_right {

    }
    #reg-form .cctext:hover {
    background-color: #FCEC8F;
    border:1px solid #DFBE06;
    }
    #reg-form span.subads {
    margin-left: 30px;
    display:block;
    }
    #reg-form span.sub_discount {
    margin-left: 30px;
    display:block;
    color: #008000;
    }
    #reg-form div#reg_tos {
    width: 95%;
    height: 150px;
    overflow: auto;
    background-color: white;
    padding: 10px;
    border: 1px inset gray;
    color: #353535;
    clear: both;
    }
    #reg-form p.pass_hint {
    margin-top: -20px;
    margin-bottom: 20px;
    font-size: 10px;
    }
    #reg-form a.regbutton {
    text-decoration: none;
    }
    #reg-signup {
    margin: 0px;
    padding: 0px 0px 20px;
    float: left;
    width: 90%;
    }

    #reg-form {
    margin: 0px 0px 2em;
    float: left;
    width: 95%;
    background: transparent;
    overflow: hidden;
    padding: 10px;
    }

    #reg-form .formleft {
    margin: 0px;
    float: left;
    background: #FFFFFF;
    width: 100%;
    }
    #reg-form .formright {
    margin: 0px;
    float: right;
    width: 250px;
    }
    #reg-form .formleft label {
    font-size: 13px;
    font-weight: bold;
    color: #111;
    font-family: Helvetica, Arial, sans-serif;
    display: block;
    }
    #reg-form .formleft span {
    color: #d74746;
    text-decoration: none;
    }
    #reg-form .regtext {
    padding: 3px !important;
    width: 200px;
    margin-bottom: 20px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    color: #111;
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    }
    #reg-form .alignleft {
    margin: 0px;
    padding: 0px;
    float: left;
    width: 45%;
    }
    #reg-form .regarea {
    padding: 1px;
    width: 400px;
    margin-bottom: 20px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    float: left;
    height: 100px;
    color: #111;
    line-height: 18px;
    }
    #reg-form .formleft h2 {
    font-size: 15px;
    font-weight: bold;
    margin: 0px 0px 15px;
    padding: 0px;
    font-family: Arial, sans-serif;
    float: left;
    width: 100%;
    }

    div.subscription h3 {
    font-size: 15px;
    font-weight: bold;
    margin: 0px 0px 5px !Important;
    padding: 0px;
    font-family: Arial, sans-serif;
    float: left;
    width: 100%;
    }

    #reg-form .formleft p {
    margin: 0px 0px 15px;
    padding: 0px;
    float: left;
    width: 100%;

    }

    #reg-form .formleft .regbutton {
    font-size: 15px;
    padding: 5px 12px;
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
    }
    #reg-form .regtext:hover {
    padding: 3px !important;
    width: 200px;
    margin-bottom: 20px;
    font-family: Arial, sans-serif;
    font-size: 13px;
    color: #111;
    background: #fefdd8 url(none);
    border: 1px solid #DFBE06;
    }

    div.subscription {
    overflow: hidden;
    float: left;
    width: 98%;
    padding: 5px;
    border: 1px solid #ddd;
    }

    div.subscription p {
    margin: 0px 0px 15px;
    padding: 0px;
    width: 100%;
    font-size: smaller;
    }

    div.subscription div.description {
    overflow: hidden;
    float: left;
    width: 70%;
    }

    div.priceforms {
    float: right;
    width: 25%;
    }

    .cardimage {
    height: 23px;
    width: 157px;
    display: inline-table;
    }

    .nocard {
    background-position: 0px 0px !important;
    }

    .visa_card {
    background-position: 0px -23px !important;
    }

    .mastercard {
    background-position: 0px -46px !important;
    }

    .discover_card {
    background-position: 0px -69px !important;
    }

    .amex {
    background-position: 0px -92px !important;
    }

    div.message.hidden {
    display: none;
    }

  • CoachJo

    Thanks, I added color: #111;

    but nothing happened.

    Maybe the change should be to subscriptions.css instead:

    /* @override http://dev.site/wp-content/plugins/membership/membershipincludes/css/subscriptions.css?ver=1 */

    div.sub-liquid-left {
    float: left;
    clear: left;
    width: 100%;
    margin-right: -325px;
    }
    div.sub-liquid-right {
    float: right;
    clear: right;
    width: 300px;
    }
    #sub-left {
    margin-left: 5px;
    margin-right: 325px;
    }
    #sub-left #edit-sub {
    background-color: transparent;
    border: 0 none;
    }
    div.sub-holder-wrap {
    padding: 0;
    margin: 10px 0 20px;
    }

    .sidebar-name {
    background-color: #aaa;
    background-image: url(../images/ed-bg.gif);
    text-shadow: #FFF 0 1px 0;
    border-color: #dfdfdf;
    -moz-border-radius-topleft: 8px;
    -moz-border-radius-topright: 8px;
    -webkit-border-top-right-radius: 8px;
    -webkit-border-top-left-radius: 8px;
    -khtml-border-top-right-radius: 8px;
    -khtml-border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    }

    .sidebar-name:hover {
    color: #333 !Important;
    cursor: move;
    }

    #main-start .sidebar-name:hover {
    color: #333 !Important;
    cursor: auto;
    }

    p.description {
    margin: 0 12px 12px;
    }

    .level-holder {
    border-width: 0 1px 1px;
    border-style: none solid solid;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -khtml-border-bottom-right-radius: 8px;
    -khtml-border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    background-color: #f1f1f1;
    border-color: #ddd;
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 20px;
    overflow: hidden;
    }

    .sub-holder {
    position: relative;
    background-color: #fff;
    border-color: #ddd;
    border-width: 0 1px 1px;
    border-style: none solid solid;
    -moz-border-radius-bottomleft: 8px;
    -moz-border-radius-bottomright: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -webkit-border-bottom-left-radius: 8px;
    -khtml-border-bottom-right-radius: 8px;
    -khtml-border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    padding: 0;
    }

    div.sub-details {
    padding-top: 10px;
    padding-left: 10px;
    }

    .sub-holder label {
    margin-bottom: 5px;
    font-weight: bold;
    display: block;
    }

    .sub-holder div select {
    margin-bottom: 10px;
    margin-top: 0;
    }

    input.wide, textarea.wide {
    margin-top: 5px;
    width: 98%;
    margin-left: 0;
    margin-bottom: 5px;
    }

    .sub-holder h3 {
    background-color: #edf3fe;
    text-shadow: 0 1px 0 #FFFFFF;
    color: #000;
    font: normal bold 12px/2.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    margin-left: 0;
    margin-right: 0;
    padding-left: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    }

    .droppable-levels {
    width: 95%;
    margin-left: 15px;
    margin-bottom: 20px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 3px dashed #ddd;
    color: #a9a9a9;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
    clear: both;
    margin-top: 20px;
    }

    .droppable-levels.hoveringover {
    border: 3px dashed #78aad3;
    color: #78aad3;
    }

    #positive-rules {
    background: #fcfcfc;
    }
    #negative-rules {
    background: #fcfcfc;
    }

    .action-top {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    border-radius: 6px;
    background: #dfdfdf url("../images/gray-grad.png") repeat-x left top;
    text-shadow: #fff 0 1px 0;
    width: 250px;
    margin-left: 10px;
    padding: 5px 15px;
    font-weight: bold;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    min-height: 20px;
    }

    .action-top:hover {
    cursor: move;
    }

    .action-top-placeholder {
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    -khtml-border-radius: 6px;
    border-radius: 6px;
    border-radius: 6px;
    background: transparent;
    width: 250px;
    margin-left: 10px;
    padding: 5px 15px;
    font-weight: bold;
    margin-bottom: 10px;
    min-height: 20px;
    border: 1px dashed #ddd;
    }

    div.sub-operation {
    float: left;
    width: 95%;
    margin-left: 15px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px;
    border: 1px solid #ddd;
    margin-bottom: 0;
    }

    h2.sidebar-name span {
    float: right;
    }
    h2.sidebar-name span a {
    text-decoration: none;
    font-size: 11px;
    }

    #hiden-actions {
    margin-left: 5px;
    margin-right: 325px;
    display: none;
    }

    div.sub-operation h2 {
    text-shadow: 0 1px 0 #FFFFFF;
    color: #000;
    font: normal bold 12px/2.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    margin-left: 0;
    margin-right: 0;
    padding-left: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    }

    div.sub-operation .inner-operation {
    padding: 10px;
    font-size: 12px;
    overflow: hidden;
    }

    div.sub-operation .inner-operation p {
    margin-top: 0;
    }

    div.sub-operation .inner-operation p.description {
    margin: 0;
    }

    #membership-levels-start, #membership-levels-holder {
    clear: both;
    overflow: hidden;
    }

    div.joiningline {
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    width: 1px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    background: #ddd;
    height: 20px;
    }

    div.buttons {
    text-align: right;
    padding: 10px 15px 10px 10px;
    }
    div.buttons a.cancellink {
    margin-right: 10px;
    font-size: 12px;
    text-decoration: underline;
    color: #797979;
    }

    .sortable-levels {
    overflow: hidden;
    margin-bottom: 0;
    }

    .placeholder-levels {
    width: 95%;
    margin-top: 20px;
    margin-left: 15px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 2px dashed #ddd;
    color: #a9a9a9;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
    clear: both;
    min-height: 150px;
    }

    div.levelinformation {
    border: 1px solid #ddd;
    width: 45%;
    min-height: 145px;
    padding: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    }

    .no-movecursor {
    cursor: auto !Important;
    }

  • Mason

    Hiya,

    As we haven't heard back from you we're going to assume the problem was sorted out and mark this ticket as resolved.

    If it wasn't resolved, or you have any more questions related to this thread please feel free to post them below and tick the 'Mark as Not Resolved (re-open)' box below the post area (or else we'll miss it!)

    Otherwise, thanks for using the forums, and for being a member of WPMU DEV, it's a pleasure to help you out and we look forward to being of assistance in the future.

    Thanks!

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.