Previous Chapter | Next Chapter | Up | Next Section | Contents

Creating Images and DTML Methods


Now that Stan has completed the first part of this task, he has to create a simple company Web page that links to the newly created Folders, contains a company logo and indicates when the full site is expected to come online. First, Stan needs to find a company logo graphic to use in the home page. With some help from the graphics department, he finds a disk containing the logo. Now, all Stan has to do is get the logo into Zope, in particular into the Plutonia Folder. Stan creates an Image object in the Plutonia Folder by completing the following steps:

  1. Selecting "Image" from the Add List and clicking "Add", Stan is presented with the workspace as shown in Figure 4 .
  2. Adding Images

     

  3. Stan sets the "Id" to PlutoniaLogo and the "Title" to The Plutonia Logo . He clicks the "Browse..." button to select the logo file from his disk. Since the logo is a GIF file, the height and width of the image are determined automatically.
  4. Finally, he clicks "Add" to create the Image.

Stan's next task is to create a home page. Since the Plutonia Folder was initialized during the Zope installation, it does not contain a public interface, or index_html DTML Method1. Thus, he needs to add a DTML Method to the Plutonia Folder. DTML Methods are how information in Zope objects is presented to users accessing Zope as a normal website. By taking on the properties of the objects they are contained in, DTML Methods can be used to manipulate and display the objects' data. To create the DTML Method, Stan does the following steps:

  1. Selecting "DTML Method" from the Add List and clicking "Add", Stan is presented with the Add DTML Method form as shown in Figure 5 .
  2. Adding DTML Methods

     

  3. Stan sets the "Id" to index_html and sets the "Title" to Welcome to Plutonia.
  4. Stan could upload an HTML file from his computer at this point by clicking the "Browse..." button, but he wants to type in the DTML Method contents within Zope. The file field remains empty.
  5. He clicks "Add" to create the DTML Method.
  6. In the Contents view of the folder, Stan opens the DTML Method for editing by clicking on its id in the Folder Items list. The screen which then appears is shown in Figure 6 .
  7. Managing a DTML Method

     

  8. He deletes the text that is automatically inserted by Zope and enters in the following:

<HTML><HEAD>

<TITLE><!--#var document_title--></TITLE>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<P><!--#var PlutoniaLogo--></P>

<H4>Welcome to Plutonia Web, the official web site of Plutonia Incorporated</H4>

<P>This site is currently under construction. Be sure to visit us soon when the full site is ready. We expect to have information online concerning:

<UL TYPE=SQUARE>

<LI><A HREF="News">Company news and press releases</A>

<LI><A HREF="Products">Company product information</A>

<LI><A HREF="Research">What we have brewing in our research labs</A>

</UL>

</BODY></HTML>

Here we have a simple HTML page with Zope Document Template Markup Language ( DTML ) instructions interspersed with normal HTML text. DTML follows the same style as Server Side Includes (SSI), which embeds its special markup in HTML comment tags with a pound ("#") symbol. We use two DTML instructions here:

Mission accomplished! Except for one thing, Stan needs to put a date in the home page telling when the full site is expected to come online. He could do this manually by entering a date into the home page DTML Method. However, if the date was entered manually in other pages, then a change in the expected date would require a great deal of editing. Fortunately, by using DTML and Folder properties, the expected date can edited in all the pages by editing only one date. Stan takes the following steps:

  1. He goes back to the main folder by clicking on it in the navigation frame, and clicks on the Properties tab in the workspace. The Properties screen appears as shown in Figure 8 .
  2. Properties screen

     

The top portion of the properties screen is where existing properties can be edited or deleted.

The bottom portion is where new properties can be added by selecting their type, giving them an id and a value.

    Stan needs to add a Date property. He goes to the add property portion of the screen and gives this property the id, expected_date . He then selects the type "date", types in a value of January 27, 1999 and clicks "Add". The screen refreshes with a new property named expected_date . Note that the date appears in the format 1999/01/27 . This is because it is a Zope date-time value and Stan chose to have the property be of type date instead of string. Zope date-time values can be formatted and calculated according to the rules of dates and times. Now, whenever the expected date needs to be changed within the home page, Stan can easily make the change here.

  1. To put expected_date in the home page, Stan returns to the Contents view of the Folder and opens the index_html DTML Method by clicking on its id in the Folder Items list. He adds the following paragraph to the DTML Method after the unordered list (UL).

<P>The full site is expected to come online on

<!--#var expected_date--></P>

Since expected_date is a property of the Folder containing the home page, it can be accessed in a var tag. In Zope, expected_date can also be accessed in a var tag within DTML Methods in sub-folders. This technique, known as acquisition , is one of the unique features of Zope. Acquisition easily allows information sharing across a website.

Previous Chapter | Next Chapter | Up | Next Section | Contents