Create a Working Contact Form in HTML that emails you (w/ spam prevention too!)

[@rebelleaf]

I was going bonkers trying to solve this situation for my site. Went through a few tutorial with no luck. This video though was exactyl what I needed. Clearly spoken, step-by-step. Thanks!

[@mythstory2901]

I really want to thank you. I was looking for this kind of tutorial for almost weeks and now I finally found this just because of you. it helps me a lot. Once again thanks a lot, please make more tutorial videos like this.

[@ADesignerWhoCodes]

You're very welcome!

[@shaadhashmi6773]

I am a developer who just knows how to design. I am a front end developer and plan to learn backend languages like javascript. But for a project that I needed to put on the internet as soon as possible; it also required backend. My site did not have many things that required a backend but I just had a contact page which had to be connected to a backend. I searched it on youtube and saw dozens of video but each time I either got an error or it didnt work. I wasted my 2 hours in this. I also had some other front end work remaining which would easily take 2-3 hours. I got panicked that I will not be able to do it before my deadline but then I found this video as a life saver without writing a single line of backend code I brought life to my contact page. Thanks a lot sir. I subscribed to your channel liked the video and shared it and from now on I will follow you on a regular basis. I pray that you go viral on the internet. Thanks. Regards Shaad Hashmi.

[@ADesignerWhoCodes]

Oh I've been in that panic before. So happy it helped you.

[@shaadhashmi6773]

@@ADesignerWhoCodes thanks for the reply sir. I have uploaded the contact form on the internet. you can see it at techfreak.epizy.com/contact.php please I request you to write something in the form. I will be so happy if I recieve something from you. Just a wish no force sir. Thanks from the bottom of my heart!

[@MustafaSheikh]

you make really good and useful tutorials . simple and easy to follow for a non-dev :)

[@JacktheLightningRipper]

Thank you for this presentation. I have been combing the internet trying to find the best way to make a contact function for my website for almost half a year. This helped out a ton.

[@ADesignerWhoCodes]

Oh sweet! You are so welcome.

[@jontarbuck3087]

Thank you so much for taking the time to create this video, it was exactly what I was looking for. You have saved me a lot of time :-)

[@ADesignerWhoCodes]

You are very welcome.

[@mknightdev]

Thank you again! I came here from your form video that you mentioned at the end of this one and fits my needs perfectly.

[@ADesignerWhoCodes]

You are so welcome! I'm stoked to have helped you.

[@WestonObermeyer]

This is a really, really good tutorial. Thank you

[@ashrefb]

The best video I watched that really helped me in 2022 I think. thank you so much man!

[@ADesignerWhoCodes]

Wow. That's such an awesome comment. You are so welcome.

[@dteqtivetuts3234]

Don't know why I always assumed there has to be backend work. This saves so much time. Thanks.

[@ADesignerWhoCodes]

If it's too complicated, take a step back and see how it can be easier. That's kinda how I think about it.

[@tlontheparkplaceprince4053]

Hell yea! This was great and was exactly what I was looking for. I was searching forever to find something like this. Keep doing your thing, designer that codes! It is appreciated for real.

[@CompSciCentral]

Such a good tutorial. You are an amazing instructor, seriously.

[@ADesignerWhoCodes]

I appreciate that. Thank you!

[@mayanknagpal5989]

Your presentation is very smooth and professional. Loved your video Thank you for sharing such informative content.

[@ADesignerWhoCodes]

You're so welcome! Stoked it helped you.

[@KHANSOFFICIAL]

Atlast، a free service to get mail 😇😌 Thanks man⁦❤️⁩

[@ADesignerWhoCodes]

You're so welcome!

[@whirlwindmc1]

Soooooooo helpful! I was wanting to see if it was possible to achieve an email submission with form redirect and all I could find was having to use php but this video saved me a lot of work and looks very seamless. Thank you so much

[@ADesignerWhoCodes]

You are so welcome. Ya the php way was the default way for years but there are new and better ways now. Stoked it helped you!

[@Bruce_Yes]

David did you have to pay for the upgrade on Github when you reached the 'pages'?

[@ministryofanti-feminism1493]

@@Bruce_Yes He clearly did. Though rather unhelpful that he didn't mention the fact.

