Synopsis: This is one in a series of blogs on how I used SharePoint Designer in real-world solutions. This covers creating a list and a set of pages in a WSS site that render press releases online.
I recently helped a client build a web site that required a press release page. On the main page, the anonymous users were supposed to see a list of short titles in the corner of the page. When they click on that short title, they should be directed to a page that displays a full title and the full article. Additionally, when users navigate to the tab on the top toolbar, they should see a listing of all the active press releases. All this is to be styled using custom HTML defined in the master page.
From the administration perspective, we want the admin (not me as the programmer) to go into an admin area to edit these press releases. They need to be able to create new ones, approve them and set begin/end dates on them.
A SharePoint list is a great solution to this. The first big win is that we don't have to build much of the administration functionality at all. With any SharePoint list, of course, you get all the input/listing and edit forms. So the admin need only know how a list works. Also, we want to be able to support things like versioning, check-in/check-out and lightweight approvals -- again, all available in a simple SharePoint list and all available in WSS as well as MOSS. So we'll start in a simple blank site and build a custom list that meets our needs and call it "Press Releases." From here, we'll add some columns to end up with these:
- Title (already on the list, required)
- ShortTitle (single line of text, required)
- Body (multi-line text that supports rich text, required)
- StartDate (date and time, required)
- EndDate (date and time, required)
Your columns should look like this now:
Then, while in List Settings, go to Versioning and enable that. Also enable item approval, and check-in/check-out. Approval is really all we need here, but the other is an added bonus for the administrator. Add a couple of press releases to the list to have something like the following:
The next thing we need to do is turn our attention to SharePoint Designer, as this will be the tool we'll use to render our data in various pages. There are two pages we're concerned about: PressRelease.aspx, and ReleaseList.aspx. The PressRelease.aspx page will show a single press release. ReleaseList.aspx is going to show us multiple press release titles in a full-view page. The default page could display a short list of press releases so users can see them right up front on our page.
ReleaseList.aspx
Let's start with our most simple page, the ReleaseList page. Using SharePoint Designer, create the ReleaseList.aspx page in the root of the site and, if you want, attach the master page so you have the look and feel you want to achieve. In this exercise, we'll simply use a blank page so we don't make things too complicated. You'll see something like this:
Next we need to add some data from our list. Go to the Task Panes menu and make sure the Data Source Library tab is selected. If selected, you can see it appear to the right as an additional tab which is peer to the toolbox. This task pane shows us all the data sources available in the environment. When SharePoint Designer opens up, it communicates to the server to see what's available. Notice you can have lists, document libraries, XML files, and external data. Also, if you're using MOSS Enterprise, you'll see BDC data sources show up here.
Next, we need to select our data source (Press Releases list) and right-click to see a drop-down. We'll choose Show Data, which will take us another task pane which shows us all the columns available in the list we've chosen. Select the Press Releases list from the available lists and then choose to Show Data from the drop-down that appears, just like this:
Once you do this, all the available columns show up in the display tab called Data Source Details. From here, click the Title field and drag it to the design surface below the title. This will render all the items in the list in design-time, which is pretty cool. The resulting screen looks like this:
Next we need to filter out those item which aren't approved and don't fall into the desired publishing timeframe. Note, we'll use the Common Data View Tasks to do this. Click on the filter link and then set the criteria as follows:
Approval Status = Approved
Start Date <= today
End Date >= today
The filter should look like:
Next, you can adjust the layout by selecting the Data View Properties.
Now that we have a press release listing page, what happens when I click on a title? Now, we need to link the title to the PressRelease page, which will display a single press release. Select the Title and change it's type to Hyperlink as below.
Continue through the warning about the trusted environment. Change the following:
Address: PressRelease.aspx?id={@ID}
Text to Display: {@Title}
Your screen should look like this:
PressRelease.aspx
Now, let's create PressRelease.aspx. This page is going to receive a querystring parameter. Let's start with another blank aspx page and choose the data library to find our Press Releases list first. Then select "show data" to view the available columns. Next, choose the Title and Body columns an choose to insert a single item view:
Now, we need to filter the item that displays with the querystring parameter passed in. Choose "Parameters" from the Common Data View Tasks pane that appears. Then add a new parameter that looks at ID as a source parameter in the querystring.
Next choose Filter from the Common Data View Tasks. We need to filter the press releases to find the one from our newly created parameter. The filter should look like this:
Now you have a press release system. Administrators can get to administrative pages to add/update press releases and end users can only see those press releases which are active and approved. Through the use of a SharePoint list, we also have versioning, which is difficult to achieve in a typical database.