Is there a way of amending the account style and layout?

Hi,

I'm having difficulty getting the account section of Membership 2 to act in a responsive way with any theme I use. I've trialled about 5 different themes but everytime I view on mobile it just looks ugly and doesn't fit on the screen very well.

Can you show me where to get at the code so I can structure the layout to work on mobile in a better way please?

Thanks,

Ash

  • Tyler Postle
    • CGO

    Hey there Ash,

    Hope you're doing well this weekend!

    Try adding this CSS:

    /* Responsive M2 Account page */
    @media only screen
      and (max-device-width: 414px) {
    div#account-invoices th, div#account-activity th, div#account-profile th, div#account-membership th, div#account-invoices td, div#account-activity td, div#account-profile td, div#account-membership td  {
        font-size: 12px;
    }
    }

    This should make it fit better on mobile devices. You can add that to your child theme CSS or to a custom stylesheet like the one that this plugin provides: https://wordpress.org/plugins/simple-custom-css/

    Let us know if you still need any further assistance after that.

    Enjoy the rest of your weekend!

    All the best,
    Tyler

  • ash
    • Site Builder, Child of Zeus

    Hi,

    Thanks for the code. I added this to my custom css but I think the issue here is that it's in a table that doesn't act responsively. The edit buttons aren't even on the screen as per the attachment.

    Can you show me where to edit the code as shortcodes are quite limiting on what we can do to create a bespoke looking design/layout.

    Thanks,

    Ash

  • Tyler Postle
    • CGO

    Hey Ash,

    That's odd, on my site I can see the edit links without any issues. Can you make sure you are logged in then temporarily switch to the default 2015 theme and see if you can see the links then :slight_smile:

    I think this may be more of a theme conflict.

    With that said, I did create a feature request ticket for our developer to improve the responsiveness of the Account page table. I agree that the table needs some work, responsive wise.

    If you still don't see the edit links after doing the theme check can you grant support access? That way I can login and have a look.

    You can grant support access via WPMU DEV > Support > Support Access > Grant Access.

    Look forward to hearing back!

    Cheers,
    Tyler

  • ash
    • Site Builder, Child of Zeus

    It's strange that you can see it fine in your theme. I've tried 7 themes, each with the same result.

    I tried the 2015 default theme which resulted in the attached. Better but still not very good or clean enough for customers. Looks broken if anytyhing. Could you tell me where to locate the file which has this info on so I can amend the structure/take it out of a table please?

    Thanks,

    Ash

  • Tyler Postle
    • CGO

    Hey Ash,

    Sorry for the delay!

    You can find the templates for each section of that page here: /wp-content/plugins/membership/app/view/frontend/

    As for it still looking messy, you could decrease the font-size further to help them fit within the table headers but I do understand you're wanting to take it a step further than that. As mentioned above, I've flagged the developer on this so it can be looked into and improved for a future version :slight_smile:

    In the meantime, let us know if you have any further questions. Hope you're having a good weekend.

    All the best,
    Tyler

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.