Previous 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. This page will link to the newly created Folders, will contain a company logo and will indicate 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 ZAcme Folder. Stan creates an Image object in the ZAcme Folder by completing the following steps:

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

     
  2. Stan sets the "Id" to ZAcmeLogo and the "Title" to The ZAcme, Inc. 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.
  3. Finally, he clicks "Add" to create the Image.

Stan's next task is to create a home page. Since the ZAcme Folder was initialized during the Zope installation, it does not contain a public interface, or index_html DTML Method. Thus, he needs to add a DTML Method to the ZAcme 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:

Adding DTML Methods

 
  1. Selecting "DTML Method" from the "Available Objects", Stan is presented with the Add DTML Method form as shown in Figure 5 .
  2. Stan sets the "Id" to index_html and sets the "Title" to Welcome to ZAcme, Incorporated.
  3. 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.
  4. He clicks "Add" to create the DTML Method.
  5. 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 .
    6. Managing a DTML Method

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

 

 

<HTML>

<HEAD>

<TITLE><dtml-var document_title></TITLE>

</HEAD>

<BODY BGCOLOR="#FFFFFF">

<P><dtml-var ZAcmeLogo></P>

<H4>Welcome to ZAcme Web, the official web site of ZAcme 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. We use two DTML instructions here:

<dtml-var document_title> :

<dtml-var ZAcmeLogo> :

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

     
  2. The top portion of the properties screen is where existing properties can be edited or deleted.
  3. The bottom portion is where new properties can be added by selecting their type, giving them an id and a value.

    4. 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, 2000 and clicks "Add". The screen refreshes with a new property named expected_date . Note that the date appears in the format 2000/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.

  4. 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

<dtml-var expected_date></P>

Since expected_date is a property of the Folder containing the home page, it can be accessed in a dtml- var tag. In Zope, expected_date can also be accessed in a dtml-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 | Up | Next Section | Contents
Banner.Novgorod.Ru