Validation Message Display for 2-Column

Hi jenn2133,

Can I test this for you?
Perhaps that I can help you.

Validation message = that message has been sent pure for the visitors on your website? ??

Hi Basz85,

If you can help it would be great!

If you go to the page: https://74.220.219.143/~flavourd/daizen/?page_id=1388
and just select the disclaimer checkbox at the bottom, then click “register”, you will get a validation message / error message.

The red line should only appear around the message – not the entire form. I am not sure how to correct this. I believe this same result would render for any of the default validation messages within the form.

Looking forward to your reply & thanks.

Hi Jenn2133,

Sorry for delay about my answer (different timezones)

I’ve tested and here comes the validation message under the form now. Did you resolve this? If so well done!

Greetings,
Bas

Yes! I received help from the Avada theme forum for this. I was not sure that this fell within their scope of support so I posted here, too.

Here’s the CSS fix in case anyone else is following:

.wpcf7-validation-errors {
clear: both;
content: ” “;
}

@jenn2133 – That is definately not a fix that I would recommend others use.

The CSS they have given you is removing the content of any validation errors that CF7 gives to inform users of any problems they may have when using your forms.

It would be much better if they gave you are proper solution which displays the CF7 form errors in an appropriate location in your form. It’s not so hard to do this that they need to give you the inappropriate solution you recieved.

Hi Buzztone,

It seems to be working as my form is still generating validation error messages for incomplete forms as well as success/thank you messages.

This is probably a more relevant topic for this forum, as opposed to the theme forum – can you suggest a more appropriate fix?

I just tested your form at https://74.220.219.143/~flavourd/daizen/?page_id=1388 and got no validation error messages until I ticked the “(Required) The information collected is not shared with any other party etc.” box.

That was the result even before the fix from the Avada forum…

I have other single-column forms that work perfectly – not sure why this 2-column form is not working smoothly!

RE: That was the result even before the fix from the Avada forum…

OK – so you are using an Acceptance field to implement that. Sorry – I missed that.

You might consider changing the content of your form in this area to make clearer that users need to tick that at the start of filling in your form.

I know this is unusual for Contact Form 7. Normally there are validation errors generated at any incomplete step.

I need to do a bit more digging to see how I can make this form work more predictably.

Thanks for your feedback.

I had a look at your form via Firebug.

The CSS code the Avada fix is targeting in ../wp-content/plugins/contact-form-7/includes/css/styles.css is:

div.wpcf7-validation-errors {
    border: 2px solid #f7e700;
}

Maybe following code fix is more appropriate:

.wpcf7-validation-errors {
    border: none;
}

No. I do want the errors highlighted.

Thanks anyway.

Hi jen2133,

Great that your contact form 7 validation problem has been resolved! ??

Have a nice WordPress-day :)!

Sincerly,
Bas