O'Reilly logo

PHP Hacks by Jack D. Herrington

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Hack #5. Create HTML Boxes

Use HTML and simple graphics to create attractive boxes for your web pages.

Sometimes it's useful to put your page content into boxes to make it easier for users to navigate your site. You can draw attention to a particular piece of content, create newspaper-like interfaces, or just go with a little cubism to impress your artsy friends. The scripts in this hack make it easy to draw boxes around any content you like.

The Code

Save the code in Example 2-5 as box1test.php.

Example 2-5. A test page for boxing up content

	<html>
	<head>
	<? include( "box1.php" );
	add_box_styles();
	?>
	</head>
	<body>
	<div style="width:200px;">
	<? start_box( "News" ); ?>
	Today's news is that there is no news. Which is probably a good thing since
	the news can be fairly distressing at times.<br/><br/>
	<a href="morenews.html">more…</a>
	<? end_box(); ?>
	</div>
	</body>
	</html>

For the PHP portion of the mini-application, save the code in Example 2-6 as box1.php.

Example 2-6. Adding a little PHP and CSS

 <? function add_box_styles() { ?> <style type="text/css"> .box { font-family: arial, verdana, sans-serif; font-size: x-small; background: #ccc; } .box-title { font-size: small; font-weight: bold; color: white; background: #777; padding: 5px; text-align: center; } .box-content { background: white; padding: 5px; } </style> <? } function start_box( $name ) { ?> <table class="box" cellspacing="2" cellpadding="0"> <tr><td class="box-title"><? print( $name ) ?></td></tr> <tr><td class="box-content"> ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required