Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #240130
    Edwin
    Participant

    Hello,

    I have changed the color scheme for my website and need to adjust the color of the titles and headings for my product tabs https://www.newpassportpro.com/product/st-lucia-citizenship-by-investment/

    Will you kindly send me the code for this?

    Thank you,
    Edwin

    #240131
    Edwin
    Participant

    Hello, I found the code to change the titles, but I still need the code to change the heading color. Please advise – Thank you!

    #240141
    Skandha
    Keymaster

    @mmhgloba: Hello Edwin,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    .product_title.entry-title {
        color: #fff456 !important;
    }

    You can change the color according to your choice.
    Let me know if this what you want!
    Kind Regards,
    Skandha

    #240600
    Edwin
    Participant

    Thanks Skandha.
    There is one more issue…

    I need to change the search border color for the search box in mobile and desktop. It is not possible to change the color in customizer. The border color and also the X color in mobile need to be adjusted.

    Can you fix it?

    Thank you.

    #240610
    Skandha
    Keymaster

    @mmhgloba: Hello Edwin,
    To change the border color of search box and X icon
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    #header-right .header-search-wrap {
    	border-color: #157985;
    }
    #header-search {
    	color: #157985;
    }

    You can change the color according to your choice.

    Let me know if this is what you want!
    Kind Regards,
    Skandha

    #241965
    Edwin
    Participant

    Can you help me change the woocommerce add to cart button style? I have been looking all over for the code but nothing seems to work.

    I want to make the color transparent and add a border, also change the text color and style. I also want to adjust the hover style accordingly.

    here is a product page from my website: https://www.elitepassports.com/product/grenada-citizenship-by-investment/

    Thanks for any assistance you can provide…

    #241981
    Skandha
    Keymaster

    @mmhgloba: Hello Edwin,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    .button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
        background-color: transparent;
        border: 1px solid #000;
    }
    .button.product_type_simple.add_to_cart_button.ajax_add_to_cart:hover {
        background-color: #f23456;
        color: #fff;
    }

    You can change the color according to your choice.
    Let me know if this is what you want!

    Kind Regards,
    Skandha

    #242045
    Edwin
    Participant

    Hi Skandha, thanks for the feedback.

    I tried to insert the code as a whole, but it didn’t work. However, I took the snippit “border: 1px solid #000;” and added it to the code I was already using and it worked well. Also, I added this snippet to round out the corners of the button: “border-radius: 10px;” Everything is fine but for one issue in the chrome browser (I noticed this on desktop).

    When I click the add to cart button, the radius expands to where the corners used to be. Can you fix this?

    Here is the css code I am using in total:

    .woocommerce form.cart button.button {
    background-color: #ffffff;
    border: 1px solid #205996;
    border-radius: 10px;
    color: #2a8fbf;
    }
    .woocommerce form.cart button.button:hover {
    background-color: #137eb0;
    border: 1px solid #205996;
    border-radius: 10px;
    color: #ffffff;
    }

    Also, here is a link to view the issue: https://www.goldenbuddha.net/product/oxidized-copper-15-25-chenrezig-statue-gold-face-painted/

    In mozilla firefox it works fine, but I tried it in chrome and I noticed this issue.

    Thank you for your help.

    Edwin

    #242192
    Skandha
    Keymaster

    @mmhgloba: Hello Edwin,
    Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    /* To remove the outline when the add to cart button is clicked in chrome */
    button {
        outline: none;
    }

    Let me know if this works out!
    Kind Regards,
    Skandha

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