Return to previous page

Email & Newsletter Form in Footer not displaying properly

This topic has 6 replies, 2 voices, and was last updated 8 months, 3 weeks ago ago by Luca Rossi

Jade

Participant

April 2, 2024 at 05:59

Hello,

I have a form that I embedded into my footer. The formatting is not displaying properly and I was wondering if someone knows the coding or a way to make it smaller so it fits better into the footer please and thank you.

Please, contact administrator
for this information.

Files is visible for topic creator and
support staff only.

#389601 Copied Theme version: 9.3.2

5 Answers
Luca Rossi

Support staff

April 2, 2024 at 07:29
Dear Jade,

We hope this message finds you well.

Could you please insert the following CSS code into the designated area of our website? Navigate to Theme Options, then select Theme Custom CSS, and finally, paste the code into the Global CSS section:
```
label.omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eed-legal {
    padding: 0 !important;
    margin-bottom: 15px !important;
}

input#omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eed-checkbox {
    height: 30px;
}

div#omnisend-form-6607328d7a3b55dd1852502d-field-660733f9ce436a532a3e1eeb,
.omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eec {
    padding: 0;
    margin-bottom: 15px;
}

input#omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eeb-emailField-input,
input#omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eec-phoneNumberField-input {
    padding: 15px !important;
    height: 45px !important;
}

.omnisend-form-6607328d7a3b55dd1852502d-text-6607381dce436a532a3e1f96 {
    padding: 0;
}

.omnisend-form-6607328d7a3b55dd1852502d-field-container-660733f9ce436a532a3e1eec-phone-number-prefix {
    height: 45px;
}

.omnisend-form-6607328d7a3b55dd1852502d-action-container-660733f9ce436a532a3e1eee {
    padding: 0;
}
```
We trust that the implementation of this code will contribute positively to the website’s functionality. Should you require any further assistance, please do not hesitate to reach out.

Best regards,
The 8Theme Team
#389612 Copied
Jade

Participant

April 2, 2024 at 09:06

Hello,

I uploaded the code but there isn’t any difference in the form.

#389631 Copied
Luca Rossi

Support staff

April 2, 2024 at 10:06
Hi @Jade,

We’ve updated the custom CSS to this:
```
/* newsletter */
div#newsletter input[type='email'],
div#newsletter input[type='tel']
div#newsletter div[role="combobox"] {
    padding: 10px !important;
    height: 30px !important;
}
div#newsletter button {
    padding: 10px !important;
}

div#newsletter .omnisend-mobile-container > div {
    padding: 0 10px !important;
    margin-bottom: 15px;
}
```
And now the spacing is smaller, can you check?

https://prnt.sc/wWhSXf4ZpUtz

Best regards,
The 8Theme Team
#389641 Copied
Jade

Participant

April 2, 2024 at 10:32

Awesome thank you so much this looks much better.

#389647 Copied

Luca Rossi

Support staff

April 2, 2024 at 10:59

We are pleased to extend our warmest welcome to you.

Please feel free to modify the padding or margin settings as per your requirements.

Kind regards,
The 8Theme Team

#389652 Copied
Tagged: email form display issue, email form woocommerce solution, newsletter footer problem, woocommerce email troubleshooting, woocommerce newsletter display, wordpress footer fix, wordpress woocommerce templates
Viewing 6 results - 1 through 6 (of 6 total)