[@saurabhbhambry]

Thanks a lot for this tutorial, this was exactly the kind of solution that I was looking for. I'm an iOS developer and just wanted something straightforward for implementing a functioning contact form without any extra serverside backend work.

[@gauravmalik4693]

Hey Brother! 👋 I'm really thankful to you for helping us. Love from India 🇮🇳

[@ADesignerWhoCodes]

Thanks! Always love to hear where people are writing in from.

[@somehobo6861]

This was a great video! thanks for sharing! Love from Egypt!

[@ADesignerWhoCodes]

So welcome. Hello to Egypt.

[@cyanidecypher]

Great video, thank you! I was also able to use formsubmit to set up an Attach Files option so that users could send in images.

[@ADesignerWhoCodes]

That’s sweet! You’re so welcome

[@tuku_mann]

Wow, that's the project I was dreaming of! Thank you soooo much!

[@hjhornoz]

Thank you so much. I am currently self studying and your video is a great help in achieving my goal. Hope to learn more from you :)

[@ADesignerWhoCodes]

Oh stoked. Click on the videos tab in my channel and you can find all of my videos. I'm re-launching my online course too.

[@funwithraya]

Thank you very much. I tried it and it worked perfectly.

[@tchippat7634]

Very well explained he could be a great teacher.

[@ygamespro9156]

you are the best , thank you realy, i was looking for this tutoriel, & because you i find it , thank you

[@haekalbp2314]

Excellent! Thank you sir!🙏🏿👍🏿

[@ADesignerWhoCodes]

So welcome!

[@thegoat2936]

Hello, it's a beautiful tutoriel but i have a question. Can I use it in a real online web application ??

[@arsh10x]

I'm glad I found this video. It's a life saver!!!

[@dnel3000]

Thanks for this. Any updated info/coding on the honeypot? I'm still getting some spam on a daily basis

[@ADesignerWhoCodes]

I know only as much as Netlify provides in their docs. One thing to consider is adding the additional captcha. Here's the official documentation: docs.netlify.com/forms/spam-filters/

[@marleenloohuis2111]

Thank you very much. Great explanation. Subscribed! I found out that '_next' is replaced by '_redirect'.

[@viakhnine]

A Designer Who Codes is a cool cat.

[@ADesignerWhoCodes]

Awww man. Thank you

[@ibeattheone]

Love you! Super, super helpful!!!

[@piyushyadav7764]

You are great man...this is the thing which I needed.

[@ADesignerWhoCodes]

Sweet! You're welcome.

[@petrzajkas337]

Awesome!! thanks mate it worked just fine

[@the_black_gull-d8j]

Wonderful tutorial!

[@CodingJourney]

Excellent tutorial!! 🙏💙💙🙂

[@ADesignerWhoCodes]

You're welcome.

[@nataliafrontend]

Thank you for this tutorial, very helpful!

[@ADesignerWhoCodes]

You are so welcome

[@chasmboi]

THANKS THANK YOU SO MUCH YOU ARE AMAZING

[@mr.j366]

You are da best bro keep it up

[@catherineleimbach1331]

Thanks so much, you are amazing!!

[@vitaligolev2953]

Thank you very very much!

[@RedCayGaming]

Awesome tutorial!

[@ADesignerWhoCodes]

Thank you!

[@jacobkelcy4087]

I put in my info haven't gotten email for source code. btw amazing tutorial been looking for something like this for ages.

[@kayevm7645]

This is very powerful! Thank you very much!!!!

[@ADesignerWhoCodes]

You're so welcome!

[@JaseRuns]

Thank you!

[@craftyadmin9201]

Hey Man, I cant thank you enough for this wonderful presentation, thank you. regards

[@ADesignerWhoCodes]

You're welcome.

[@jaydonisrael]

Thank you Haydn for this tutorial! I used it in my project. My question is when a user enters an Invalid email address and clicks on the submit button, the user gets directed to FormSubmit's page that reads: Invalid email address You entered email. That is an invalid email address. Please correct the form and try to submit again here. You are using FormSubmit logo How can I change this page to an alternative URL? I looked into the docs on FormSubmit's website and I couldn't find that option. I used _next to create a "Thank You" page successfully, but I couldn't find documentation for an "invalid email" page. Thanks so much for this video!

