Part 18 - Learning XML for Beginners
Written by Eric Muss-Barnes, 29 December 2018
XML is an abbreviation for "eXtensible Markup Language" and is a very smart alternative to using a database. I have not used XML as frequently as I should have been using it. Back when I began programming, if you wanted to display any kind of dynamic content, you would use a database.
However, that is not a wise way to program. I have learned that was a mistake.
Databases are only useful in two instances:
1.) On very large websites, where a massive quantity of users might need to access data simultaneously.
2.) On websites where you will be editing and changing information through the website itself. For example, a social media website, where people have profile and logins and post and edit information, needs a database.
But...
If your website simply updates some information, such as this website, adding more articles and videos, you can use XML instead. Using XML is far easier and far more efficient.
One great example is the homepage of this site. Let me show you how this site uses XML to list articles and videos on the homepage, using the code below. Note for this example, I am only going to use a few videos, not all of them. I want to keep the code simple enough for you to follow along, so I don't want to confuse you with too much data.
PART 18 - LESSON A - XML DATA LOOP
<![CDATA[
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="includes/styles.css" />
<title>XML Example</title>
</head>
<body>
Below is a block of PHP code that loops through the nodes of an XML file.
<br>
<?php
// SPECIFY URL OF XML FILE
$url = "includes/videodata.xml";
// GET XML FILE CONTENTS
$xml = simplexml_load_file($url);
// LOOP BEGINS
foreach($xml->videos as $videos)
{
echo "<div id=\"containerbox\">";
echo "<div class=\"image\" style=\"background-image:url('http://i.ytimg.com/vi/".$videos->videolink."/mqdefault.jpg')\">";
echo "<a href=\"https://www.youtube.com/watch?v=".$videos->videolink."\" onmouseover=\"document.aa".$videos->id.".src='images/play-button.png'\" onmouseout=\"document.aa".$videos->id.".src='images/1x1.gif'\" target=\"_blank\"><img name=\"aa".$videos->id."\" src=\"images/1x1.gif\" class=\"videoiconholder\"></a></div>";
echo "<a class=\"dontunderlineme\" href=\"https://www.youtube.com/watch?v=".$videos->videolink."\" target=\"_blank\">".$videos->title."</a>";
echo "<br>";
echo "<ul class=\"actions stacked\">";
echo "<li><a href=\"https://www.youtube.com/watch?v=".$videos->videolink."\" onmouseover=\"document.aa".$videos->id.".src='images/play-button.png'\" onmouseout=\"document.aa".$videos->id.".src='images/1x1.gif'\" target=\"_blank\" class=\"button small primary\">Watch Video</a></li>";
echo "<li><a href=\"".$videos->articlelink."\" class=\"button small primary\">Read More</a></li>";
echo "</ul>";
echo "</div>\n\n";
}
// LOOP ENDS
?>
</body>
</html>]]>
What if you don't want all the records from an XML file? What if you just need to display one?
PART 18 - LESSON B - XML DATA FROM SINGLE NODE
<![CDATA[
<!DOCTYPE HTML>
<html>
<head>
<title>XML Example</title>
</head>
<body>
Below is a block of PHP code that loops through the nodes of an XML file, and only pulls one result; namely the "videolink" child from "videos" node id 003.
<br><br>
<?php
// This first line sets a variable called "$xml" and it grabs the XML file from the filepath.
$xml = simplexml_load_file('includes/videodata.xml');
// Next, we loop through all the records in the XML file and we set a variable for the "videos" nodes called "$identify"
foreach($xml->videos as $identify)
{
// Now we say, "as you loop through all the nodes, if you find an ID which equals '003', assign the value of the corresponding 'videolink' node to a variable called '$YouTubeCode'"
if($identify->id == "003")
$YouTubeCode = $identify->videolink;
}
?>
<!-- Now that we have assigned a value to the $YouTubeCode variable, we just print that variable in our links below. -->
<a href="https://www.youtube.com/watch?v=<?php echo $YouTubeCode ?>" target="_blank"><img name="icon" src="http://i.ytimg.com/vi/<?php echo $YouTubeCode ?>/mqdefault.jpg"></a>
</body>
</html>]]>
Similar to the code above, let's pull data from a single node, but instead of hardcoding that node, let's use a querystring.
PART 18 - LESSON C - XML DATA FROM SINGLE NODE WITH QUERYSTRING
<![CDATA[
<!DOCTYPE HTML>
<html>
<head>
<title>XML Single Node With Querystring Example</title>
</head>
<body>
Below is a block of PHP code that loops through the nodes of an XML file, and only pulls one result; namely the "videolink" child from "videos" node id of the matching querystring.
<br><br>
<?php
// This first line sets a variable called "$xml" and it grabs the XML file from the filepath.
$xml = simplexml_load_file('includes/videodata.xml');
// Next, we loop through all the records in the XML file and we set a variable for the "videos" nodes called "$identify"
foreach($xml->videos as $identify)
{
// Now we say, "as you loop through all the nodes, if you find an ID which equals the querystring ID value, assign the value of the corresponding 'videolink' node to a variable called '$YouTubeCode' and the 'title' node of the video with a variable called '$TitleOfVideo'"
if($identify->id == $_GET['myquerystring'])
($YouTubeCode = $identify->videolink) && ($TitleOfVideo = $identify->title);
}
?>
The first time you hit this page, there will not be a video below. But, one will load when you click one of these links:<br><br>
<a href="lesson-c-xml.php?myquerystring=001">First Video</a><br>
<a href="lesson-c-xml.php?myquerystring=002">Second Video</a><br>
<a href="lesson-c-xml.php?myquerystring=003">Third Video</a><br>
<a href="lesson-c-xml.php?myquerystring=004">Fourth Video</a><br>
<br>
<!-- Now that we have assigned a value to the $YouTubeCode variable, we just print that variable in our links below. -->
<a href="https://www.youtube.com/watch?v=<?php echo $YouTubeCode ?>" target="_blank"><img name="icon" src="http://i.ytimg.com/vi/<?php echo $YouTubeCode ?>/mqdefault.jpg"></a>
<br><br>
<?php echo $TitleOfVideo ?>
</body>
</html>]]>
The biggest advantage to using XML over a database is simplicity. Creating a new database, linking to it, and writing all the code to parse that data is about twice the amount of code and effort as using the XML file. When you get ready to add more information to the website, you simply edit the XML file and upload the new version via FTP, like you do with all the other files for your website.
And remember, kids, the world owes you nothing... until you create things of value.
Glossary
XML
XML is an abbreviation for "eXtensible Markup Language" and is a markup language with a similar syntax to HTML, but all the tags (called "nodes") are customizeable variables. XML data can be parsed by various scripting languages into actual HTML code and therefore it makes a faster and easier replacement for a full database.
Downloads
Other Articles
