Using PHP SimpleXml to create HTML from XML data

This tutorial shows a method of using a customisable PHP function to automatically present data contained in an XML format as HTML.

The technique used by the PHP function, render_xml_data, in this article is useful for processing relatively small amounts of data records.

render_xml_data can mitigate the need for databases such as MYSQL until the records reach a significant number.

Designed to be easily adapted without requiring a high level of programming knowledge, the render_xml_data function also provides a lower cost of administration.

The examples shown and their explanation does however, assume a working knowledge of PHP and XML.

Download the example files.

The XML data

<painting>
	<title>The painting
	</title>
	<artist class="post_impressionist">Artist name.
	</artist>
	<date>Date of the painting.
	</date>
	<medium>The materials used.
	</medium>
	<movement>The main artistic influence or school.
	</movement>
	<more_info><![CDATA[<a href="http://en.wikipedia.org/wiki/link_to_artist" title="Find out more about the artist at Wikipedia">Wikipedia</a>.]]>
	</more_info>
</painting>
					

The PHP Function

function render_xml_data($path_to_xml_file){
	if (!file_exists($path_to_xml_file)){
		return;
	}else{
		$chars_to_replace = array('[\r]','[\n]','[\t]');
		$xmlstring = trim(preg_replace($chars_to_replace, '', file_get_contents($path_to_xml_file)));
	}
	$xml = new SimpleXMLElement($xmlstring);
	foreach ($xml->painting as $record) {
		echo '<div class="painting_record">'."\n";
		echo '<h3>'.$record->title.'</h3>'."\n";
		echo '<p><span class="category">Artist: </span>'.$record->artist.'</p>'."\n";
		echo '<p><span class="category">Date: </span>'.$record->date.'</p>'."\n";
		echo '<p><span class="category">Medium: </span>'.$record->medium.'</p>'."\n";
		echo '<p><span class="category">Movement: </span><span class="'.$record->artist['class'].'">'.$record->movement.'</span></p>'."\n";
		echo '<p><span class="category">More info: </span> Find out more about '.$record->artist.' from '.$record->more_info.'</p>'."\n";
		echo '</div><!--end painting_record-->'."\n";
	}
}
					

Calling the PHP render_xml_data Function

if(function_exists('render_xml_data')){
	render_xml_data('example_data.xml');
	}else{
	echo null;
}
					

The HTML output

Wheatfield with Crows

Artist: Vincent Willem van Gogh

Date: 1890

Medium: Oil on canvass

Movement: post-Impressionist

More info: Find out more about Vincent Willem van Gogh from Wikipedia.

Leonardo da Vinci - Self-portrait

Artist: Leonardo da Vinci

Date: c. 1512

Medium: Red chalk on paper

Movement: High Renaissance

More info: Find out more about Leonardo da Vinci from Wikipedia.

Woman with a Hat

Artist: Henri Matisse

Date: 1905

Medium: Oil on canvas

Movement: Modernism

More info: Find out more about Henri Matisse from Wikipedia.

Ge Zhichuan Relocating

Artist: Wáng Méng

Date: 14th century

Medium: Hanging Scroll, ink and colour on paper

Movement: N/A

More info: Find out more about Wáng Méng from Wikipedia.

How to use the render_xml_data function

Create the PHP render_xml_data function file

Copy the render_xml_data function to a file and save it as 'render_xml_to_html.php', without the quotes.

Insert the created file as a PHP include statement into the top of a page where XML data is to be displayed as HTML:

Include the PHP render_xml_data function file

include ('render_xml_to_html.php');

Calling the function to render XML to HTML

render_xml_data('example_data.xml');

How the render_xml_data function works

  • If the XML file does not exist then exit the function and continue to render the rest of the HTML:

    if (!file_exists($path_to_xml_file)){

    return;

  • Pre-wash the XML, stripping out unwanted white spaces, tab and return characters:

    $chars_to_replace = array('[\r]','[\n]','[\t]');

    $xmlstring = trim(preg_replace($chars_to_replace, '', file_get_contents($path_to_xml_file)));

  • Return the XML string as an object.

    $xml = new SimpleXMLElement($xmlstring);

  • Use the tag <painting> as a reference point and loop through all the records:

    foreach ($xml->painting as $record)

  • Render the value of the XML tag <title> in a </h3> HTML tag:

    echo '<h3>'.$record->title.'</h3>'."\n";

  • Get the value of the class attribute of the tag <artist> and assign it to the span class attribute:

    * This is mainly to demonstrate accessing the attribute of an XML tag. It should be remembered that tag attributes should only be used for the purposes of metadata, which is a description of the data.

    echo '<p><span class="category">Movement: </span><span class="'.$record->artist['class'].'">'.$record->movement.'</span></p>'."\n";

Each record output is wrapped in a CSS painting_record class.

Additional notes

There has been no testing to assess the maximum number of records or file size that can be used.

Nested tags are not a problem, they can be accessed with the same method as used for tag attributes above, for example:

$record->child_tag->grand_child_tag

Other uses that the 'render_xml_data function' has been put to include Javascript image galleries such as Gallerific.

A further suggestion could be for the displaying of sitemaps that are in XML format as a HTML page.

License

These instructions are free to use and distribute under the GNU Free Documentation License.

Gary Hollands - October 2010.