In this example we'll start with a collection of separate pages. These are pretty much just carbon copies of each other with the numbers in the headings changed.
Add the following markup to the
<body>of our template file:<div id="outer-container"> <header> <h1>A Whole Site on a Single Page</h1> <nav class="clear-float"> <ul> <li><a class="on" href="single-page-site-1.html" title="Page 1">Page 1</a></li> <li><a href="single-page-site-2.html" title="Page 2">Page 2</a></li> <li><a href="single-page-site-3.html" title="Page 3">Page 3</a></li> <li><a href="single-page-site-4.html" title="Page 4">Page 4</a></li> <li><a href="single-page-site-5.html" title="Page 5">Page 5</a></li> </ul> </nav> ...
