How to customise Doobox Contact form with css

1

Some smarter types than me have just helped me with this on another thread, and I know a few have posted in the past about this one, so figured I’d share the solution.

If you want to style the input boxes and send button in DooBox Contact form, do this…

  1. Add the class dooCon to the Stacks4 custom class option in settings.

  2. Add the following css to the global css box…

    .dooCon [name=“input”] {
    padding: 10px !important;
    width: 100%;
    font-size: 14px;
    background: #FFFFFF !important;
    color: #555555 !important;
    margin: 0;
    border: 0px solid #464646 !important;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px !important;
    }

    .dooCon [name=“sendmail”] {
    margin-top: 20px !important;
    padding: 8px 25px 8px 25px !important;
    display: block;
    text-align: center !important;
    font-size: 1rem !important;
    color: #444444 !important;
    border: 1px solid #D8D8D8 !important;
    background-color: #FFFFFF !important;
    -moz-border-radius: 25px !important;
    -webkit-border-radius: 25px !important;
    border-radius: 25px !important;
    cursor: pointer;
    }

  3. Edit the code above to suit your desired style.

Thanks to @habitualshaker and @tav for the help on that one.

5 Likes
2

Good post. Maybe others could add their Contact Form customisations here.

1 Like
3 
*{
display:none!important
}

I don’t want people contacting me :)

4 Likes