I have created a contact form using labels as a type of place holder, putting them behind the input box with a transparent background then making background white on :focus and setting the background white when value of input is > 0.
I have recently incorporated the necessary PHP into my form which has destroyed my styling. I have recovered it slightly but don't understand why the inputs are a few pixels too long. It changes the styling as soon as I put the PHP above the doctype declaration.
I do not know what to do about the page's label showing through on page refresh. [Have a look][1] and see what you think. How can I get it working smoothly?
[Here is a JSFiddle showing my contact form styling][2].
Here is my php
<?php
if (empty($_POST) === false){
$errors = array();
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
if (empty($name) === true || empty($email) === true || empty($message) === true) {
$errors[] = 'Name, email and message are required!';
} else {
if (filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
$errors[] = 'Invalid email address';
}
if (ctype_alpha($name) === false) {
$errors[] = 'Name must contain letters only';
}
}
if (empty($errors) === true) {
mail('mailmattysmith#gmail.com', 'Contact form', $message, 'From: ' . $email);
header('Location: index.php?sent');
exit();
}
}
?>
<!DOCTYPE HTML>
<html>
<head>
<title>Matthew Smith | Contact</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<style type="text/css">
#contact_btn{
border-bottom: 5px solid #0af !important;
}
</style>
</head>
<body>
<?php
include("header.php");
?>
<div id="wrapper">
<img class="click_contact" id="logo" src="img/logo1.png">
<br><p id="contact_me" class="quote">Get In touch</p>
<div id="contact_form">
<?php
if (isset($_GET['sent']) === true) {
echo '<p>Thanks for contacting me</p>';
} else {
if (empty($errors) === false) {
echo '<ul>';
foreach ($errors as $error) {
echo '<li>', $error, '</li>';
}
echo '</ul>';
}
?>
<form action="" method="post" >
<div class="input_wrap" id="first">
<input type="text" name="name" id="name" <?php if (isset($_POST['name']) === true) { echo 'value="', strip_tags($_POST['name']), '"'; } ?>>
<label for="name">Name</label>
</div>
<div class="input_wrap">
<input type="text" name="email" id="email" <?php if (isset($_POST['email']) === true) { echo 'value="', strip_tags($_POST['email']), '"'; } ?>>
<label for="email">Email</label><br>
</div>
<div class="input_wrap">
<input>
<label>Subject</label>
</div>
<div class="input_wrap" id="last">
<textarea name="message" id="message"><?php if (isset($_POST['message']) === true) { echo strip_tags($_POST['message']), ''; } ?></textarea>
<label for="message">Message</label>
</div>
<input type="submit" id="send" value="Send">
</form>
<?php
}
?>
</div>
<div id="footer"><p>© Matt Smith <?php echo date('Y'); ?></p></div>
</div>
<script type="text/javascript">
$('#logo').click(function(){
$('html, body').animate({
scrollTop: $(".quote").offset().top
}, 1000);
});
$('input, textarea').on('keyup', function() {
var $this = $(this);
if($(this).val().length > 0) {
$this.css({backgroundColor: '#fff'});
} else {
$this.css({backgroundColor: 'transparent'});
}
});
</script>
</body>
</html>
{[1]: http://www.dominichook.co.uk/matthew/contact.php
{[2]: http://jsfiddle.net/tUnc4/
The problem with your contact form is not the PHP, but actually the way you've coded your labels for the fields. I see that the form submits, and then you do your verification in PHP, then if there is a problem it returns the form with the current values set using the value attribute. This is all fine, but you need a way of removing the labels or just use the placeholder attribute.
Here's a jsfiddle using the placeholder attribute.
You should consider using the placeholder attribute instead of your overly complex solution.
For example:
<label for="email">Email</label>
<input type="email" placeholder="you#example.com" name="email" id="email" />
Browser that do not support this attribute will ignore it. You may simulate the effect for older browsers with JavaScript (for example, Simple-Placeholder).
Related
I was following a tutorial and completed this contact form. It works fine, but I want to display a different message in each of the field instead of using a one box. I tried to move
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
underneath the input field and that worked great as far as displaying in that spot, but it just shows the same message all at once. It does not show different message separately. How would I approach this from here?
body {
font-size:10px;
font-family:sans-serif, "Open-sans";
margin:0;
padding:0;
box-sizing:border-box;
letter-spacing:0.1rem;
}
.navbar {
background:#333;
width:100%;
}
.container {
max-width:1100px;
margin:auto;
}
.navbar-header {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
}
.navbar-brand {
font-size:1.5rem;
padding:1rem;
color:#fff;
text-decoration:none;
}
form {
font-size:1.3rem;
}
.form-group {
display:flex;
flex-direction: column;
margin:1.5rem;
}
label {
color:#333;
margin-bottom:0.7rem;
}
input, textarea {
max-width:100%;
border:0.5px solid darkslategray;
padding:1.3rem;
font-size:1.5rem;
}
button {
background:rgb(67, 130, 211);
color:#fff;
font-size:1.2rem;
padding:1rem;
margin:1.5rem;
border:none;
}
.alert {
margin:1.5rem;
padding:1.5rem;
font-size:1.5rem;
color:#fff;
}
.alert-danger {
background-color:rgb(219, 54, 48);
}
.alert-success {
background-color:rgb(28, 160, 39);
}
<?php
// Message Vars
$msg = '';
$msgClass = '';
// Check for submit
if(filter_has_var(INPUT_POST,'submit')){
// Get Form Data
$name = htmlspecialchars($_POST['name']);
$email = htmlspecialchars($_POST['email']);
$message = htmlspecialchars($_POST['message']);
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
// Passed
// Check Email
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
// Failed
$msg = 'Please use a valid email';
$msgClass = 'alert-danger';
} else {
// Passed
$toEmail = 'johnDoe#gmail.com';
$subject = 'Contact Request From '.$name;
$body = '<h2>Contact Request</h2>
<h4>Name</h4><p>' .$name. '</p>
<h4>Email</h4><p>' .$email. '</p>
<h4>Message</h4><p>' .$message.'</p>
';
// Email Headers
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-Type:text/html;charaset=UTF-8" . "\r\n";
// Additional Headers
$headers .= "From: " .$name. "<".$email.">". "\r\n";
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg = "Your email has been sent";
$msgClass = 'alert-success';
} else {
// Failed
$msg = "Your email was not sent";
$msgClass = 'alert-danger';
}
}
} else {
// Failed
$msg = 'Please fill in all fields';
$msgClass = 'alert-danger';
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
My Website
</div>
</div>
</nav>
<div class="container">
<?php if($msg != ''): ?>
<div class="alert <?php echo $msgClass; ?>"><?php echo $msg;?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
</div>
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
</div>
<div class="form-group">
<label for="name">Message</label>
<textarea name="message" class="form-control"><?php echo isset($_POST['message']) ? $message : ''; ?></textarea>
</div>
<button type="submit" name="submit" class="btn btn-primary">
Submit</button>
</form>
</div>
</body>
</html>
This is my current form.
I want to make it look like this one.
You can use the $msg variable as an array, instead of a string, to hold errors for specific fields.
<?php
$msg = [];
if(filter_has_var(INPUT_POST,'submit')){
//...
// Check Required Fields
if(!empty($email) && !empty($name) && !empty($message)){
if(filter_var($email, FILTER_VALIDATE_EMAIL) === false ){
$msg['email'] = [
'msg' => 'Please use a valid email'
'class' => 'alert-danger'
];
} else {
//...
if(mail($toEmail, $subject, $body, $headers)){
// Email Sent
$msg['default'] = [
'msg' => 'Your email has been sent'
'class' => 'alert-success'
];
} else {
// Failed
$msg['default'] = [
'msg' => 'Your email was not sent'
'class' => 'alert-danger'
];
}
}
} else {
// Failed
$msg['default'] = [
'msg' => 'Please fill in all fields'
'class' => 'alert-danger'
];
}
}
?>
And now in the HTML, you can check if the specific error or message exist and you display it at the right place; default messages at the top and email error under the email input:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Contact US</title>
</head>
<body>
<nav class="navbar">
<div class="container">
<div class="navbar-header">
My Website
</div>
</div>
</nav>
<div class="container">
<!-- HERE -->
<?php if(isset($msg['default'])): ?>
<div class="alert <?php echo $msg['default']['class']; ?>"><?php echo $msg['default']['msg']?></div>
<?php endif; ?>
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<!-- ... -->
<div class="form-group">
<label for="name">Email</label>
<input type="text" name="email" class="form-control" value="<?php echo isset($_POST['email']) ? $email : ''; ?>">
<!-- AND HERE -->
<?php if(isset($msg['email'])): ?>
<div class="alert <?php echo $msg['email']['class']; ?>"><?php echo $msg['email']['msg']?></div>
<?php endif; ?>
</div>
<!-- ... -->
</form>
</div>
</body>
</html>
And you can actually do the same for any other input you want too.
You can store your validation warnings in an array type variable as opposed to a string.
For example, this line:
$msg = 'Please use a valid email';
You could instead do this:
$msg['email'] = 'Please use a valid email';
Also I think you want to verify if each of the required fields is present with its own individual if check, not all of them together, for example:
if(!empty($email) && !empty($name) && !empty($message)){
You can implement as:
if (empty($email) || filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
$msg['email'] = 'Please use a valid email';
}
if (empty($name)) {
$msg['name'] = 'Please enter a name';
}
if (empty($message)) {
$msg['message'] = 'Please enter a message';
}
Then in your HTML section, below each of the relevant input fields, you can add:
<div class="form-group">
<label for="name">Name</label>
<input type="text" name="name" class="form-control" value="<?php echo isset($_POST['name']) ? $name : ''; ?>">
<?php if(isset($msg['name'])): ?>
<p> <?php echo $msg['name']; ?>
<?php endif; ?>
</div>
However, in general I have to say this a very oldschool way of using PHP, where you would mix your logic code with your display code.
When you get the hang of it, perhaps you would like to study how Laravel, Symfony, or even CodeIgniter work, where you can use what known as MVC to separate your display from your logic.
As well, you can eventually use a templating engine like Blade or similar to echo out your variables.
I have the following php code named recover.php:
<?php
include "php/init.php";
inaccessible_if_loggedIn();
if (isset($_GET['success']) === true && empty($_GET['success']) === true) {
?>
<p>succes!</p>
<?php
} else {
$allowed_modes = array('username', 'password');
if (isset($_GET['mode']) === true && in_array($_GET['mode'], $allowed_modes) === true) {
if (isset($_POST['email']) && empty($_POST['email']) === false) {
if (user_in_DB($_POST['email'])) {
// TO DO: schrijf recover functie
//recover($_GET['mode'], $_POST['email']);
header("Location: recover.php?success");
exit();
} else {
$errors[] = "email: " . $_POST['email'] . " does not exist";
}
}
include "includes/recover_form.php";
} else {
header("Location: includes/errorPages/page_not_exist.php");
exit();
}
}
?>
the html include contains a form with action recover.php
html code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/signInStylesheet.css">
<title>bestBay</title>
</head>
<body>
<div class="wrapper">
<div class="header_container">
<a id="logoLink" href="index.php"><img src="images/logo.png" class="logo"></a>
</div>
<div class="register_form">
<div class="formBody">
<form action="recover.php" method="post">
<br/>
<span class="formText">E-Mail<span style="color: red">*</span></span> <input name="email" class="fillInput" type="email" maxlength="90" required>
<br/>
<br/>
<?php echo print_errors($errors); ?>
<input class="signInButton" type="submit" value="Recover">
</form>
</div>
</div>
</div>
</body>
</html>
page layout:
The problem is after the user enters a valid email my php code still redirects to "includes/errorPages/page_not_exist.php" as if the ?succes after the link is not there.
I cannot see what I am doing wrong in my code.
If I leave
else {
header("Location: includes/errorPages/page_not_exist.php");
exit();
}
empty my code seems to work.
What exactly am I missing here?
Why do you have so many php tags in your code? please remove those tags and echo success also try using elseif for the second part of your code...
?>
succes!
include "php/init.php";
inaccessible_if_loggedIn();
if (isset($_GET['success']) === true && empty($_GET['success']) === true) {
echo succes!;
} elseif {
//please also log your errors on the starting line using ini_set("display_startup_errors", 1);
ini_set("display_errors", 1);
The solution was rather simple. My code never got as far as even redirecting to the success page. This was because my form action never passed a GET variable resulting in $_GET['mode returning false'].
The simple solution was to just leave the action empty.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="css/signInStylesheet.css">
<title>bestBay</title>
</head>
<body>
<div class="wrapper">
<div class="header_container">
<a id="logoLink" href="index.php"><img src="images/logo.png" class="logo"></a>
</div>
<div class="register_form">
<div class="formBody">
<form action="" method="post">
<br/>
<span class="formText">E-Mail<span style="color: red">*</span></span> <input name="email" class="fillInput" type="email" maxlength="90" required>
<br/>
<br/>
<?php echo print_errors($errors); ?>
<input class="signInButton" type="submit" value="Recover">
</form>
</div>
</div>
</div>
</body>
</html>
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I have made a contact form using PhP, HTML and CSS. When I submit the form with incorrect information, the CSS padding dissapears. Do any one see what I am doing wrong? Thank you in advance!
<?php
if (empty($_POST) === false) {
$errors = array();
$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
if (empty($name) === true || empty($email) === true || empty($message) === true) {
$errors[] = 'Name, email and message are required!';
} else {
if (filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
$errors[] = 'That\'s not a valid email address!';
}
if (ctype_alpha($name) === false) {
$errors[] = 'Name must only contain letters!';
}
}
if (empty($errors) === true) {
mail('name#example.com', 'Contact form', $message, 'From: ' . $email);
header('Location: index.php?sent');
exit();
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>A contact form</title>
<link href='http://fonts.googleapis.com/css?family=Raleway:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="/css/application.css">
</head>
<body>
<?php
if (isset ($_GET['sent']) === true) {
echo '<p>Thanks for contacting me!</p>';
} else {
if (empty($errors) === false) {
echo '<ul>';
foreach($errors as $error) {
echo '<li>', $error,'</li>';
}
echo '</ul';
}
?>
<form action="" method="post" class="skinny_wrapper wrapper_padding">
<p>
<label for="name">Name:</label><br>
<input type="text" name="name" id="name" <?php if (isset($_POST['name']) === true) { echo 'value="', strip_tags($_POST['name']), '"'; } ?>>
</p>
<p>
<label for="email">Email:</label><br>
<input type="text" name="email" id="email" <?php if (isset($_POST['email']) === true) { echo 'value="', strip_tags($_POST['email']), '"'; } ?>>
</p>
<p>
<label for="message">Message:</label><br>
<textarea name="message" id="message"><?php if (isset($_POST['message']) === true) { echo strip_tags($_POST['message']); } ?></textarea>
</p>
<p>
<input type="submit" value="Send Message">
</p>
</form>
<?php
}
?>
</body>
</html>
Screenshots:
Before
After
Probably some css rules were overwriten by additional class which appears during validation.
I came up with a problem which made me crazy as I am new to PHP. The problem is: the below timetable submission form works good on Chrome (every time I left the email unfilled, the submission cannot be processed). However, when using on safari, you can always submit blank form into the database.
Here is the html form.
<script type="text/javascript" src="/membership/my-form/js/jquery-2.1.1.js"></script>
<script type="text/javascript" src="/membership/my-form/js/main.js"></script>
<form class="mf-form floating-labels" method="post" action="timetablesubmit.php">
<div>
<h1 style="text-align:center">Availability form</h1>
</div>
<div>
<p class="mf-select icon">
<select name="timetable-staff" class="user" required>
<option value="">Select Person</option>
<option value="AMY">Amy</option>
<option value="TOM">Tom</option>
</select>
</p>
<div>
<input name="location1" value="A" type="hidden">
<input name="location2" value="B" type="hidden">
</div>
<div class="AMY box">You work in A.</div>
<div class="TOM box">You work in B.</div>
</div>
<div class="icon">
<label class="mf-label" for="mf-email">Email Address</label>
<input class="email" type="email" name="timetable-email" id="mf-email" required>
</div>
</form>
<script type="text/javascript">
$(document).ready(function(){
$("select").change(function(){
$( "select option:selected").each(function(){
if($(this).attr("value")=="Amy"){
$(".box").hide();
$(".AMY").show();
}
if($(this).attr("value")=="Tom"){
$(".box").hide();
$(".TOM").show();
}
});
}).change();
});
</script>
<style type="text/css">
.box{
padding: 10px;
display: none;
margin-top: 20px;
border: 1px solid #000;
font-size:1.6em;
text-align:center;
background-color: #f1f1f1;
}
</style>
Here is the timetablesubmit.php:
<?php
header("content-type:text/html;charset=utf-8");
session_start();
$timesubmit=date('Y-m-d H:i:s');
$staff=$_POST['timetable-staff'];
$email=$_POST['timetable-email'];
$con=mysql_connect("localhost","database","password");
if (!$con) {
die ('Could not connect:' . mysql_error());
}
mysql_select_db("database", $con);
mysql_query("set names utf8");
mysql_query("INSERT INTO timetable(staff,email)
VALUES('$staff','$email')");
mysql_close($con);
sleep(2);
?>
<html>
<? require 'header.php'; ?>
<div class="tk-reg">
<p>Thak you <?php echo $_POST['timetable-staff']; ?><p>
<p> Time availability submitted successfully.<p>
Your email address is: <?php echo $_POST["timetable-email"]; ?>
</div>
<div class="tk-regfollow">
<ul style="text-align:center">
Back to home page.
</ul>
</div>
</html>
Then I searched the Internet and changed to below, still not working on Safari (the alert appears, however data still been insert into database.
<?php
require 'header.php';
$nameErr = $emailErr = "";
$name = $email = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["timetable-staff"])) {
$nameErr = "Please select a staff.";
} else {
$staff = test_input($_POST["timetable-staff"]);
}
if (empty($_POST["timetable-email"])) {
$emailErr = "Email address is required";
} else {
$email = test_input($_POST["timetable-email"]);
}
}
function test_input($data) {
$data = trim($data);
$data = stripslashes($data);
$data = htmlspecialchars($data);
return $data;
}
$con=mysql_connect("localhost","database_name","database_password");
if (!$con) {
die ('Could not connect:' . mysql_error());
}
mysql_select_db("database_name", $con);
mysql_query("set names utf8");
mysql_query("INSERT INTO timetable(staff,email)
VALUES('$staff','$email')");
mysql_close($con);
sleep(2);
?>
<html>
<style>
.error {color: #FF0000;}
</style>
<h1 style="text-align:center">Availability form for
<?php
$d=strtotime("+1 Months");
echo date("M", $d) . " 2015 <br>";
?>
</h1>
<form class="mf-form floating-labels" method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
<div>
<p class="mf-select icon">
<select name="timetable-staff" class="user" required>
<option value="">Select Person</option>
<option value="AMY">Amy</option>
<option value="TOM">Tom</option>
</select>
<span class="error">* <?php echo $nameErr;?></span>
</p>
</div>
<div class="icon">
<label class="mf-label" for="mf-email">Email Address</label>
<input class="email" type="email" name="timetable-email" id="mf-email" required>
<span class="error">* <?php echo $emailErr;?></span>
</div>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>
</html>
I hope someone could help me pointing out my mistakes. Thank you.
======================================================================
I tried a lot of ways to figure this out, however still have either 'this' or 'that' problems. I finally use a method that actually work, but I do not know whether it is not recommended.
Here is the code I modified in timetablesubmit.php
(my flow is: timetable.php ==>timetablesubmit.php==>welcome.php)
$email = trim($_POST['timetable-email']);
if($email !='' and $email !=null) {
$sql1;
}
else {
echo '<html><head>
<link rel="stylesheet" type="text/css" href="/membership/style.css"/>
<head>
<div class="check-error-message">
<p>Error: Email address is required.</p><br>
Return
</div>';
exit;
};
You can check with condition before insert operation
if($nameErr =="" && $emailErr == "")
{
mysql_query("INSERT INTO timetable(staff,email)
VALUES('$staff','$email')");
}
you can have one condition here to avoid empty fill
mysql_query("INSERT INTO timetable(staff,email)
VALUES('$staff','$email')");
here keep this condition like this
if($staff!='' && $email!='')
{
mysql_query("INSERT INTO timetable(staff,email)
VALUES('$staff','$email')");
}
Html 5 "required" will not work in safari.
This line is the problem <input class="email" type="email" name="timetable-email" id="mf-email" required>
Write jquery/javascript validation to check the required field.
Hope its help you.
As they said, not all browsers accept the attribute required because it's new.
On PHP, server side, you can validate too if there's something filled with:
$var = trim($_POST['var']);
if(!is_empty($var)) {
//do mysqli function
}
else {
//show error
}
trim will remove blank spaces at start and end of the value given.
is_empty will be almost like $var == ""
I have a process.php file for processing a comment/message form. If there is an error during the processing, the incorrect form content is echoed and shown as a web page named process.php to the viewer for correction and resubmitting.
The problem is that I need the echoed content to contain various <?php include("xxxx.php");?> elements so that it matches the rest of my site. But this seems to make the page fall over (showing blank page with no content). I've been told that I should use either include("xxxx.php"); or echo file_get_contents("xxxx.php"); from within the echoed content, but neither displays the intended content.
Any help in these issues would be greatly appreciated.
Code: (some items xxxxx for security)
<?php
// Information to be modified
$your_email = "xxxxxxxx#xxxxx.xx.xx"; // email address to which the form data will be sent
$subject = "Contact message"; // subject of the email that is sent
$thanks_page = "thankyou.htm"; // path to the thank you page following successful form submission
$contact_page = "mail_form_styled.php"; // path to the HTML contact page where the form appears
// Nothing needs to be modified below this line
if (!isset($_POST['submit'])) {
header( "Location: $contact_page" );
}
if (isset($_POST["submit"])) {
$nam = $_POST["name"];
$ema = trim($_POST["email"]);
$com = $_POST["comments"];
$spa = $_POST["spam"];
if (get_magic_quotes_gpc()) {
$nam = stripslashes($nam);
$ema = stripslashes($ema);
$com = stripslashes($com);
}
$error_msg=array();
if (empty($nam) || !preg_match("~^[a-z\-'\s]{1,60}$~i", $nam)) {
$error_msg[] = "The name field must contain only letters, spaces, dashes ( - ) and single quotes ( ' )";
}
if (empty($ema) || !filter_var($ema, FILTER_VALIDATE_EMAIL)) {
$error_msg[] = "Your email must have a valid format, such as name#mailhost.com";
}
$limit = 1000;
if (empty($com) || !preg_match("/^[0-9A-Za-z\/-\s'\(\)!\?\.,]+$/", $com) || (strlen($com) > $limit)) {
$error_msg[] = "The Comments field must contain only letters, digits, spaces and basic punctuation ( ' - , . ), and has a limit of 1000 characters. Website addresses can not be included.";
}
if (!empty($spa) && !($spa == "4" || $spa == "four")) {
echo "You failed the spam test!";
exit ();
}
// Assuming there's an error, refresh the page with error list and repeat the form
if ($error_msg) {
echo '<!DOCTYPE html>
<html lang="en">
<!-- Begin head items -->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1">
<meta name="description" content="The Dark Fortress contact form. Use it to get in touch…" />
<link href="../styles/screen.css" rel="stylesheet" type="text/css" media="screen" />
<link rel="alternate" type="application/rss+xml"
title="thedarkfortress Command Briefing"
href="http://feeds.feedburner.com/ThedarkfortressCommandBriefing" />
<title>O dear! | The Dark Fortress</title>
<style type="text/css">
.hide {display:none;}
</style>
</head>
<!-- Begin body items -->
<body>
<div id="container">
<!-- Begin header items -->
echo file_get_contents("../components/header.php");
<!-- Begin main content items -->
<div id="content-container">
<!-- Begin content items -->
<div id="content">
<h1>O dear!</h1>
<p>Unfortunately, your message could not be sent. The form as you filled it out is displayed below. Make sure each field completed, and please also address any issues listed below:</p>
<ul class="err">';
foreach ($error_msg as $err) {
echo '<li>'.$err.'/li>';
}
echo '</ul>
<form method="post" action="', $_SERVER['PHP_SELF'], '">
<label for="name">Name</label>
<input name="name" type="text" size="40" maxlength="60" id="name" value="'; if (isset($_POST["name"])) {echo $nam;}; echo '">
<label for="email">Email Address</label>
<input name="email" type="email" size="40" maxlength="60" id="email" value="'; if (isset($_POST["email"])) {echo $ema;}; echo '">
<label for="comm">Comments</label>
<textarea name="comments" rows="7" cols="50" id="comm">'; if (isset($_POST["comments"])) {echo $com;}; echo '</textarea>
<div class="hide">
<label for="spam">What is six plus four?</label>
<input name="spam" type="text" size="4" id="spam">
</div>
<input type="submit" name="submit" value="Send" class="button orange send" />
</form>
<div class="divider"><hr /></div>
<p><img src="../main_assets/isiah_page_sig_flat.png" alt="Isiah signature" /></p>
<p><strong>Chronicler Isiah,</strong> the 4th Battle Company, Dark Angels.</p>
</div>
<!-- Begin left nav items -->
<div id="leftnav">
echo file_get_contents("../components/hq_leftnav.php");
</div>
</div>
</div>
<!-- Begin footer items -->
echo file_get_contents("../components/footer.php");
<!-- Begin google analytics tracker items -->
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("xxxxxx"); pageTracker._trackPageview();
</script>
</body>
</html>';
exit();
}
$email_body =
"Name of sender: $nam\n\n" .
"Email of sender: $ema\n\n" .
"COMMENTS:\n\n" .
"$com" ;
// Assuming there's no error, send the email and redirect to Thank You page
if (isset($_REQUEST['comments']) && !$error_msg) {
mail ($your_email, $subject, $email_body, "From: $nam <$ema>" . "\r\n" . "Reply-To: $nam <$ema>");
header ("Location: $thanks_page");
exit();
}
}
You'd simply use CSS as you normally would...
<?php
// index.php
?>
<!doctype html>
<html>
<head>
<style type="text/css">
.myClass {
color: #f00;
}
</style>
</head>
<body>
<?php
include('myFile.php');
?>
</body>
</html>
<?php
// included myFile.php
echo '<p class="myClass">Echoed content!</p>';
If you're ending up with a blank page with no content then you potentially have errors in your PHP. Ensure error reporting is enabled and you'll be able to see what's going wrong.