Support » Plugin: Easy Forms for MailChimp » Style Submit button

  • Resolved PeteGeek

    (@petegeek)


    Before I start I’d like to thank you for an amazingly helpful plugin.

    I’ve been looking to restyle the form submit button and have discovered, from reading similar Support posts, that I’ll be required to change the Easy MailChimp Forms core files. Not a great option when updates come along as you know lol

    Would you consider placing a custom style option for form fields to the next release please? Something similar to how Contact Form 7 allows inclusion of theme classes.

    Thank you 🙂

    https://wordpress.org/plugins/yikes-inc-easy-mailchimp-extender/

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Evan Herman

    (@eherman24)

    Hi Pete,

    You can style the submit button without much issue. There is currently a class on the submit button which enables styling.

    The class applied to each submit button is .ykfmc-submit.

    Here is an example of a flat green button applied to the submit button:

    /* Green Flat Button Styles */
    .ykfmc-submit {
      position: relative;
      vertical-align: top;
      width: 100%;
      height: 60px;
      padding: 0;
      font-size: 22px;
      color: white;
      text-align: center;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
      background: #27ae60 !important;
      border: 0;
      border-bottom: 2px solid #219d55 !important;
      cursor: pointer;
      -webkit-box-shadow: inset 0 -2px #219d55;
      box-shadow: inset 0 -2px #219d55;
    }
    .ykfmc-submit:active {
      border-top: none !important;
      top: 1px;
      outline: none;
      -webkit-box-shadow: none;
      box-shadow: none;
    }

    If you wanted to add seperate styles depending on the form, you could use the ID applied to the entire form.

    Something like :

    #yks-mailchimp-form_0-fd93b3bdaa .ykfmc-submit would add the styles only to the 0-fd93b3bdaa form submit button.

    You’ll want to add these styles into your theme or your child themes style.css file. I’ve tested the above on a TwentyThirteen theme installation, and things seem to work without a hitch.

    Let me know if that helps!

    Thanks,
    Evan

    Hi Evan,

    I did take the quick and nasty shortcut by editing the core files but I’ll do this as well before the next update. Better that way so I don’t have to worry about looking for the styling call in the php file again.

    Especially since I’ve already forgotten which file it was I edited…

    I’ll get back to you if there are any issues but I don’t see anything going wrong if I place my own styling for ykfmc-submit in the theme CSS override.

    Thanks for getting back to me.

    Cheers,
    Pete.

    Plugin Author Evan Herman

    (@eherman24)

    Hi Pete,

    No problem at all. You probably changed the submit button inside of shortcode_form.php.

    Best,
    Evan

    Hi Evan,

    I went looking for it again just in case anyone else stumbles across this question.

    I edited the class.yksemeBase.php file and replaced the two ykfmc-submit calls with my own theme’s button CSS.

    Cheers,
    Pete.

    Hey there,

    I’m trying to use an image and also need to remove the word “Submit”.
    Darn – everything else works except for this 🙁

    Actually – color:transparent should do the trick I think?

    Plugin Author Evan Herman

    (@eherman24)

    Hi worth designing,

    Please start up your own thread, explain the issue you are facing and what you have tried to resolve it. Then you can provide a link to your site so we can take a look. This is a resolved thread and will no longer be viewed or receive responses.

    Thanks
    Evan

    Sorry Evan! I fixed it though.

    Thanks for the great support – gave the plugin a 5 star rating.

    Plugin Author Evan Herman

    (@eherman24)

    No problem at all, and thanks for the positive review! Have a wonderful afternoon!

    Evan

    Will do – though I’m an Aussie and it’s 10.25pm! But glad to give a positive review 🙂

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Style Submit button’ is closed to new replies.