HOW TO CHANGE BORDER COLOURS AND WEIGHTS ON CERTAIN PAGES – SEARCH BOXES – CART PAGE-CHECKOUT PAGE

This topic has 4 replies, 3 voices, and was last updated 1 weeks ago ago by Jack Richardson

  • Avatar: Ravinder
    Ravinder
    Participant
    May 14, 2025 at 12:05

    Hi I want to change certain line / border colours/ border line weights of certain boxes and sections on different pages.

    1. Home search bar (see attached)

    I would like to change colour and border line weight of the search box on the homepage

    2. Cart page button and coupon box (see attached)

    I would like to change colour and border line weight of the coupon box on the cart page

    3. Checkout page box colour and border thickness (see attached)

    I would like to change colour and border line weight of the Billing detail boxes

    4. Checkout page additional information bar colour and border thickness. (see attached)

    I would like to change colour and border line weight of the Additional Information box

    5. Checkout page product order box – inline colour and thickness (see attached)

    I would like to change colour and border line weight of two lines – one below ‘your order’ and the other above ‘sub total’.

    6. Cart checkout page header label colours (see attached)

    I would like to change the colour of the labels in the header of the cart and checkout process – when active and not when active as colours are different

    Side cart button colours and ‘my cart’ word (see attached)

    I would like to change the colours of the checkout buttons – when active and not active – also would like to change the colour of the ‘My cart’ word in the side cart header – when active and not active

    I am using WP Code lite plugin – if you can provide me with code snippets for each of my queries, I would be very grateful grateful.

    If something can be changed without coding snippets in my 7 queries please let me know.

    Regards

    Ravinder

    Files is visible for topic creator and
    support staff only.
    3 Answers
    Avatar: Alex Carter
    Alex Carter
    Support staff
    May 14, 2025 at 14:39

    Hello,

    Thank you for reaching out to us.

    1/ XStore Builders > Header Builder with Eleemntor > edit template > Search element settings > https://prnt.sc/8Yhdy-chFOGu

    2/ Theme Options > Styling > Input > Border color and settings for buttons

    3/ Edit Checkout page using Elementor > https://prnt.sc/d-3meMeD287M

    4,5/ Edit Checkout page using Elementor > https://prnt.sc/ZmW6i20J3nUd

    6/ We did for you the next: go to Elementor settings and unselect the color for links – https://elementor.com/help/change-link-color/

    Header Builder with Elementor > edit template > settings of elements, for example – https://prnt.sc/6FHpxq2P4EXy

    If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

    Warm Regards,
    The 8Theme Team

    Avatar: Ravinder
    Ravinder
    Participant
    June 15, 2025 at 08:39

    Hi realised that after the changes on checkout page – a certain issue has occurred .

    1. when a customer fills out boxes in checkout page, but forgets to fill in certain mandatory boxes – your theme would highlight the boxes that need filling in – but those colours don’t show now.

    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    June 16, 2025 at 10:43

    Dear @Ravinder,

    We kindly suggest trying the following CSS code snippet to address the issue:

    .etheme-elementor-cart-checkout-page-wrapper .woocommerce-input-wrapper input[aria-invalid=true] {
        border-color: red !important;
    }

    You may add this code by navigating to Theme Options → Theme Custom CSS → Global CSS.

    Please let us know if this resolves the issue or if you need any further assistance.

    Best regards,
    Jack Richardson
    The 8Theme Team

  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

Helpful Topics

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.