Contact Form Malfunction

  • Resolved eoart

    (@eoart)


    2 years ago

    Thank you for taking the time to read my information. I just went live with my new website & am having difficulties with the contact form from WPForms. I only added a checkbox that is checked by default to the base form.

    I have tried a number of things to get it functional, but it doesn’t look the way it should. I had to deactivate reCaptcha invisible v2 for the form to submit. The reCaptcha initially worked before going live but then I got an “Error for Site Owner: Invalid Site Key” notice on the page. In the settings, I turned on Load assets globally & No-conflict mode in recaptcha, testing each individually. Neither had an effect. The Enable AJAX From Submission setting is on.

    After disabling reCaptcha on the form settings, it will send, but the checkbox is white with no check. When you click on it, it turns a very light gray which actually means it is unchecked. I tested this. Also, the background in the form fields is the color of my page background, which is relatively dark. The input text was dark but not black & very difficult to read.

    The form Styling was set to Base & Form Theme Styling. I tried the other settings & have left it on Base Styling, now, as this fixed the check box & made the input text black. But the submit button is very small & the background is still the same as the page. The form looked better set to Base & Form Theme Styling, but was not useful.

    There were no events listed in the log & no errors reported when debugging was activated. The SSL tested successfully.

    Host: Bluehost
    Theme: Sinatra
    Other plugins: WP mail SMTP, Yeost SEO, UpDraft Plus, All in one WP Security, Creative Mail (not tested), Jetpack, … Boost, & … CRM.

    I am grateful for any assistance you can offer as I’m out of ideas. Thank you.

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

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Support Kenneth Macharia

    (@kmacharia)

    Hey @eoart,

    Thank you for contacting us, we would be happy to help.

    I’ve reviewed your contact form and it looks like reCAPTCHA version 2 is currently activated, the form also seems to work as expected for me. Here is a screencast.

    Would you mind letting me know if I’m missing anything?

    Thanks. ??

    Thread Starter eoart

    (@eoart)

    Hi @kmacharia,

    Thank you for taking a look. Yes, I registered a new set of keys & got the reCaptcha to work. The remaining problems with the form are mainly aesthetic. Although it would have been preferential to have it set to Base & Form Theme Styling, the checkbox doesn’t work that way. The form fields should be white, so they are easy to read, but they are the same color as the background with only a thin outline. This is the most important aspect, as it makes the form difficult to read. The text is black as you’re typing but turns a gray color after moving out of the field. And the submit button is quite small. Do you know why the fields would not be white? (I get a blank white page when I try to look at your screencast, but assume you are seeing the same thing that I see when viewing from an incognito window.)

    Thanks for your help.
    E

    Plugin Support Kenneth Macharia

    (@kmacharia)

    Hi @eoart,

    Thanks for getting back to me.

    It looks like there could be a styling conflict between the site theme and the forms. To fix this, please try the following custom CSS snippet:

    #content input[type="text"]{
  background-color: #FFFFFF;
}
.wpforms-submit{
    color: #FFFFFF;
    border-color: rgba(0,0,0,0.12);
    border-width: 1px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #008de5;
    min-height: 57px;
    width: 20%
}

    And in case it helps, here’s a tutorial on how to add custom CSS like this to your site.

    Hope this helps!

    Thread Starter eoart

    (@eoart)

    Hi @kmacharia

    Thanks for the instructions & the code! It’s definitely very helpful. It worked partially. The Name fields turned white & the button was fixed. The I talked with a friend who used to do a little coding, although he never worked with WordPress. He tried a few things which fixed parts but made other things on the site wrong. Ultimately, he ended up making the following changes to the first part & an addition.

    #content input[type] :not(comment-submit) :not(input[type=”checkbox”]) {
    background-color: #FFFFFF;
    }
    #content textarea {
    background-color: #FFFFFF;
    }

    Thank you again for your help!

    Prashant Rai

    (@prashantrai)

    Hey @eoart – We’re happy to hear that you were able to make the changes. In case you have any questions, please feel free to reach out.

    Kindly,

    Hey @eoart – We haven’t heard back from you in three days, so I’m going to go ahead and close this thread for now. But if you’d like us to assist further, please feel welcome to continue the conversation.

    Thanks!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Contact Form Malfunction’ is closed to new replies.