SiteExperts.com Logo Home | Community | Developer's Paradise | Jobs
User Groups | Site Tools | Site Information | Search

Inside Technique : Building a Content Server with XML and ASP : Introducing the Content Server

The Content Server user-interface exposes four different pages for creating your stories:

  1. The story index page
  2. The story generator page
  3. The story editor page
  4. The story editor page

The Story Index page is used to display the list of stories or articles. The story list page is generated from a simple XML file, index.xml. Each story has a unique ID, a title, and an author. For example, below is the index.xml file with two stories: 

<?xml version="1.0"?>
<storyindex>
 <article>
   <id>1</id>
   <title>My First Article</title>
   <author>Scott Isaacs</author>
 </article>
 <article>
   <id>2</id>
   <title>My Second Article</title>
   <author>Scott Isaacs</author>
 </article>
</storyindex>

When the user requests to view the story index, the index file is transformed using an XSL style sheet to generate an HTML view. The default XSL sheet is extremely simple: 

<?xml version="1.0"?>
<HTML xmlns:xsl="http://www.w3.org/TR/WD-xsl">
  <HEAD>
    <TITLE>Story Index</TITLE>
  </HEAD>
  <BODY>
    <H1>Story Index</H1>
    <OL ID="toc">
      <xsl:for-each select="storyindex/article">
        <LI><A>
          <xsl:attribute name="HREF">
            story.asp?storyid=<xsl:value-of select="id"/>
          </xsl:attribute>
          <xsl:value-of select="title"/>
          </A> by <xsl:value-of select="author"/> 
          [<A><xsl:attribute name="HREF">editstory.asp?storyid=
          <xsl:value-of select="id"/></xsl:attribute>Edit
        </A>]</LI>
      </xsl:for-each>
    </OL>
    <FORM>
      <INPUT TYPE="BUTTON" VALUE="Add New Story" 
        ONCLICK="window.location='editstory.asp'"/>
      <INPUT TYPE="BUTTON" VALUE="Edit Story XSL" 
        ONCLICK="window.location='editstyle.asp?template=article.xsl'"/>
      <INPUT TYPE="BUTTON" VALUE="Edit Index XSL" 
        ONCLICK="window.location='editstyle.asp?template=index.xsl'"/>
    </FORM>
  </BODY>
</HTML>

This XSL template enumerates each article in the index and creates the appropriate links. Each story page is retrieved from the story.asp by passing in the appropriate story identifier. In addition, an edit link for each story/ article is generated. For an introduction to XSL and the techniques used in the index.xsl sheet, please read the article, Building Documents with XML, XSL, and CSS.

When the XSL file is applied to XML index the following HTML is generated (none of the links are enabled):

Story Index

  1. My First Story by Scott Isaacs [Edit]
  2. My Second Story by Scott Isaacs [Edit]

This index page is fairly self-explanatory. Clicking on a story title takes you to the story, clicking on edit allows you to edit the story, and the XSL edit buttons allow you to change the presentation. The edit XSL buttons are the most powerful aspect of the system. By modifying the XSL sheet you can change the appearance of the index or all your stories without having to revisit or modify any of your HTML pages.

Editing Stories

When you edit or add a story, you are taken to a page with a form. Editing the second story produces the following page:

Story Editor

Story Index

Title:
Author:

This page allows you to update the title, author or the actual story using XML. Just like the index file, by using XML we can independently define a presentation for the article. Unlike using CSS, by building the presentations around XSL, you are free to rearrange and organize your articles any way you desire. With CSS, you are constrained by the original structure of the document.

Viewing Stories

The last feature is viewing the document. The XML-based stories are transformed into HTML using XSL. Our default XSL template transforms the article into a format similar to the following:

Story Index

My Second Story

Scott Isaacs
On 7/8/1999

Abstract
A cool content server article

Table of Contents

  1. The Content Server
  2. Editing Pages

1. The Content Server

The content server....

2. Editing Pages

Editing Pages...

This page demonstrates the advantages of using XSL. With XSL, we have complete freedom for laying out the page. With XSL, we generates a live table of contents with an entry for each section of the document, a link to the author's e-mail address, and provided custom formatting for all the elements.

The XSL used to transform the story into HTML is the same one we used in the article, Building Documents with XML, XSL, and CSS. If you are interested in digging deeper into the XSL template, we recommend you review that article.

Next we are going to walk through the different ASP pages that make up the content server. The entire content server is built using three ASP pages. One for displaying the story index and actual stories, another for editing the stories, and a last page for editing the XSL style sheet. The system could easily be condensed to 2 pages by combining the two editor pages. We chose to separate them for the sake of simplicity. We are going to start by discussing the story.asp page that generates the article and index views.

Page 1:Building a Content Server with XML and ASP
Page 2:Introducing the Content Server
Page 3:Rendering Files
Page 4:Editing Files
Page 5:Saving Files
Page 6:Installing the Demo

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.