How to add drop shadow to Newsletter form?

  • Resolved sanfordandson

    (@sanfordandson)


    2 years, 7 months ago

    Hello all,

    I want to add a drop-shadow to the Newsletter form. I also want to round the corners. I see some styling tools in the plugin’s settings, but I don’t see any way to accomplish what I need to do.

    I know I can add Custom CSS to an object, but I’m not seeing the class I need to reference when I use the browser tools and select the Newsletter.

    This form came from one of the built-in templates, and oddly enough, the bottom corners are rounded, but the top are not. But the biggest question is how to add the drop-shadow?

    Thanks in advance!

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Dani F. a11n

    (@danielinhou)

    Hi there @sanfordandson ????!

    Thank you for reaching out to MailPoet Support!

    While both questions are a bit outside of our scope of support, I’ll try to help!

    I have reviewed the form, and it seems that the form has border-radius on all the corners, but the image on top doesn’t. So the first thing will be to add border-radius to that image.

    This is a CSS code snippet that should work for that:

    .mailpoet_form_image img {
    margin: 0;
    max-width: 100%;
    border-radius: 10px;
}

    As per the shadow you can add this other CSS snippet:

    div#mailpoet_form_1 {
    box-shadow: 7px -5px #393939;
}

    And this would be the result: https://d.pr/i/JgXBvY

    I hope this helps!

    Cheers!

    Hi there @sanfordandson,

    We haven’t heard back from you in a while, so I’m going to mark this as resolved – we’ll be here if and/or when you are ready to continue.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to add drop shadow to Newsletter form?’ is closed to new replies.