You are not logged in Log in Join
You are here: Home » Download Zope Products » Content Management Framework » CMF Documentation » Administering CMF Sites » Annotated Dogbowl Skins

Log in
Name

Password

 

Annotated Dogbowl Skins

This document explains the (very light) customization of the stock CMF skins used in the dogbowl.

Note

This summary is of the methods as they exist on 11 July 2001; the customizations may change somewhat over time.

Python Script: breadcrumbs

Derived from Chris Withers' example, this method builds the list of folders "above" the current page.

Source:

      from string import split,join
      # Might need a slight url quoting shuffle if
      # getRelativeUrl starts url-quoting :-S
      from Products.PythonScripts.standard import url_quote
      portal_url = context.portal_url

      path = portal_url.getRelativeUrl(context)
      if not path:
          return ''

      Type = getattr(context,'Type','Object')
      if callable(Type):
          Type=Type()

      # Also assuming folderish content, fair enuff for now :-)
      pattern='<a href="%s/folder_contents">%s</a>'
      url = portal_url()
      steps = split(path,'/')
      breadcrumbs = []
      last = steps.pop()

      for step in steps:
          url = '%s/%s' % (url,url_quote(step))

          breadcrumbs.append(pattern % (url,step))
      breadcrumbs.append(last)

      return '%s at %s' % (Type,join(breadcrumbs,'/'))

DTML Method: index_html

Displays a "stock" view of a folder's contents, without the "editing" knobs of folder_contents.

Source:

      <dtml-var standard_html_header>

      <dtml-if "localattr( 'local_html' )">
      <!-- localattr -->
      <dtml-var local_html>
      <dtml-else>

      <h2><dtml-var title_or_id></h2>

      <dtml-if Description>
      <blockquote><dtml-var Description fmt="structured-text"></blockquote>
      </dtml-if Description>

      <dtml-let folder_url=absolute_url>

      <dtml-in expr="objectValues( [ 'Document', 'News Item', 'Portal Image', 'Portal File' ] )"
              skip_unauthorized>
      <dtml-if sequence-start>
      <h3> Documents, Images, and Files </h3>

      <ul>
      </dtml-if>
      <li> 
        <a href="&dtml-absolute_url;"><img align="middle" src="&dtml-portal_url;/&dtml-getIcon;" alt="&dtml-Type;" title="&dtml-Type;" border="0"></a>
        <a href="&dtml-absolute_url;"> <dtml-var Title> </a>
      <dtml-if name="Description">
        <blockquote><dtml-var Description fmt="structured-text"></blockquote>
      </dtml-if>
      </li>
      <dtml-if sequence-end>
      </ul>
      </dtml-if>
      </dtml-in>

      <dtml-in expr="objectValues( [ 'Link','Favorite' ] )" skip_unauthorized>
      <dtml-if sequence-start>
      <h3> Links </h3>

      <ul>
      </dtml-if>
      <li> 
        <a href="&dtml-absolute_url;"><img align="middle" src="&dtml-portal_url;/&dtml-getIcon;" alt="&dtml-Type;" title="&dtml-Type;" border="0"></a>
        <a href="&dtml-getRemoteUrl;"> &dtml-Title; </a>
        <dtml-if name="Description">
        <blockquote><dtml-var Description fmt="structured-text"></blockquote>
        </dtml-if>
      </li>
      <dtml-if sequence-end>
      </ul>
      </dtml-if>
      </dtml-in>

      <dtml-in expr="objectValues( [ 'Folder', 'Portal Folder' ] )" skip_unauthorized>
      <dtml-if sequence-start>
      <h3> Folders </h3>

      <ul>
      </dtml-if>
      <li>
        <a href="&dtml-absolute_url;/"><img align="middle" src="&dtml-portal_url;/&dtml-getIcon;" alt="&dtml-Type;" title="&dtml-Type;" border="0"></a>
        <a href="&dtml-absolute_url;/"> <dtml-var Title> </a>
        <dtml-if name="Description">
        <blockquote><dtml-var Description fmt="structured-text"></blockquote>
        </dtml-if>
      </li>
      <dtml-if sequence-end>
      </ul>
      </dtml-if>
      </dtml-in>

      </dtml-let>

      </dtml-if>

      <dtml-var standard_html_footer>

