How can I create a submission page?

Hey there I wanted to recreate this "Contact Me" I found but the issue is I don't really understand how it works or what is required in order to achieve this
No description
25 Replies
RMON
RMONOPβ€’11mo ago
The main Issue I see regarding this is the fact I only know HTML and CSS I assume something like this would require JS or something else. My main goal is to have the user input their info and then hit a submit button to send to my Email
Samalander
Samalanderβ€’11mo ago
You can use formsubmit https://formsubmit.co/ Just add action="https://formsubmit.co/[email protected]" and method="POST" to your <form> element
RMON
RMONOPβ€’11mo ago
alright will do, Appreciate you! Didn't expect to get such a simple fix to my situation πŸ˜‚ Hey, So I did end up using what you recommended and after I hit "submit" it redirects me but its just an infinite loading screen that doesn't lead anywhere how come?
<footer class="Contact-Information">
<div class="container">
<h1 class="Contact-Styling Form-Important">Contact</h1>
<h2 class="Say-Hello Form-Important">Say Hello</h2>
<h3 class="Form-Desc Form-Important">Submit the form below so I can get back to you as soon as possible</h3>
<form target="_blank" action="https://formsubmit.co/[email protected]" method="POST">
<div class="form-group">
<div class="form-row">
<div class="col">
<input type="text" class="FirstNameInput" name="name" class="form-control" placeholder="Name And Lastname" required>
</div>
<div class="col">
<input type="email" name="email" class="form-control" placeholder="Email Address" required>
</div>
</div>
</div>
<div class="form-group">
<textarea placeholder="Your Message" class="form-control" name="message" rows="10" required></textarea>
</div>
<button type="submit" class="btn btn-lg btn-dark btn-block">Submit Form</button>
</form>
</div>
</footer>
<footer class="Contact-Information">
<div class="container">
<h1 class="Contact-Styling Form-Important">Contact</h1>
<h2 class="Say-Hello Form-Important">Say Hello</h2>
<h3 class="Form-Desc Form-Important">Submit the form below so I can get back to you as soon as possible</h3>
<form target="_blank" action="https://formsubmit.co/[email protected]" method="POST">
<div class="form-group">
<div class="form-row">
<div class="col">
<input type="text" class="FirstNameInput" name="name" class="form-control" placeholder="Name And Lastname" required>
</div>
<div class="col">
<input type="email" name="email" class="form-control" placeholder="Email Address" required>
</div>
</div>
</div>
<div class="form-group">
<textarea placeholder="Your Message" class="form-control" name="message" rows="10" required></textarea>
</div>
<button type="submit" class="btn btn-lg btn-dark btn-block">Submit Form</button>
</form>
</div>
</footer>
This is the entire code involved in my footer regarding my Contact Form
Samalander
Samalanderβ€’11mo ago
change [email protected] to your actual email
RMON
RMONOPβ€’11mo ago
Ofc, But would I need to alter anything else?
Samalander
Samalanderβ€’11mo ago
and maybe target="_blank" is messing something up
Samalander
Samalanderβ€’11mo ago
Here's how I have it set up on my site (which works):
No description
RMON
RMONOPβ€’11mo ago
I was assuming that might have been doing something just didn't think it was big Just to ask how do you have a gmail of "[email protected]"? doesn't seem like a normal Gmail account and seems nicer to have compared to a gmail
Samalander
Samalanderβ€’11mo ago
I don't Most domain registrars let you set up email forwarding for free So any email under samalander.dev or samcheng.co automatically forwards to me, so like you could email [email protected] and it would go to me
RMON
RMONOPβ€’11mo ago
Ok so I may have found out why the email system isn't working Im pretty much using a LiveServer from VS Code and I have the website working thru GitHub pages so I assume it's something around this
RMON
RMONOPβ€’11mo ago
No description
RMON
RMONOPβ€’11mo ago
How can I get something like that?
Samalander
Samalanderβ€’11mo ago
just google [yourdomain registrar] email forwarding e.g. https://www.google.com/search?q=google+domains+email+forwarding
RMON
RMONOPβ€’11mo ago
Alright, Also since I do plan on adding this gmail to a portfolio would you recommend something professional like your name?
Samalander
Samalanderβ€’11mo ago
I started out with samalander.dev, and ended up switching to samcheng.co since it's more professional
RMON
RMONOPβ€’11mo ago
I see
Samalander
Samalanderβ€’11mo ago
I would say it depends on a case by case basis but in general I think name is better
RMON
RMONOPβ€’11mo ago
Alright, Thank you!
Samalander
Samalanderβ€’11mo ago
Non-name makes you more unique/stand out and name is more professional
RMON
RMONOPβ€’11mo ago
Also, Regarding my other situation I figured it out after changing some things around and sending another email it ended up redirecting me telling me I had a confirmation sent to activate my Form Yea, Ofc for example Usernames make users unique as they've created it and your name/last name makes you professional Also another question, do you have any good websites I can host my website on? The current URL to my website isn't really the most professional Ok so I did run into a weird issue for some reason, after saving the code into GitHub and running my website the Form just doesnt work anymore and the styling to it doesnt get affected FIXED For example - this is my current portfolio (Not finished) https://arman-markaryan.github.io/Arman-Markaryan/ Do you have any good websites (that are free) so I can host my website and have a real url this will just be Temp till I start paying for a real one
Samalander
Samalanderβ€’11mo ago
I use Vercel But I use Svelte so IDK if it can host static sites
clevermissfox
clevermissfoxβ€’11mo ago
Most hosts will give you a domain name for free (free for the first year) when you sign up! Otherwise free domains aren't a thing, but you can register a domain for like $12-$30 a year depending on the domain you want and the extension you want. There may be some extensions you can get for free but at that point you should just use the netlify domain extension that's trusted then deal with shady sites.
Once you have your domain you can use Netlify to host it for free. They'll give you a randomly generated domain (example below) when you first deploy your site and I think you can choose what you want before the " .netlify.app" if it isn't taken. It couldn't be much easier to deploy your site from a github repo to netlify! There are also GitPages which I believe is also free hosting but I've never used it myself. The random generated domain is something like this : https://snazzy-sorbet-20e86e.netlify.app
RMON
RMONOPβ€’11mo ago
Thank you for the very detailed response saved me some time from researching this all Hey @Samalander - Regarding the method you used to give me the submission form do I have to copy the exact format code they had? or is it just this here
<form target="_blank" action="https://formsubmit.co/[email protected]" method="POST"></form>
<form target="_blank" action="https://formsubmit.co/[email protected]" method="POST"></form>
Samalander
Samalanderβ€’11mo ago
I think it’s just that main part but idk You can check their website/docs for more info
RMON
RMONOPβ€’11mo ago
Alright, Thank you!
Want results from more Discord servers?
Add your server