0

I am trying to make a contact form in Blogger. The default contact form widget exists and works like a charm, but it only provides 3 fields. Name, email and message. I needed more fields added. Adding more fields to the widget is impossible, since there are specific tags that the widget accepts, that correspond to the three fields "data:contactFormNameMsg" for the name, "data:contactFormEmailMsg" for the email and "data:contactFormMessageMsg" for the message.

So, the solution was to create my own form. I did not want to use the action=mailto because I don't want windows jumping up, Outlook or Mail starting and tabs getting opened. So, I had to use .php to control the sending of the form. I wrote my .php code. So, since Blogger does not provide the option to host your .php file, I had to look elsewhere for hosting. I googled it. And I was directed to the use of Google Drive as the best option to host a .php file for Blogger. So I tried it. I tried the steps described here (and everywhere else on the web), but as this page says (and it must be a new addition, because all other unofficial -and most probably outdated-sites claim to be able to host their .php files on Google Drive)

"Google Drive does not support web resources that make use of server-side scripting languages like PHP."

I tried Dropbox. But, as answered here, "Dropbox doesn't support server-side execution of your PHP scripts" either. All these must be new, because every blogger suggests Dropbox and Google Drive as the best options for hosting .php files.

Then, I tried 000webhost. It worked. My .php script ran and I received the form in my email, BUT (big big BUT) on clicking the button that triggered the action and the .php, the user is also redirected to the first page of 000webhost.

I tried hosting it on another free web hosting service, but the same thing happened. The moment the user clicked the "Send" button on my form, they were redirected to the first page of the free webhosting service.

I thought of adding the php code inline html (?php) ---code--- (/php) but I did not know how to refer to it.

So, I have two questions:

  1. How could I refer to an inline part of php code, in my html code? Remember, we are on Blogger, that little is allowed. I want to refer to the php code from the "form action=" part.

  2. Why does the "Send" button redirects the user to the front page of the free webhosting service? Is it the "Free webhosting service"'s way of advertising itself? I mean, is it implemented in the service? Is there something wrong with my code?

My php code is this:

<?php 
$errors = '';
$myemail = 'mymail@mymail.com';
if(empty($_POST['name'])  || 
   empty($_POST['email']) || 
   empty($_POST['message']))
{
    $errors .= "\n Error: all fields are required";
}

$name = $_POST['name']; 
$email_address = $_POST['email']; 
$message = $_POST['message']; 

if (!preg_match(
"/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i", 
$email_address))
{
$errors .= "\n Error: Invalid email address";
}

if( empty($errors))
{
    $to = $myemail; 
    $email_subject = "Contact form submission: $name";
    $email_body = "You have received a new message. ".
    " Here are the details:\n Name: $name \n Email: $email_address \n Message \n $message"; 

    $headers = "From: $myemail\n"; 
    $headers .= "Reply-To: $email_address";

    mail($to,$email_subject,$email_body,$headers);
    } 
?>

And the HTML part where I call the .php file is this:

<form action='http://myusername.mywebhost.com/contact-form-handler.php' method='POST' name='contact-form'>

So, that's all. If anybody has encountered a similar problem or has needed to use a .php form handler in Blogger RECENTLY, you will be of great help.

Thank you very very much in advance!

Community
  • 1
  • 1
Kantharis
  • 1,316
  • 1
  • 11
  • 21

1 Answers1

0

What you can do is send the form via AJAX to whatever host you want - the user won't be redirected there. Here is some example code, you can customize it further

$("#theform").submit(function(e) {

    e.preventDefault();

    $.post('http://example.com/contact.php', $('#theform').serialize());

}

serialize is used to collect the data from inputs and POST it to the given url.

AJAX Serialize Documentation

mariobgr
  • 2,143
  • 2
  • 16
  • 31