External Method: localattr

Determine whether the current folder has it's own "local" version of a name.

Source:

      def localattr( self, name ):
          """
              Does self have 'name' w/o acquisition?
          """
          return hasattr( self.aq_base, name )

DTML Method: login_form

Adds "redirect-after-login" semantics.

Source:

      <dtml-var standard_html_header>

      <h1 class="DesktopTitle">
      Log in
      </h1>

      <form action="&dtml.url-logged_in;" method="post">

      <!-- ****** Enable the automatic redirect ***** -->
      <dtml-if name="came_from">
      <input type="hidden" name="came_from" value="&dtml-came_from;">
      </dtml-if>
      <!-- ****** Enable the automatic redirect ***** -->

      <table class="FormLayout">
      <tr>
      <td align="left" valign="top">
      <strong>Name</strong>
      </td>
      <td align="left" valign="top">
      <input type="TEXT" name="__ac_name" size="20"
      value="<dtml-var "REQUEST.get('__ac_name', '')">">
      </td>
      </tr>
      <tr>
      <td align="left" valign="top">
      <strong>Password</strong>
      </td>
      <td align="left" valign="top">
      <input type="PASSWORD" name="__ac_password" size="20">
      </td>
      </tr>

      <tr valign="top" align="left">
      <td></td>
      <td><input type="checkbox" name="__ac_persistent" value="1" checked>
      Remember my name.
      </td></tr>

      <tr>
      <td align="left" valign="top">
      </td>
      <td align="left" valign="top">
      <input type="submit" name="submit" value=" Login ">
      </td>
      </tr>

      </table>
      </form>

      <p><a href="&dtml.url-mail_password_form;">I forgot my password!</a></p>

      <p>
      Having trouble logging in? Make sure to enable cookies in your web browser.
      </p>

      <p>Don't forget to logout or exit your browser when you're done.
      </p>

      <p>
      Setting the 'Remember my name' option will set a cookie with your username,
      so that when you next log in, your user name will already be filled in for you.
      </p>

      <dtml-var standard_html_footer>

DTML Method: news_box

Use created rather than Date as sort key.

Source:

      <table class="NewsItems" cellspacing="0" cellpadding="0" border="0" width="100%">
        <tr>
        <td class="NewsBorder" width="1" rowspan="15" bgcolor="#6699CC">
          <img src="Images/spacer.gif" alt=" "
              width="1" height="2" border="0">
        </td>
        <td valign="top" class="NewsTitle" width="100%">
          <b>News</b>
        </td>
        </tr>

        <dtml-in "portal_catalog.searchResults( meta_type='News Item'
                                              , sort_on='created'
                                              , sort_order='reverse'
                                              , review_state='published'
                                              )" size="10">
        <tr class="NewsItemRow">
        <td valign="top">
          <a href="<dtml-var "getURL()"
          >"> &dtml-Title; </a><br>
          <dtml-var Date>
        </td>
        </tr>
        <dtml-else>
        <tr class="NewsItemRow">
        <td valign="top">
          No news is no news.
        </td>
        </tr>
        </dtml-in>

        <tr class="NewsItemRow">
        <td>
          <a href="&dtml.url-recent_news;">More...</a>
        </td>
        </tr>

      </table>

DTML Method: recent_news

Further CSS'ify layout.

