user3027864
user3027864

Reputation: 81

Embedding XML data in existing HTML/CSS template

I want to embed an XML file into an existing template I have been creating. My website contains a content header, content section, sidebar etc. But I want to embed the XML data into the content section, so that I can use my existing CSS and formatting without rewriting half of it in XSLT. I have already run across the "xml" tag, but I want to import it from an external file rather than inline.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="description" content="Local  fish and chips bar, serving the city for over 20 years.">
<meta name="keywords" content="Food,Drink,Fish,Chips,British">

<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
<div id="header">
<h1>
<img alt="logo" src="images\logo.jpg" style="width:473px;height:135px">Home</h1>
</div>
<div id = "wrap">
    <div id = "navWrap">
    <div id = "nav">
        <ul>
            <li><a class ="nav" href="index.html">Home</a></li>
            <li><a class ="nav" href="order.html">Order Online</a></li>
            <li><a class ="nav" href="look.html">Look Around</a></li>
            <li><a class ="nav" href="contact.html">Contact Us</a></li>
            <li><a class ="nav" href="#menu">Download Our Menu</a></li>
            <li><a class ="nav" href="#contact">Download Our App</a></li>
            <li><a class ="nav" href="report.html">Report</a></li>
        </ul>
    </div>
</div>
</div>


<div id="main">
<xml Id = msg SRC = "menu.xml"></xml> ----- **XML GOES HERE**
</div>


<div id="sidebar">
<div id = "sidebarMain">
</div>
<div id = "mapWrap">
<iframe src= width="400" height="300" frameborder="0" style="border:0"></iframe>
</div>
<h3><center><u>Opening Times</u></center></h3>
    <table style="width:100%">
        <tr>
            <th>Day</th>
            <th>Lunch</th>
            <th>Evening</th>
        </tr>
        <tr>
            <td>Monday</td>
            <td>10:00 - 14:00</td> 
            <td>16:00 - 22:00</td>
        </tr>
        <tr>
            <td>Tuesday</td>
            <td>10:00 - 14:00</td> 
            <td>16:00 - 22:00</td>
        </tr>
        <tr>
            <td>Wednesday</td>
            <td>10:00 - 14:00</td> 
            <td>16:00 - 22:00</td>
        </tr>
        <tr>
            <td>Thursday</td>
            <td>10:00 - 14:00</td> 
            <td>16:00 - 22:00</td>
        </tr>
        <tr>
            <td>Friday</td>
            <td>10:00 - 14:00</td> 
            <td>15:00 - 23:00</td>
        </tr>
        <tr>
            <td>Saturday</td>
            <td>10:00 - 14:00</td> 
            <td>15:00 - 23:00</td>
        </tr>
        <tr>
            <td>Sunday</td>
            <td>Closed</td> 
            <td>Closed</td>
        </tr>
    </table>
</div>


<div id = "footer">
Copyright © FryingNemo.com<br>
<br>
</div>
</body>
</head>

My xml file:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="nemoMenu.xsl"?>
<breakfast_menu>

<food>
<name>Belgian Waffles</name>
<price>$5.95</price>
<description>Two of our famous Belgian Waffles with plenty of real maple syrup</description>
<calories>650</calories>
</food>

<food>
<name>Strawberry Belgian Waffles</name>
<price>$7.95</price>
<description>Light Belgian waffles covered with strawberries and whipped cream</description>
<calories>900</calories>
</food>

<food>
<name>Berry-Berry Belgian Waffles</name>
<price>$8.95</price>
<description>Light Belgian waffles covered with an assortment of fresh berries and whipped                         cream</description>
<calories>900</calories>
</food>

<food>
<name>French Toast</name>
<price>$4.50</price>
<description>Thick slices made from our homemade sourdough bread</description>
<calories>600</calories>
</food>

<food>
<name>Homestyle Breakfast</name>
<price>$6.95</price>
<description>Two eggs, bacon or sausage, toast, and our ever-popular hash browns</description>
<calories>950</calories>
</food>
</breakfast_menu>

Any resolution on the issue would be appreciated, or perhaps I would be better of simply using XSLT.

Upvotes: 1

Views: 800

Answers (1)

Martin Honnen
Martin Honnen

Reputation: 167716

Neither HTML 4 nor HTML5 has an xml element, only older versions of IE on Windows supported that to embed so called XML data islands inline in HTML. So there is no other way to embed external XML documents in an HTML document other than there is to embed other content, namely the iframe element and the object element. That is as far as static HTML is concerned, of course if you have some server-side programming/processing framework or want to rely on client-side scripting, then there are other options.

Upvotes: 0

Related Questions