How can I create a custom form in WordPress?
<p>I have a WordPress site and would like to create a form (input → database).</p>
<p>I've seen two tutorials:</p>
<ul>
<li><em><a href="https://www.inkthemes.com/how-you-can-easily-create-customized-form-in-wordpress/" rel="noreferrer">How you can easily create customized form in WordPress</a></em></li>
<li><em><a href="https://shibulijack.wordpress.com/2012/03/18/create-custom-forms-in-wordpress/" rel="noreferrer">How to create custom forms in WordPress without using plugins?</a></em></li>
</ul>
<p>They're both very similar. Creating the front end with HTML and JavaScript, and then processing the information to the database using PHP.</p>
<p>My problem is that whenever I submit the form, it shows a 404 page which says:</p>
<blockquote>
<p>Oops! That page can’t be found.</p>
</blockquote>
<p>Now my problem is (or I want to know):</p>
<ol>
<li><p>Where do I need to put the <code>process.php</code> file? (I'm using <a href="http://en.wikipedia.org/wiki/FileZilla" rel="noreferrer">FileZilla</a>). I've tried several places in the <code>public_html/wp-content</code> folder.</p>
</li>
<li><p>Why aren't the name and email fields being validated? (no alert for empty name field, etc.)</p>
</li>
</ol>
<h3>Form structure:</h3>
<p>Your Name: [TEXT], Your Email: [TEXT], Sex: [*male *female], Your Age:[TEXT], [Submit Button]</p>
<p><strong>Form page:</strong></p>
<pre><code>&lt;form name=&quot;myForm&quot; method=&quot;POST&quot; onsubmit=&quot;return form_validation()&quot; action=&quot;../process.php&quot;&gt;
    Your Name: &lt;input id=&quot;customer_name&quot; name=&quot;customer_name&quot; type=&quot;text&quot; /&gt;
    Your Email: &lt;input id=&quot;customer_email&quot; name=&quot;customer_email&quot; type=&quot;text&quot; /&gt;
    Sex: &lt;input name=&quot;customer_sex&quot; type=&quot;radio&quot; value=&quot;male&quot; /&gt;Male &lt;input name=&quot;customer_sex&quot; type=&quot;radio&quot; value=&quot;female&quot; /&gt;Female
    Your Age: &lt;input id=&quot;customer_age&quot; name=&quot;customer_age&quot; type=&quot;text&quot; /&gt;
    &lt;input type=&quot;submit&quot; value=&quot;Submit&quot; /&gt;
&lt;/form&gt;

&lt;script type=&quot;text/javascript&quot;&gt;
    function form_validation() {
        /* Check the Customer Name for blank submission */
        var customer_name = document.forms[&quot;myForm&quot;][&quot;customer_name&quot;].value;
        if (customer_name == &quot;&quot; || customer_name == null) {
            alert(&quot;Name field must be filled.&quot;);
            return false;
        }

        /* Check the Customer Email for invalid format */
        var customer_email = document.forms[&quot;myForm&quot;][&quot;customer_email&quot;].value;
        var at_position = customer_email.indexOf(&quot;@&quot;);
        var dot_position = customer_email.lastIndexOf(&quot;.&quot;);
        if (at_position &lt; 1 || dot_position &lt; at_position + 2 || dot_position + 2 &gt;= customer_email.length) {
            alert(&quot;Given email address is not valid.&quot;);
            return false;
        }
    }
&lt;/script&gt;
</code></pre>
<p>File <code>process.php</code> (not edited):</p>
<pre><code>&lt;?php
    $customer_name = $_POST[&quot;customer_name&quot;];
    $customer_email = $_POST[&quot;customer_email&quot;];
    $customer_sex = $_POST[&quot;customer_sex&quot;];
    $customer_age = $_POST[&quot;customer_age&quot;];

    $conn = mysqli_connect(&quot;Database Host&quot;, &quot;Database Username&quot;, &quot;Database  Password&quot;, &quot;Database Name&quot;);
    if(!$conn) {
        die(‘Problem in database connection: ‘ . mysql_error());
    }

    $query = &quot;INSERT INTO ‘Database Name’.’Table Name’ ( ‘customer_name’, ‘customer_email’, ‘customer_sex’, ‘customer_age’ ) VALUES ( $customer_name, $customer_email, $customer_sex, $customer_age )&quot;;
    mysqli_query($conn, $query);

    header(&quot;Location: my-site.com/success&quot;); // Redirects to success page
?&gt;
</code></pre>