#69205 How to apply theme to my-account page?

Landing Forums JupiterX WordPress Theme How to apply theme to my-account page?

Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • jordi.blanch-78b25780

    Hello,

    I’ve bought Jupiter X and used SaaS theme for my WP/WooCommerce site, but I see that my-account page does not follow SaaS theme style. How to make my-account page use the same theme style?

    Amir Rather Support Team

    Please try the below CSS in Jupiter X > Customize > Additional CSS:

    
    body a.woocommerce-Button.button {
    background: #000 !important;
    border: none !important;
    }
    button.woocommerce-Button.button {
    background: #000 !important;
    border: none !important;
    }
    button.btn.btn-primary.btn-sm {
    background: #000 !important;
    border: none !important;
    }

    PS: Use your own colors that match the Theme.

    Regards

    jordi.blanch-78b25780

    Hello, your solution has changed some buttons color, but there are still many things (including some buttons in My Account page) that don’t match these colors.

    I bought your theme because it was supposed to work with WP and WooCommerce, and in my opinion the My Account page it’s a basic page for any WP/WooCommerce solution and it should also fit the theme. It doesn’t make sense to me to buy a theme to have a beautiful WP/WooCommerce site and then when the user needs to see their orders, or account details, then he/she finds the ugly WP defaults. Also, manually changing the Additional CSS shouldn’t be the way to go.

    I attach some screenshots of things that your “Additional CSS” solution has not changed:

    Please, how to make ALL WP/WooCommerce pages fit the theme I’ve payed for?

    Alexander Hutsol Support Team

    Hello,

     

    My Account page uses default Wooommerce styles.

    Do you use some plugin to override the default design?

    Could you please provide access to your WP Dashboard to check the settings and My Account page.

     

    Looking forward to your reply.

    Regards.

    Private
    jordi.blanch-78b25780
    This reply has been marked as private.
    Private
    jordi.blanch-78b25780
    This reply has been marked as private.
    Nodari Support Team

    Hey there

    Sorry for the delay, please add this css code and let me know if I left something ūüôā

    .woocommerce .woocommerce-MyAccount-navigation ul li.is-active, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce .jupiterx-wc-loadmore {
        background-color: #23a455;
    }
    .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce .jupiterx-wc-loadmore {
        border: 1px solid #23a455;
    }
    .woocommerce-info {
        border-top-color: #23a455;
    }
    .woocommerce-info::before {
        color: #23a455;
    }

    Best regards

    jordi.blanch-78b25780

    There are still many things that appear with the blue color instead of the green color.

    So, your theme is definitely not compatible with WooCommerce?

    Tatyana Hutsol Support Team

    Hello,

     

    Our theme is compatible with Woocommerce, but default Woocommerce styles are used.

    As for the checkbox https://take.ms/vnAII , checkboxes are not able to be styled. You would need a third party js plugin to style it.

    Also add this code to override Woocommerce styles:

    .woocommerce #respond input#submit.alt, .woocommerce #respond input#submit.alt:hover, .woocommerce #respond input#submit.alt.disabled, .woocommerce #respond input#submit.alt.disabled:hover, .woocommerce #respond input#submit.alt:disabled, .woocommerce #respond input#submit.alt:disabled:hover, .woocommerce #respond input#submit.alt:disabled[disabled], .woocommerce #respond input#submit.alt:disabled[disabled]:hover, .woocommerce a.button.alt, .woocommerce a.button.alt:hover, .woocommerce a.button.alt.disabled, .woocommerce a.button.alt.disabled:hover, .woocommerce a.button.alt:disabled, .woocommerce a.button.alt:disabled:hover, .woocommerce a.button.alt:disabled[disabled], .woocommerce a.button.alt:disabled[disabled]:hover, .woocommerce button.button.alt, .woocommerce button.button.alt:hover, .woocommerce button.button.alt.disabled, .woocommerce button.button.alt.disabled:hover, .woocommerce button.button.alt:disabled, .woocommerce button.button.alt:disabled:hover, .woocommerce button.button.alt:disabled[disabled], .woocommerce button.button.alt:disabled[disabled]:hover, .woocommerce input.button.alt, .woocommerce input.button.alt:hover, .woocommerce input.button.alt.disabled, .woocommerce input.button.alt.disabled:hover, .woocommerce input.button.alt:disabled, .woocommerce input.button.alt:disabled:hover, .woocommerce input.button.alt:disabled[disabled], .woocommerce input.button.alt:disabled[disabled]:hover {
    background-color: #23a455 !important;
    }
    .woocommerce #respond input#submit.alt:hover, .woocommerce #respond input#submit.alt:focus, .woocommerce a.button.alt:hover, .woocommerce a.button.alt:focus, .woocommerce button.button.alt:hover, .woocommerce button.button.alt:focus, .woocommerce input.button.alt:hover, .woocommerce input.button.alt:focus {
    background-color: #23a455 !important;
    }
    .woocommerce #respond input#submit:hover, .woocommerce #respond input#submit:focus, .woocommerce a.button:hover, .woocommerce a.button:focus, .woocommerce button.button:hover, .woocommerce button.button:focus, .woocommerce input.button:hover, .woocommerce input.button:focus, .woocommerce .jupiterx-wc-loadmore:hover, .woocommerce .jupiterx-wc-loadmore:focus {
    border-color: #23a455 !important;
    }
    .woocommerce #respond input#submit:focus, .woocommerce #respond input#submit.focus, .woocommerce a.button:focus, .woocommerce a.button.focus, .woocommerce button.button:focus, .woocommerce button.button.focus, .woocommerce input.button:focus, .woocommerce input.button.focus, .woocommerce .jupiterx-wc-loadmore:focus, .woocommerce .jupiterx-wc-loadmore.focus {
    box-shadow: none !important;
    }

     

    Looking forward to your reply.

    Regards.

    jordi.blanch-78b25780

    Hello,

    at least in my case, if I search for a “WooCommerce compatible” theme, what I am searching for is a theme that is also “theming” the WooCommerce part of my WP site, and not a theme that only “will not break my WooCommerce” which seems your understanding of a “WooCommerce compatible theme”. The main reason to buy a theme (at least for me) is to give my WP/WooCommerce site a better look. If the theme is not changing anything from the WooCommerce part, then it shouldn’t be announced as WooCommerce compatible because it is not doing it’s main purpose, i.e., giving the site a better look.

    Maybe I’m the only person in the world that buys a theme to change the look of a WP/WooCommerce site… but I doubt it… so I don’t think I’m wrong asserting that your theme is not compatible with WooCommerce because it doesn’t change anything in the WooCommerce part of the site.

    Anyway, I also added the last CSS code you sent to me, but it didn’t change anything, still many things in blue color in the WooCommerce part of my JupiterX themed site. When I hover on buttons some of them change to blue, some of them remain green… Combo boxes still in blue… so your CSS code doesn’t seem to work very well…

    Tatyana Hutsol Support Team

    Hello,

     

    Could you please show pages where the buttons are still blue?

    I checked single product, cart, checkout pages, but didn’t see the blue buttons.

     

    Looking forward to hearing from you.

    Regards.

    jordi.blanch-78b25780

    Log into your account:

    https://cityadpro.com/my-account/edit-address/facturacion/ -> open Country and Province dropdown, selected item is blue.

    https://cityadpro.com/producto/plan/ -> Choose option dropdown, selected item is blue.

    https://cityadpro.com/cart/ -> step number circle is blue

    Now I cannot see any buttons turning blue when mouse hovers over them, so maybe last time I didn’t reload the webpage after CSS changes.

    Tatyana Hutsol Support Team

    Hello,

     

    Sorry for a delay.

    Please add this css code:

    .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: #23a455 !important;
    }
    .jupiterx-wc-step-active .jupiterx-wc-step-number {
    background-color: #23a455 !important;
    }

     

    Dropdown color here https://cityadpro.com/producto/plan/ can’t be changed as it depends on the browser styling, there is no css code for it. You can use this plugin https://wordpress.org/plugins/woo-variation-swatches/ to style variations differently instead of using a dropdown list.

     

    Thank you.

    Regards.

    jordi.blanch-78b25780

    Ok, thank you.

    Tatyana Hutsol Support Team

    You’re most welcome.

     

    Regards.

    Private
    Oliver Fröhner
    This reply has been marked as private.
    Amir Rather Support Team

    Hi Oliver,

    The above CSS should work for you too, give it a try and let us know.

    Regards

Viewing 17 posts - 1 through 17 (of 17 total)
You must be logged in to reply to this topic.
Login