How do I change table array out of the checkout Pro Site?

Hello everybody. First im really sorry im not so good in writting englisch but i hope that people will understand me.

I wanna change the checkout page from the Pro Site plugin. I already changes the level bottoms colours from dark blue to licht blue en I leave the hover colours the way it already is.

But now I wanna change the table array from gray to white so it will be totaly invisible for now, but if i wanna change it later back I only have to change the white colour to another colour.

I hope that someone can help me...thanks already

  • aristath

    Hello there @Nadia, I hope you're well today!

    But now I wanna change the table array from gray to white so it will be totaly invisible for now, but if i wanna change it later back I only have to change the white colour to another colour.

    Well, that depends partially on the theme you're using...
    Could you please grant us access to your backend so that we may see exactly what is happening?
    To do so, from your dashboard go to WPMUDEV => Support => Support Access and click on the "Grant access" button.

    Please note that you must have the WPMU DEV Dashboard plugin installed on your site to complete the above process.

    Cheers,
    Ari.

  • Nadia

    Hello Ari,

    I use the Blogs MU theme. I will give you the grant access. thank you for helping me with the table array.

    What I eventually want is the something like in the Pro Site Turtiorals 1 and 2 video"s. But than with something like the features from edublogs levels above the paypal level where people can choose the pay / level bottoms. So that people easier can see what is the differents between the levels.

    I thought that it was possilble in Pro Site but i can find it unfortunaly. Can you mayby give me some suggestion how I best can do that to make something like the feautures like edublog? Or do i look somewhere over it? Or do I need another plugin for it?

    And can i change the bottoms from the checkout in simple one colour block without curves, schadows. Just 1 colour block at the background with a darker colour as hover ( or text colour hover), so all the blocks/bottoms will be in the same size and not changed with te text annymore? Now people see the diffrents between the hight of the one month payment between the 3 month and the year payments.

    Greets,
    Nadia

  • Patrick

    Hi there @Nadia

    I hope you're well today!

    This CSS will make white background and borders in the table on your Pro Sites page:

    table#psts_checkout_grid {border:2px solid #fff;}
    table#psts_checkout_grid th, table#psts_checkout_grid td {background:#fff; border:1px solid #fff;}

    Where exactly did you make your previous changes? Did you edit the theme or plugin CSS files directly? If so, that is not a good idea, as you will need to do those edits again every time you update the theme or plugin. :slight_frown:

    To add your own custom CSS to override plugin or theme styling, try a handy plugin like this one:
    https://wordpress.org/plugins/simple-custom-css/

    That way, you can add all your custom CSS in one place, and do not need to worry about updates messing up your site.

    As for the rest of the changes you wish to make to that page, can you please post an image illustrating what you would like the final table to look like? That would help a lot. :slight_smile:

    Thanks!

  • Nadia

    Hello Patrick,

    I did change the plugin CSS files directly and I will change that right a way. If I don that I will try the simple costum css plugin en change the table background en borders Thanks for that information.

    I make a image illustration for give a idea how i hope my final table/pro site page would look like.
    I give every level a diffrent colour bleu...with no highlights or other special things. The red and orange colour whats standaard in pro sites is okay to me. I want the hover colour some lighter than the original giving bleu. But mayby is a text hover a good idea to.

    I want also create a new table like the fuetures from edublogs. I make that to in my illustration image. I dont want copie it, but I wanna make something like that with my own images.

  • Tyler Postle

    Hey Nadia,

    Hope you're doing well today!

    You target each row like this:

    /* level 3 here */
    
    #psts_checkout_grid .psts_level level-3 .pblg-checkout-opt {
    background: #fff;
    }
    
    #psts_checkout_grid .psts_level level-3 .pblg-checkout-opt:hover {
    background: #fff;
    }
    
    /* level 2 here */
    
    #psts_checkout_grid .psts_level level-2 .pblg-checkout-opt {
    background: #fff;
    }
    
    #psts_checkout_grid .psts_level level-2 .pblg-checkout-opt:hover {
    background: #fff;
    }
    
    /* level 1 here */
    
    #psts_checkout_grid .psts_level level-1 .pblg-checkout-opt {
    background: #fff;
    }
    
    #psts_checkout_grid .psts_level level-1 .pblg-checkout-opt:hover {
    background: #fff;
    }

    Replace the colour with one of your choosing of course :slight_smile: you have both the normal state then the hover as well.

    I want also create a new table like the fuetures from edublogs. I make that to in my illustration image. I dont want copie it, but I wanna make something like that with my own images.

    As for the features table, there are some plugins that will help you create one of those :slight_smile:

    One of these ones here should do the trick: https://premium.wpmudev.org/blog/free-wordpress-pricing-table-plugins/

    Let us know if you need any further assistance!

    All the best,
    Tyler

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.