Hot to customize buttons' colour? - by ckcreativekitchen

This topic has 4 replies, 2 voices, and was last updated 7 years, 3 months ago ago by 8theme

  • Avatar: ckcreativekitchen
    ckcreativekitchen
    Participant
    January 11, 2017 at 13:12

    Hi Support,
    I have several issue with formatting buttons and label in XStore child theme.
    1. I would like to recolor and rename “view cart and view wishlist” buttons, currently they are black.
    2. There is a sales label on product boxes. I customized the text into % but how can I recolor and reshape this label? I would like to adjust the red circle to blue heart, is it possible to reshape?
    3. There is “add to cart button” on wishlist page, the color is gray and the hoover currently is black, how can I customize this hoover color being red?
    4. There is a “add to cart button” on product page currently it is black with gray hoover. How can I recolor the filling and the hoover?
    4. There is a Newsletter box in pre-footer, how can I recolor this box?
    5. On home page there is a section featured categories and some product boxes in it. How can I recolor and rename the “browser – add to cart – wishlist” button?

    Thanks your answer in advance!
    Regards,
    Zsuzsanna

    3 Answers
    Avatar: 8theme
    8theme
    Support staff
    January 11, 2017 at 15:10

    Hello,

    Your request requires additional customization and can be done only as a paid service.

    Regarding changing names of some buttons you can read how to translate our theme in the documentation http://xstore.helpscoutdocs.com/article/30-base-theme-translation

    Regards

    Avatar: ckcreativekitchen
    ckcreativekitchen
    Participant
    January 11, 2017 at 15:40

    Hi,
    Thanks the smart reply! Your answer really surprised me taking into consideration that others get the help from support to change the style, letter case, colour of the theme for instance here: https://www.8theme.com/topic/theme-changes/.
    What is the reason that sometimes Support help to solve the problem and in my case I have to pay for it? Interesting…

    Avatar: 8theme
    8theme
    Support staff
    January 12, 2017 at 08:53

    Hello,

    Sorry for inconvenience. Here is a code example that demonstrates how you can edit these colors

    /* Wishlist and Cart buttons hover */
    .et-wishlist-widget .wishlist-dropdown .buttons .btn-view-wishlist:hover,
    .shopping-container .btn-view-cart:hover{
    	background-color: #yourColor !important;
    }
    
    /* Heart as background in sale label */
    .content-product .sale-wrapper.with-percentage .sale-value{
    	background: url(http://www.nobbymart.com/wp-content/uploads/2017/01/breadcrumb_6.png); /* we use heart from breadcrumbs */
        border-radius: 50%;
        background-size: 250px;
        background-repeat: no-repeat;
        background-position: center;
        width: 4.4rem;
        height: 4.2em;
    }
    
    /* Button hover on wishlist page */
    .woocommerce table.wishlist_table td.product-add-to-cart a:hover{
    	background-color: #yourColor;
    }
    
    /* Button hover on single product page */
    .single_add_to_cart_button:hover{
    	background-color: #yourColor !important;
    } 

    Regards

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

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

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