Source:

      <dtml-var standard_html_header>

      <dtml-let newsitems="portal_catalog.searchResults(meta_type='News Item',
        sort_on='Date', sort_order='reverse', review_state='published')">

      <dtml-in newsitems size="10" start="batch_start" previous>
      <p style="Desktop">
      <a href="&dtml-URL;&dtml-sequence-query;batch_start=&dtml-previous-sequence-start-number;">
      Next &dtml-previous-sequence-size; more recent articles
      </a>
      </p>
      </dtml-in>

      <dtml-in newsitems size="10" start="batch_start">
      <dtml-if sequence-start>
        <table cellspacing="0" border="0" width="90%">
      </dtml-if>
      <tr>
        <td class="NewsListing" align="left" valign="top">
        <p class="NewsHeadline"><a href="<dtml-var "getURL()">">
          &dtml-title;
        </a><br><span class="NewsByLine">By &dtml-Creator;</span>
        </p>
        </td>
        <td class="NewsListing" align="right" valign="top">
        <p class="NewsDateline">
          <dtml-var Date>
        </p>
        </td>
      </tr>
      <tr>
        <td colspan="2">
        <p class="NewsLeadin">
          &dtml-Description;
        </p>
        <p>&nbsp;</p>
        </td>
      </tr>
      <dtml-if sequence-end>
        </table>
      </dtml-if>
      <dtml-else>
      <p class="Desktop">
        No news is good news!
      </p>
      </dtml-in>

      <dtml-in newsitems size="10" start="batch_start" next>
      <p class="Desktop">
      <a href="&dtml-URL;&dtml-sequence-query;batch_start=&dtml-next-sequence-start-number;">
      Next &dtml-next-sequence-size; older articles
      </a>
      </p>
      </dtml-in>

      </dtml-let>

      <dtml-var standard_html_footer>

DTML Method: search

Fossil? Uses icon instead of getIcon.

Source:

      <dtml-var standard_html_header>

      <div class="Desktop">

      <h1> Search Results </h1>

      <dtml-let results=portal_catalog>

      <p>Found <dtml-var expr="_.len(results)" thousands_commas> 
      items<dtml-if name="SearchableText"> matching "&dtml-SearchableText;"</dtml-if>.</p>

      <dtml-in results size="25" start="batch_start">
      <dtml-let objURL="getURL() + '/view'"
                objIcon="'%s/%s' % ( portal_url(), icon )"
      >

      <dtml-if sequence-start>
      <table class="SearchResults">
      <tr>
        <td width="16"><br></td>
        <th> Title
        </th>
        <th> Type
        </th>
        <th> Date
        </th>
        </tr>
      </dtml-if>

      <tr>
        <td>
        <a href="&dtml-objURL;"><img src="&dtml-objIcon;" border="0"
          alt="[&dtml.missing-Type;]"
          title="[&dtml.missing-Type;]"></a>
        </td>
        <td>
        <a href="&dtml-objURL;"><dtml-if name="Title"><dtml-var name="Title" size="75" html_quote><dtml-else>(No title)</dtml-if></a>
        </td>
        <td>
          &dtml.missing-Type;
        </td>
        <td>
        &dtml-Date;
        </td>
      </tr>
      <tr>
        <td>&nbsp;</td>
        <td colspan="3"><em>
        <dtml-if name="Description"><dtml-var name="Description"
        missing="(No description)" size="100" html_quote>
        <dtml-else>(No description)</dtml-if></em></td>
      </tr>
      <dtml-if sequence-end>
        </table>
      </dtml-if>
      </dtml-let>
      <dtml-else>
      <p> There are no items matching your specified criteria.  </p>
      </dtml-in>

      <dtml-in results size="25" start="batch_start" next>
      <dtml-let url=URL
                sqry=sequence-query
                next=next-sequence-start-number
                nextSize=next-sequence-size
                nextURL="'%s%sbatch_start=%s' % (url,sqry,next)"
      >
        <p> <a href="&dtml-nextURL;"> Next &dtml-nextSize; items </a> </p>
      </dtml-let>
      </dtml-in>

      </dtml-let>

      </div>

      <dtml-var standard_html_footer>

DTML Method: standard_html_header

Add breadcrumbs.

