Where should i upload my PHP contact form which i want to embed it on my sidebar
-
Hello i had created a Quick contact form with HTML & PHP. I want this quick contact form on my sidebar in all pages of my wordpress site. i have created 5 files here contact.php, settings.php, process.php, validation.js & contactthanks.php
The code in contact.php is as below
<?php /* Template Name: Quick Contact */ ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="style.css"/> <title>Contact Form</title> <script src="lite_validation.js"></script> <script> required.add('Full_Name','NOT_EMPTY','Full Name'); required.add('Email_Address','EMAIL','Email Address'); required.add('Your_Message','NOT_EMPTY','Your Message') </script> <SCRIPT TYPE="text/javascript"> function numbersonly(myfield, e, dec) { var key; var keychar; if (window.event) key = window.event.keyCode; else if (e) key = e.which; else return true; keychar = String.fromCharCode(key); // control keys if ((key==null) || (key==0) || (key==8) || (key==9) || (key==13) || (key==27) ) return true; // numbers else if ((("0123456789").indexOf(keychar) > -1)) return true; // decimal point jump else if (dec && (keychar == ".")) { myfield.form.elements[dec].focus(); return false; } else return false; } </SCRIPT> <style type="text/css"> *{ margin:0px; padding:0px; } body{ font-size:62.5%; font-family:Helvetica, sans-serif; background-color:#FFF; } .msg-sent{ font-family:Helvetica, sans-serif; font-size:16px; color:#666; margin-left:36px; } .contact-thanks{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#666; margin-left:80px; } .contact-thanks:hover{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#8eb600; } p{ font-size:1.3em; margin-bottom:15px; } #page-wrap{ background-color:#e9e9e9; border:1px solid #bbbbbb; width:300px; margin:20px; min-height:500px; height:auto; height:500px; } #contact-area{ width:300px; margin-top:25px; } #contact-area input, #contact-area textarea{ padding:4px; width:250px; font-family:Helvetica, sans-serif; font-size:1.4em; margin:0px 0px 10px 0px; float:right; margin-right:18px; border:2px solid #ccc; } #contact-area textarea{ height:90px; } #contact-area textarea:focus, #contact-area input:focus{ border:2px solid #8eb600; } #contact-area input.submit-button{ width:100px; float:right; margin-right:20px; margin-top:10px; background:#444; color:#FFFFFF; } #contact-area input.submit-button:hover{ width:100px; float:right; margin-right:20px; margin-top:10px; background:#8eb600; color:#FFFFFF; } label{ float:left; text-align:left; margin-left:20px; width:100px; padding-top:8px; font-size:1.4em; } </style> </head> <body> <div id="page-wrap"> <div id="contact-area"> <form method="post" action="lite_process.php" onsubmit="return validate.check(this)"> <label for="Full_Name">Full Name</label> <input type="text" name="Full_Name" id="Full_Name" /> <label for="Telephone_Number">Phone</label> <input type="text" name="Telephone_Number" id="Telephone_Number" maxlength="10" onKeyPress="return numbersonly(this, event)" /> <label for="Email_Address">Email</label> <input type="text" name="Email_Address" id="Email_Address" maxlength="100" /> <label for="Best_Time">Preffered Time</label> <select name="type" size="1" style="width:262px; float:right; margin-right:18px; padding:2px;"> <option>To Contact</option> <option>08:00</option> <option>09:00</option> <option>10:00</option> <option>11:00</option> <option>12:00</option> <option>13:00</option> <option>14:00</option> <option>15:00</option> <option>16:00</option> <option>17:00</option> <option>18:00</option> <option>19:00</option> </select> <label for="Your_Message">Message</label> <textarea name="Your_Message" id="Your_Message" rows="20" cols="20"></textarea> <input type="submit" name="submit" value="Submit Form" class="submit-button" /> </form> <div style="clear:both;"></div> </div> </div> </body> </html>The code in settings.php is as below
<?php $email_to = "(email visible only to moderators and staff)"; // your email address $email_subject = "Contact Form Message"; // email subject line $thankyou = "contactthanks.php"; // thank you page ?>The code in process.php is as below
<?php if(isset($_POST['Email_Address'])) { include 'lite_settings.php'; function died($error) { echo "Sorry, but there were error(s) found with the form you submitted. "; echo "These errors appear below.<br /><br />"; echo $error."<br /><br />"; echo "Please go back and fix these errors.<br /><br />"; die(); } if(!isset($_POST['Full_Name']) || !isset($_POST['Email_Address']) || !isset($_POST['Telephone_Number']) || !isset($_POST['Your_Message'])) { died('We are sorry, but there appears to be a problem with the form you submitted.'); } $full_name = $_POST['Full_Name']; // required $email_from = $_POST['Email_Address']; // required $telephone = $_POST['Telephone_Number']; // not required $comments = $_POST['Your_Message']; // required $error_message = ""; $email_exp = "^[A-Z0-9._%-]+@[A-Z0-9.-]+.[A-Z]{2,4}$"; if(!eregi($email_exp,$email_from)) { $error_message .= 'The Email Address you entered does not appear to be valid.<br />'; } if(strlen($full_name) < 2) { $error_message .= 'Your Name does not appear to be valid.<br />'; } if(strlen($comments) < 2) { $error_message .= 'The Comments you entered do not appear to be valid.<br />'; } if(strlen($error_message) > 0) { died($error_message); } $email_message = "Form details below.rn"; function clean_string($string) { $bad = array("content-type","bcc:","to:","cc:","href"); return str_replace($bad,"",$string); } $email_message .= "Full Name: ".clean_string($full_name)."rn"; $email_message .= "Email: ".clean_string($email_from)."rn"; $email_message .= "Telephone: ".clean_string($telephone)."rn"; $email_message .= "Message: ".clean_string($comments)."rn"; $headers = 'From: '.$email_from."rn". 'Reply-To: '.$email_from."rn" . 'X-Mailer: PHP/' . phpversion(); @mail($email_to, $email_subject, $email_message, $headers); header("Location: $thankyou"); ?> <script>location.replace('<?php echo $contactthanks.php;?>')</script> <?php } ?>The code in validation.js is as below
function has_id(id){try{var tmp=document.getElementById(id).value;}catch(e){return false;} return true;} function has_name(nm){try{var tmp=cfrm.nm.type;}catch(e){return false;} return true;} function $$(id){if(!has_id(id)&&!has_name(id)){alert("Field "+id+" does not exist!n Form validation configuration error.");return false;} if(has_id(id)){return document.getElementById(id).value;}else{return;}} function $val(id){return document.getElementById(id);} function trim(id){$val(id).value=$val(id).value.replace(/^s+/,'').replace(/s+$/,'');} var required={field:[],add:function(name,type,mess){this.field[this.field.length]=[name,type,mess];},out:function(){return this.field;},clear:function(){this.field=[];}};var validate={check:function(cform){var error_message='Please fix the following errors:nn';var mess_part='';var to_focus='';var tmp=true;for(var i=0;i<required.field.length;i++){if(this.checkit(required.field[i][0],required.field[i][1],cform)){}else{error_message=error_message+required.field[i][2]+' must be suppliedn';if(has_id(required.field[i][0])&&to_focus.length===0){to_focus=required.field[i][0];} tmp=false;}} if(!tmp){alert(error_message);} if(to_focus.length>0){document.getElementById(to_focus).focus();} return tmp;},checkit:function(cvalue,ctype,cform){if(ctype=="NOT_EMPTY"){if(this.trim($$(cvalue)).length<1){return false;}else{return true;}}else if(ctype=="EMAIL"){exp=/^[a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/;if($$(cvalue).match(exp)==null){return false;}else{return true;}}},trim:function(s){if(s.length>0){return s.replace(/^s+/,'').replace(/s+$/,'');}else{return s;}}};The code in contactthanks.php is as below
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN"> <head> <title>Thank You</title> <style type="text/css"> *{ margin:0px; padding:0px; } body{ font-size:62.5%; font-family:Helvetica, sans-serif; background-color:#FFF; } .msg-sent{ font-family:Helvetica, sans-serif; font-size:16px; color:#666; margin-left:36px; } .contact-thanks{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#666; margin-left:80px; } .contact-thanks:hover{ font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#8eb600; } #page-wrap{ background-color:#e9e9e9; border:1px solid #bbbbbb; width:300px; margin:20px; min-height:500px; height:auto; height:500px; } </style> </head> <body> <div id="page-wrap"> <br /><br /> <br /><br /> <br /><br /> <br /><br /> <br /><br /> <br /><br /> <span class="msg-sent">Your message has been sent</span><br /> <br /> <span class="msg-sent">We will get in touch with you soon!</span><br /> <br /> <p><a href="index.html" class="contact-thanks">Back to Contact Form</a></p> </div> <script type="text/javascript"> _uacct = "UA-68528-29"; urchinTracker(); </script> </body> </html>Am i on the right track of creating this process or should i do it in another process ? In which location should i upload these files. And what is the process of embedding this contact form on my sidebar. Please be brief & Help me out.
The blog I need help with is: (visible only to logged in users)
-
Code can’t be uploaded to your WordPress.COM site – and you are a developer??
-
At wordpress.COM we have a contact form that wordpress has provided, and the shortcode can be used in a text widget in the sidebar.
-
-
-
-
Then you are in the wrong forum. This forum is for those hosted here at wordpress.COM.
Self-hosted support is at http://wordpress.ORG/support/ .
-
-
- The topic ‘Where should i upload my PHP contact form which i want to embed it on my sidebar’ is closed to new replies.
WordPress.com Forums 