Kevin Powell - Community•12mo ago

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

25 Replies

RMONOP•12mo 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•12mo ago

You can use formsubmit https://formsubmit.co/ Just add action="https://formsubmit.co/[email protected]" and method="POST" to your <form> element

RMONOP•12mo 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•12mo ago

change [email protected] to your actual email

RMONOP•12mo ago

Ofc, But would I need to alter anything else?

Samalander•12mo ago

and maybe target="_blank" is messing something up

Samalander•12mo ago

Here's how I have it set up on my site (which works):

RMONOP•12mo 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•12mo 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

RMONOP•12mo 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

RMONOP•12mo ago

How can I get something like that?

Samalander•12mo ago

just google [yourdomain registrar] email forwarding e.g. https://www.google.com/search?q=google+domains+email+forwarding

RMONOP•12mo ago

Alright, Also since I do plan on adding this gmail to a portfolio would you recommend something professional like your name?

Samalander•12mo ago

I started out with samalander.dev, and ended up switching to samcheng.co since it's more professional

RMONOP•12mo ago

I see

Samalander•12mo ago

I would say it depends on a case by case basis but in general I think name is better

RMONOP•12mo ago

Alright, Thank you!

Samalander•12mo ago

Non-name makes you more unique/stand out and name is more professional

RMONOP•12mo 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•12mo ago

I use Vercel But I use Svelte so IDK if it can host static sites

clevermissfox•12mo 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

RMONOP•12mo 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•12mo ago

I think it’s just that main part but idk You can check their website/docs for more info

RMONOP•12mo ago

Alright, Thank you!

Gaming

Programming

How can I create a submission page?