Source:

      <dtml-if "_.hasattr(this(),'isEffective') and not isEffective( ZopeTime() )">
      <dtml-unless "portal_membership.checkPermission('Request review',this())
                or portal_membership.checkPermission('Review portal content',this())">
      <dtml-var "RESPONSE.unauthorized()">
      </dtml-unless>
      </dtml-if>
      <html>
      <head>  
        <title><dtml-with portal_properties>&dtml-title;</dtml-with
        ><dtml-if name="Title">: &dtml-Title;</dtml-if></title>
        <dtml-var css_inline_or_link>
        <dtml-if relative_to_content>
        <base href="&dtml-absolute_url;" />
        </dtml-if>
      </head>
      <body>
      <dtml-var standard_top_bar>

      <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
        <!-- Vertical whitespace -->
        <td colspan="4"><br /></td>
        </tr>

        <tr valign="top">
        <td class="SideBar" width="15%" align="left" valign="top">
          <dtml-comment>  Menu is now in top bar.
          <dtml-var menu> <br />
          </dtml-comment>
          <dtml-var actions_box>
        </td>

        <!-- Horizontal whitespace -->
        <td width="1%">&nbsp;</td>

        <td class="Desktop" colspan="2" width="84%" valign="top">

        <dtml-if "not portal_membership.isAnonymousUser() and
                  not _.hasattr(portal_membership.getAuthenticatedMember(),
                  'getMemberId')">
        <div class="AuthWarning">
          <table>
          <tr class="Host">
            <td> Warning! </td>
          <tr>
            <td> You are presently logged in as a user from outside
                this portal.  Many parts of the portal will not work!
                You may have to shut down and relaunch your browser to
                log out, depending on how you originally logged in.
            </td>
          </tr>
          </table>
        </div>
        </dtml-if>

        <dtml-if portal_status_message>
          <p class="DesktopStatusBar">&dtml-portal_status_message;</p>
        </dtml-if>

        <dtml-if localHeader>
          <dtml-var localHeader>
        </dtml-if>

        <dtml-var breadcrumbs>

DTML Method: standard_top_bar

Different top-level links, etc.

Source:

      <!-- Top bar -->
      <table width="100%" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td colspan="3" witdth="100%">

        <!-- hack around netscape 4.x to ensure top table is solid black -->

        <table class="Masthead" cellspacing="0" cellpadding="0" border="0" width="100%">

          <tr class="Masthead">

          <td class="PortalLogo" align="left" valign="top" width="1%">
            <a href="&dtml-portal_url;"><img src="Images/logo.png" alt="Zope Logo" border="0"
            ></a>
          </td>

          <td class="PortalTitle" width="69%" align="left" valign="center">
            <h1><dtml-with portal_properties>&dtml-title;</dtml-with
            ><dtml-if name="Title">: &dtml-Title;</dtml-if></h1>
          </td>

          <td align="right" width="30%" wrap="no">
            <form action="&dtml-portal_url;/search">
            <input name="SearchableText" size="16">
            <input border="0" type="image" name="go" src="Images/go.gif"> &nbsp;
            </form>
          </td>
          </tr>

          <tr class="NavBar">
          <td align="right" valign="bottom" colspan="3">
            <a href="&dtml-URL;?portal_skin=Printable" target="_new">printable page</a>&nbsp; | &nbsp;
            <a href="&dtml-portal_url;">home</a>&nbsp; | &nbsp;
            <a href="&dtml-portal_url;/calendar/calendar">calendar</a>&nbsp; | &nbsp;
            <dtml-let member="portal_membership.getAuthenticatedMember()"
                      listMembers="portal_membership.checkPermission('List portal members', member)">
            <dtml-if listMembers>
            <a href="&dtml-portal_url;/roster">members</a>&nbsp; | &nbsp;
            </dtml-if>
            </dtml-let>
            <a href="&dtml-portal_url;/recent_news">news</a>&nbsp; | &nbsp;
            <a href="&dtml-portal_url;/doc">docs</a>&nbsp; | &nbsp;
            <a href="&dtml-portal_url;/search_form">search</a>
          </td>
          </tr>

        </table>

        </td>
      </tr>
      </table>