[@lloyd_talks]

Great presentation job! Very useful.

[@ADesignerWhoCodes]

Thank you very much.

[@adamforgac8853]

awesome! everything works

[@tomaskucera3510]

Amazing! Thanks man!

[@ADesignerWhoCodes]

Welcome.

[@anthonyreyescdjr]

Great Tutorial and Great service.

[@notknowing8978]

Great video! Thank you.

[@صفاقحطانيوسف]

Nice. Thanks a lot actually. It worked, you explained it well. Thank you

[@ADesignerWhoCodes]

Stoked!

[@carloautor]

Where to get the Honeypot? And where is the configuration for honeypot?

[@morenatirana4539]

AMAZING !!!! Thank You !!!

[@Preshhbeats]

Thank you so much sir 🎉

[@ADesignerWhoCodes]

So nice of you

[@sathvikmalgikar2842]

thanks man u r a legend

[@DylanKazunaga-h9j]

THANK YOU SO MUCH!!!!!!!!

[@ADesignerWhoCodes]

You are so welcome.

[@ShinyBob]

THANK YOU SO MUCH !👍👍

[@ADesignerWhoCodes]

Welcome!!

[@michreano]

Thank you so much for this.

[@ADesignerWhoCodes]

You are so welcome!

[@matrix1929]

Great video, thank you

[@thatguy6664]

Excellent, thanks!

[@Maru-ge6jn]

This was very good, thank you sir!

[@ADesignerWhoCodes]

You are welcome!

[@muhammadbangkit7528]

Great video man, I want to ask can I change the _next into only alert notification? So that the users only get alert notification that says 'your forms submitted' not the whole HTML file, thank you

[@ADesignerWhoCodes]

In theory. But double check the docs to be sure.

[@CompSciCentral]

I'm looking for the same solution. It appears from the docs that it can be done with AJAX.

[@রহস্যেরমায়াজাল-ধ৩ঝ]

love it!

[@codingwithdas]

Thanks alot it's working

[@ChristianWarrior1]

Unfortunately form submit is very slow sometimes depending on the server traffic. Sometimes it feels like it takes forever to send an email from a webpage contact form

[@ADesignerWhoCodes]

There’s also Netlify forms. That’s what I generally use. But I enjoy giving all the options.

[@sundarapandim1104]

Sir... Plz post video about WhatsApp button and call now button on website bottom side.. Plz post video and sourcecode sir

[@anjielozapata2804]

sir can you make part 3? design the form using css. thank you

[@ADesignerWhoCodes]

Not a bad idea. Let me see what I can come up with.

[@anjielozapata2804]

@@ADesignerWhoCodes thank you! I will wait for it :)

[@JamesyLive22]

This is so useful, thank you so much

[@ADesignerWhoCodes]

Glad it was helpful!

[@SuhailkcOfficial]

Thank you for the video 👍

[@ADesignerWhoCodes]

You're welcome. Happy to make it.

[@edgaraslisenkovas1935]

Hello, everything works, but when I want success page it won't work, is it only html because I using php ?

[@abrahambayland9232]

Can u show me another tutorial because i did not see the persons message in my gmail.

[@illmatic08]

I got everything working on my personal website with this, however when i used the contact form on mobile, it is failing to load my success page, do you have any idea why? Also thank you very much for this tutorial it was super helpful

[@ADesignerWhoCodes]

That's odd. Are you getting a 404 error? Don't forget to try incognito mode to ensure pages aren't cached.

[@andresgodoy2526]

Any advice for the file uploading. I used the code given, and it says I should be able to upload more than one file, but when I try it the email that is sent to me only includes the most recent file that was uploaded.

[@dinhphu28]

Thanks a googol!

[@haigoto46]

Hay, where do you enter the CAPTCHA key code and secret code?

[@JuniorFast]

I have my own html already created I uploaded and followed steps and my file failed please help.

[@innashavrina9447]

Do you know any easy solution for newsletter too?

[@ADesignerWhoCodes]

Convertkit is your friend. Convertkit.com

[@traughdaddy]

My url comes up red whenever I place it in the html. When I click the https link it takes me to the site that says your form should include method= “POST” which it does. Any idea what I’m doing wrong?

