Creating a Contact Form with Kadence Blocks

Walk-through and review of the Kadence Form Block.
Text version available at WebTNG.com: www.webtng.com...
Visit the Kadence WP website: www.webtng.com...
(affiliate link)
I'm now using the Fluent SMTP plugin. It is free, has broad support, and logging: wordpress.org/...

[@W.M-g5d]

Your video is thorough and to the point. I was able to create a contact page by following along. Thanks!

[@daviddavis670]

Thank you for making Kadence information. I really like the product and appreciate learning how it works.

[@DavidMcCan]

You are welcome. Thank you for taking the time to post a positive comment.

[@cd38plus]

Thank You for tutorial:) I just love your calming voice!

[@DAvery-cu6zi]

Really helpful video, thanks for posting it!

[@wendtkuhnfromjordanwood6325]

Very helpful and delivered very clearly. Thanks!

[@jacek1366]

Thanks it was very useful!

[@GardeniaLimo]

V. good tutorial, thank you

[@jamesmarsh4047]

thanks david

[@realphil2685]

Thanks heaps mate!..... id hug you if u were infront of me right now hahahah

[@pahtashow]

It was a plasure to watch and learn from your kadance form video. It is the best (simple) form on the Net. But I am confused when you start explaining about WP Mail SMTP Plugin and not showing how to use it with kadance form. There is a setting that I need to change in kadance form to make WP Mail SMTP Plugin work with kadance form ?

[@DavidMcCan]

There is nothing you need to do with Kadence as regards the STMP plugin. You just configure your SMTP plugin and test that it works using the test option it provides. It is the default sending mechanism, so there is nothing special you need to do with your Kadence form. By the way, I'm using the FluentSMTP plugin now because it does not have an upsell and it has more features.

[@thejoshr]

thanks David, very useful! what are the export capabilities of the database entry pro feature? i can't find that information anywhere. many thanks again!

[@DavidMcCan]

There is an option to export to CSV.

[@pushfully2966]

Hi David. One question. You mentioned in your blog that you're using Fluent forms. Just wondering why. Is there any advantage to that over the native kadence form?

[@DavidMcCan]

I use it for newsletter signup. It has integrations with the platforms I use. I've also used it for creating questionnaires / surveys. If you just need basic forms the Kadence form option is nice because you don't have to install an extra plugin.

[@Ionabear]

Is there any way to change the text on the button? I hate "Submit". Can we change it to 'Sign Up" or "Join" or something else?

[@DavidMcCan]

Yes. It might not be obvious, but you can just click on the button and start typing the text you want.

[@jeanparacelse]

In the redirect settings, how do I dynamically append one of the form fields value to the redirect url?

[@DavidMcCan]

Good question. I tried putting in a URL like this kadence.local/?test={field_2} or this kadence.local/?test={kb_field_1} but the variable didn't get substituted. I saw in one of the help docs where it had {form_1} as a variable in relation to sending an email, but that idea didn't work for the redirect. You might have to ask support.

[@TopGamesEntertainment]

Thx David .. can I link it with Google sheets ?

[@DavidMcCan]

Doesn't look like it. The options are email, redirect, auto respond email, database entry, Mailerlite, FluentCRM, SendInBlue, MailChimp, and WebHook. Perhaps if you could create a webhook.

[@nakedimontsho913]

HI, is there a way on the form setting where i can be able to prevent multiple or duplicate form entries, i want user to submit form once but not twice

[@DavidMcCan]

I haven't seen anything along those lines. You might need to ask support.

[@mrnargil]

You should hide your form after success message. Create a custom HTML block under your form with this code:
document.addEventListener("DOMNodeInserted", function ck(){ if (document.querySelector(".kadence-blocks-form-message.kadence-blocks-form-success")) {
document.querySelector(".kb-form").style.display = "none";
}})

[@DavidMcCan]

@@mrnargil - Thank you for sharing the code snippet. Very helpful.

[@Atakanstinkt]

Is there a way to make the form side by side and not one below the other?

[@DavidMcCan]

There is some control in that you can move the fields up or down, to order them, and you can set the field width, so if you, for example, set two fields to 50% then they will go side by side. However, it doesn't have as much easy control as a dedicated forms plugin.

[@andy9435]

Can you not style the forms like you can in Thrive Architect or Elementor?

[@Elementor360]

There are quite a few styling options. Was there something in particular?