The ability to embed frequently updated (and even automatically updated) live data into web page content is essential to maintaining sites with fresh content—preferably without having to rewrite the page content manually every day. The basic concept behind live data is that the page design and the updatable data exist as distinct but integrated components of a web page. You design the page once, and that page updates as the content of an associated database changes.
For example, a photographer might want to maintain an online portfolio that can be updated frequently without the need to touch actual page layouts. Or a theater might want to maintain a site that includes updated event schedules—again, without having to revise the actual web pages.
In my opinion, working with live data has always been the single greatest problem in Dreamweaver. Yes, I've embedded live data from Microsoft Access databases into Dreamweaver pages, but only with a database manager having created my database, and only by having a server administrator on call (and, in my case, literally sitting next to me) to help me navigate through Dreamweaver's far-from-intuitive live data panels.
With Dreamweaver CS4, the wall between web designers and live data has been opened at least halfway. In this article, I'll help you to push through the rest of the way.
We'll get to the details in a minute, but first let's review the basic steps for embedding live data into Dreamweaver CS4 web pages:
- Create a table in a Dreamweaver web page to hold your data. You can copy and paste a table from Microsoft Excel, or you can create it in Dreamweaver. I won't provide a complete reference here on how to work with tables in Dreamweaver web pages, but I will show you how to create a table that works well for organizing data to embed it into a web page.
- Populate the table with the initial set of data that will be displayed on your web page—a list of your available products, your band's tour schedule, a catalog of books in your library, whatever. This table, with data, becomes a Spry Data Set, and the data can be embedded in a web page.
- Use the Spry Data Display (a tool new to Dreamweaver CS4) to embed the data in a web page.
A couple of quick notes before we dive into the nitty-gritty of creating live data pages in Dreamweaver CS4:
- This technique won't work with earlier versions of Dreamweaver. The features I describe here are new in CS4.
- This article is intended for web designers who are familiar with at least the very basic concepts of web design with Dreamweaver. Specifically, I'll assume that you're aware of the first rule of working with Dreamweaver: Define a Dreamweaver website before you even think about creating web pages. I'll assume that you already have a Dreamweaver website defined.
With those provisos, let's do this!