[@schraderwebsolutions5713]

How is the deliverability of this form? Will it hit the email inbox consistently? Thx!

[@ADesignerWhoCodes]

I haven't had an issue with it yet.

[@Dt-8398]

Nice video. But I’m having an issue when I click send I do not get the default confirmation page/captcha, What could be causing this?

[@Dt-8398]

Oh and I’m using git hub pages.

[@ADesignerWhoCodes]

I'm not entirely sure. Unfortunately I didn't encounter that issue.

[@Mehdiabd2233]

Heeey please can you help me You see when its said you using formsubmit how do i remove it

[@glasscow9965]

Can I add multiple email addresses to the section for those who receive the form when it is submitted? And do I just separate with a comma?

[@ADesignerWhoCodes]

Possibly. Haven’t tried that yet.

[@alexanderwardaya5075]

Thanks

[@ADesignerWhoCodes]

Welcome Alexander.

[@momentum6780]

Can this be used on online server also ?

[@philipp2202]

good question. Can anybody answer it please?

[@kolakeman-gpuro6916]

does the version of bootstrap may be the reason why it is not working?

[@ADesignerWhoCodes]

Make sure you are using Bootstrap 5.

[@adisaster8734]

everything is perfect thank you! but my success page leads to a "NET::ERR_CERT_COMMON_NAME_INVALID" idk how to fix this? do i need to add the success page to my dns and create a new ssl to include it? im basically using tumblr to "host" my website

[@adisaster8734]

nvm i just needed to give it a bit of time to fully go thru. thank you for the tutorial!

[@pankajravi9146]

hello Haydan , i am a developer , I have 3 websites and i want to use your method of receiving mails as it is excellent, how many websites can Github support ?? i configured it on 1 other it's not working to create a repository in main ...there is no main option...

[@ADesignerWhoCodes]

In theory, unlimited. Main is the default branch. If it is an older repo, the default was master, but they changed it for a more neutral tone. I've got a few older repos that still use master I'll eventually get around to switching. Thanks! I just try and find the easiest path.

[@Zolarmew]

I'm not receiving the activation email from them :(((

[@balavishnutejaswi6394]

Hey Thank you for the video But I have a small issue Since I dont have a paid Github Account I cannot use Github Pages I tried running the HTML on a local server But I keep getting the error Connection Timed out

[@ADesignerWhoCodes]

Netlify.com or firebase are free

[@aishwaryac7041]

I have got verified mail message to my mail but me not getting activation link mail what to do

[@x7X06]

thx nice

[@GnarlyEmoji]

My formsubmit did not work.

[@Joey_-id5uw]

Hey.. Thanks for this video man, it's really amazing. Anyways I got into some issue, like for some reason I can't receive an activation email, idk if I'm the only one that faced this.. Any hope I can get a support from you or anyone willing to help.. Thanks

[@ADesignerWhoCodes]

Unfortunately I can’t troubleshoot everyone’s technically issues. In a perfect world, yes. I’d reach out to the company and see what is happening. That’s the best suggestion. Sorry you’re having issues.

[@Joey_-id5uw]

@@ADesignerWhoCodes Thanks..

[@Joey_-id5uw]

@@ADesignerWhoCodes It finally worked

[@AlanMartinez-xb3hf]

@@Joey_-id5uw what did you do to make it work?

[@abdullahimran8761]

*success page not working he just show the form submit thankyou page*

[@yekyawtun8126]

Does it use OAuth 2.0?

[@ADesignerWhoCodes]

Nope. Nothing to login to

[@mahamfatima1177]

Hey what if i host my website on a separate domain, will this still work?

[@ADesignerWhoCodes]

Sure. Any domain should work.

[@stephanie5483]

Beans 247 facts

[@ollysalanson9452]

Great video, thanks for making it. That's a like and subscribe from me!

[@ADesignerWhoCodes]

Welcome!

[@ollysalanson9452]

Hoe do you find tools like form submit? Is it knowledge you gather over time or is there a resource list where you can look for solutions?

[@ADesignerWhoCodes]

Hmmm. Just as I hear about things I start to use them. I use FormSubmit _only_ if I'm not using Netlify. And sometimes just a Google search.