Quick Tip: Adding PHP content to your html page

If you’re like me and prefer using PHP scripting to enhance web-functionality, an important thing to know is how to add the results of any PHP coding into your web page.

The anatomy of a web page with the extension .php looks like this:

<?php

//your php stuff here (obviously)

?>
<html>
<header>
</header>
<body>
</body>
</html>

I know right now you’re saying, “WOW! That’s amazing! You’ve just created a blank web page that does nothing!” You’d be right of course..but that’s better than creating a web page that isn’t blank that does nothing.

For those of you who don’t like long tutorials and just want the actual code here it is:

<?php
$newtitle = "Proudly titled by PHP script!";
?>
<html>
<header>
<title><?php echo $newtitle; ?></title>
</header>
<body>
</body>

Before I go further, let me warn you about one thing. If you work in PHP you will want to set your error_reporting levels appropriately on public web pages, as if an error is thrown, the user will gain insight into your code, and perhaps find a vulnerability.

Here’s a handy link on how to do that, as its outside the scope of this post.

One of the great things about this method is you can also include HTML tags and what not, giving you almost unlimited flexibility in building the page the user sees.

So, here’s a script that will change the background colour of a web page programmatically. There’s a link at the bottom, so you can see it in action.

 
<?php
$bcol[0] = "#000000";	//black
$bcol[1] = "#33CC66";	//green
$bcol[2] = "#FF3366";	//fuscia (yes, I know what fuscia is
$bcol[3] = "#0000FF";	//blue

rand();		//seed the randomizer

$tc = rand(0,3);

$style = '<style>';
$style .= 'body {';
$style .= 'background-color:'.$bcol[$tc].';';
$style .= '</style>';

?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Mood Ring</title>
<?php echo $style; ?>   <!--this is where the code above is added to the webpage -->
</head>
<body>
<span id="txt1" style="font-size:larger;">The background colour is driven by a PHP script</span>
</body>
</html>

In the above example, you’ll see where in lines 11-14, I load the contents of the html style tag into the PHP variable $style (did I ever mention that I’m awesome at naming variables?).

In line 22, I add the contents of $style to the HTML page.

If you view source, this is what you’ll see…

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Mood Ring</title>
<style>body {background-color:#FF3366;</style>   <!--this is where the code above is added to the webpage -->
</head>
<body>
<span id="txt1" style="font-size:larger;">The background colour is driven by a PHP script</span>
</body>
</html>

If you’re wondering what happened to the all the PHP stuff, servers will typically strip it out and not send it to the client.

Hopefully this helps you out. If not, leave a comment, and I’ll try and help you out.

Moodring

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s