Using XML and XSLT to Personalize a Web Site Part 4: Dynamic Style Sheets and User Customized Layout
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
In Part 3 of this series, "Allowing Users to Choose Look and Feel," we introduced you to the idea of performing transformations on the server and then delivering straight HTML to the browser. This gave us two advantages: first, it eliminated the need for the user to have an XSLT-capable browser; and second, we were able to use server-side programming to determine which style sheet should be used.
In this final installment, we are taking things one step further. Rather than simply specifying a style sheet, the user will actually build one with his or her choices. In this way, the user will determine what content appears on the page, and where. Because XSLT style sheets are simply XML documents, we can use their choices to dynamically build a style sheet that we can ultimately use to create their pages.
The final stage of the project involves the following steps:
Allow the user to choose modules and layout
Save user choices
Build the final style sheet using DOM
Apply the final style sheet
As in Part 3, we'll discuss sample code in both ASP (VBScript using IIS4 or above) and Java (servlets using Apache's Tomcat and Xalan software). The setup will depend on whether you're using Active Server Pages or Java, so if you haven't been following along until now, please go back to Part 3 and follow the setup instructions there. You can install the actual source files as part of this section.
We've made changes to three files since Part 3: content.xml, style1.xsl, and style2.xsl. Download XSLTPersSource4.zip and place the files as follows:
ASP Setup. To follow along, copy the files in aspgeneral to the Web server's main directory or document root. If you prefer to skip ahead, the completed files are in the asppages folder.
Java Setup. To follow along, open the javaBefore folder, and copy the contents of javageneral to the Web server's root folder. To make configuration simple, we are using Tomcat's examples application, so copy the contents of javaclasses to the examples/web-inf/classes directory. To skip ahead to the completed versions, use the files in the javaAfter folder.
The Project
In this phase of the project, we will enable the user to create a miniportal out of the home page. To do that, users will choose not only the overall style sheet for the site, as they did in Part 3, but also the items that appear on the home page and the location.
To the news items, we are also adding weather and TV listings, as seen in Figure 1.
){kind=link}
Figure 1 The portal includes weather, TV listings, and the news.
To keep things simple, we'll allow only a limited range of choices; you can expand that range as you see fit, of course! We'll offer users the chance to put the news on the top or the bottom, and the weather and listings on the left or right, respectively. In addition, users can choose their "local" weather, and any piece may be left out entirely.