Viewing 15 replies - 1 through 15 (of 19 total)
  • Search your theme css. Open with editor and search: background: linear-gradient(to left, rgba(0,0,0,.3), rgba(0,0,0,.0) 50%, rgba(0,0,0,.3)), linear-gradient(#d77d31, #fe8417, #d77d31);

    Thread Starter semaystudio

    (@semaystudio)

    I don’t see any “to left” to apply this to. Here is what my editor reads. Can you guide me here? Thanks!

    /* Form fields, general styles first. */
    button,
    input,
    textarea {
    border: 2px solid #d4d0ba;
    font-family: inherit;
    padding: 5px;
    }
    
    input,
    textarea {
    color: #141412;
    }
    
    input:focus,
    textarea:focus {
    border: 2px solid #c3c0ab;
    outline: 0;
    }
    
    /* Buttons */
    button,
    input[type=”submit”],
    input[type=”button”],
    input[type=”reset”] {
    background: #e05d22; /* Old browsers */
    background: -webkit-linear-gradient(top, #e05d22 0%, #d94412 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #e05d22 0%, #d94412 100%); /* W3C */
    border: none;
    border-bottom: 3px solid #b93207;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    padding: 11px 24px 10px;
    text-decoration: none;
    }
    
    button:hover,
    button:focus,
    input[type=”submit”]:hover,
    input[type=”button”]:hover,
    input[type=”reset”]:hover,
    input[type=”submit”]:focus,
    input[type=”button”]:focus,
    input[type=”reset”]:focus {
    background: #ed6a31; /* Old browsers */
    background: -webkit-linear-gradient(top, #ed6a31 0%, #e55627 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #ed6a31 0%, #e55627 100%); /* W3C */
    outline: none;
    }
    
    button:active,
    input[type=”submit”]:active,
    input[type=”button”]:active,
    input[type=”reset”]:active {
    background: #d94412; /* Old browsers */
    background: -webkit-linear-gradient(top, #d94412 0%, #e05d22 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #d94412 0%, #e05d22 100%); /* W3C */
    border: none;
    border-top: 3px solid #b93207;
    padding: 10px 24px 11px;

    [Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]

    • This reply was modified 9 years, 3 months ago by bdbrown.

    Do you want to change the color or do you want to add a background image?
    Is that code the button?
    You know the color is? example: #xxxxxx

    Thread Starter semaystudio

    (@semaystudio)

    I’d like to change the background color of the button. The button should be black and the text should be white.

    Maybe I’m looking in the wrong place?

    Tell me what your theme is called and where to download, I’ll install and search.

    Thread Starter semaystudio

    (@semaystudio)

    I’m using a Twenty Thirteen Child Theme. Thank you.

    Thread Starter semaystudio

    (@semaystudio)

    Any luck?

    Child Theme?

    Look for this

    you site\wp-content\themes\twentythirteen\style.css

    Is the same code that you uploaded, the one up.
    Change the following color: #e05d22,#d94412 for: #000

    Resultado:

    /* Buttons */
    button,
    input[type=”submit”],
    input[type=”button”],
    input[type=”reset”] {
    background: #000; /* Old browsers */
    background: -webkit-linear-gradient(top, #000 0%, #000 100%); /* Chrome 10+, Safari 5.1+ */
    background: linear-gradient(to bottom, #000 0%, #000 100%); /* W3C */
    border: none;
    border-bottom: 3px solid #b93207;
    border-radius: 2px;
    color: #fff;
    display: inline-block;
    padding: 11px 24px 10px;
    text-decoration: none;
    }

    [Moderator note: code fixed. Please wrap code in the backtick character or use the code button.]

    • This reply was modified 9 years, 3 months ago by bdbrown.

    You can also change the color border:
    border-bottom: 3px solid #b93207; 🙂

    Thread Starter semaystudio

    (@semaystudio)

    Awesome thank you! This worked!

    Would you by chance be able to answer another formatting question? It’s CSS or php specific. I can’t figure out how to increase my catalog images in size in my shop, while keeping 4 images per row on my desktop and 2 images per row on my mobile. If you’re able to answer this I’ll disable my maintenance page after a reply.

    Thank you!

    I need to know which catalog plugin you are using.
    you site? semaystudio.com

    Thread Starter semaystudio

    (@semaystudio)

    WooCommerce! For http://www.semaystudio.com

    Thread Starter semaystudio

    (@semaystudio)

    Also, my MailChimp embedded signup form on my FOOTER has green text saying “thank you for signing up” once somebody does. Do you know how I can turn this to white text instead of green?
    I’ve reached out to MailChimp, but they said its coding specific with WordPress.

    I’ll make you a video tutorial to learn.

Viewing 15 replies - 1 through 15 (of 19 total)

The topic ‘Change Button Color’ is closed to new replies.