Protected Content Shortcodes and styling

Hi,

I'm currently trying to find where I can access the code / shortcodes for pages so I can place them in specific coloumns and give them a general tidy up.

For example, the 'Account' page has a number of sets of user information yet I only see one shortcode. That account info is being spat out all over the page without any styling. I'd like to take each set of the users credentials and lay them out neatly in a grid but to do this I will need to have each bit of info available. The shortcodes do not seem to cover what is actually visible from the help menu. I also viewed the source code of this page and they appear to all be in tables. I'm currently using the 'Pagebuilder' tool to create responsive layouts and I plan to drop any hard code / shortcodes directly into these for each required page.

It's also a little confusing as to how / where I access the automatically populated pages like when a user completes registration and is directed to the membership page there is the the plan overview, purchase button and coupon form. I can't find this in the admin anywhere but I need to access them all to lay them out better also.

Any help would be greatly appreciated.

Thanks

  • Tyler Postle

    Hey Ash,

    Hope you're doing well today and welcome to the WPMU DEV Community!

    Yes, the account page has the layout included in the shortcode, so it should display spread out in table format.

    If you're wanting to customize the layout then often some CSS will do the trick :slight_smile:

    Would you mind granting support access via our WPMU DEV Dashboard?

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

    Then we can see how the page looks now and then perhaps we can help get it sorted for you.

    It sounds like you're theme might be affecting the pre-set styling for the shortcode.

    Look forward to hearing back on this so we can have a look :slight_smile:

    Cheers,
    Tyler

  • ash

    Hi,

    Thanks for you response. I've granted access now. Do you know what site I am using?

    I've had to change the location of the original WP install. If you need this I can send.

    I can see that the title for each table is in a <h2> but the edit button is also in this tag which I'd like to change and format differently. The table isn't looking too great when scaled down (responsive) so I guess changing this would be the next step.

    Hope you can help :slight_smile:

    Thanks,

    Ash

  • ash

    Ok, I've managed to get some styles applied to the tables by viewing the page source and copying the classes into my custom.css file which seems to be holding up, but I need to amend pre-populated text for the 'edit' links and table headings. I would also like to remove the 'Invoice' section and arrange the order differently. Where do I find the code to do this?

    I have hardcoded my ideal layout below the shortcode version incase you wanted to see what I'm trying to ultimately achieve.

    This also raises another question regarding the child pages for the 'Account' page (edit personal details / change membership plan / etc...). I need to style these too but put them in a wrapper so they align like the 'Account' page information. Can you tell me where I can access these also, please?

    Thanks,

    Ash

  • ash

    Is anyone able to help on this? I need to change the formatting of these pages but can't get the individual elements within the overarching shortcode.

    I need to turn the initial Account details from 'screenshot1' to 'screenshot2' and it doesn't seem as straight forward as amending simple css.

    I want to be able to replace the 'h2's with 'h4's, remove the invoice section completely, alter the link copy under 'Your membership' from 'Change' to 'Edit' and put all of these shortcodes inside a specific wrapper.

    The same applies for the pages that appear when a user clicks through to edit. I need to be able to edit these also and can't see how I go about it.

    Where can I access this? Please help :slight_frown:

    Regards,

    Ash

  • calvinrogercanas

    Hello @ash,

    Hope you're well.

    You need to use a "custom css" plugin or a child theme or a custom css function provided by your theme to keep the customization even a plugin / theme update happens.

    Could you grant support access from the dashboard plugin so we can take a closer look? See https://premium.wpmudev.org/manuals/wpmu-dev-dashboard-enabling-staff-login/

    Looking forward for your reply.

    Best Regards,
    Calvin

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.