Docs

[artthescience]

Hi there,

I have 3 questions relating to to mailchimp forms.

1) How do I change the font size of the title?

2) How do I change the placeholder background colour?

3) I have added this code to make an inline form into the page CSS where the form is located:

.x-subscribe-form {
    max-width: 700px !important;
}

.x-subscribe-form fieldset {
    display: inline;
}

.x-subscribe-form input[type="submit"] {
    margin-top: 0;
}
.x-subscribe-form fieldset {vertical-align: top;}
  
.x-subscribe-form input[type="submit"] {height: 35px;}

::-webkit-input-placeholder {
    color: #fff !important;
}
:-moz-placeholder {
    color: #fff !important;
}
::-moz-placeholder {
    color: #fff !important;
}
:-ms-input-placeholder {
    color: #fff !important;
}

How do I have 2 differently customized versions of my form? For instance the one above looks horrible on mobile, so I was going to make the one above visible on larger screens and make a new email form for mobile, but since the above CSS is global, it affects all forms.

Thank you!

[Rupok]

Hi there,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[artthescience]

This reply has been marked as private.

[Joao]

Hi There,

Please add the following code to Appereance > Customizer > Custom > CSS

1) How do I change the font size of the title?

.x-subscribe-form-1723 h1 {
      font-size: 20px;
}

2) How do I change the placeholder background colour?

.x-subscribe-form input[type="email"] {
    background: red;
}

3) I have added this code to make an inline form into the page CSS where the form is located:

Update your code to :

@media(min-width: 769px) {
.x-subscribe-form {
    max-width: 700px !important;
}

.x-subscribe-form fieldset {
    display: inline;
}

.x-subscribe-form input[type="submit"] {
    margin-top: 0;
}
.x-subscribe-form fieldset {vertical-align: top;}
  
.x-subscribe-form input[type="submit"] {height: 35px;}

::-webkit-input-placeholder {
    color: #fff !important;
}
:-moz-placeholder {
    color: #fff !important;
}
::-moz-placeholder {
    color: #fff !important;
}
:-ms-input-placeholder {
    color: #fff !important;
}
}

Hope it helps

Joao

[Author]

Posts