Part 2

NEWS & TIPS

  • Site Access Keys
  • Top: Alt+t
    Previous: Alt+,
    Next: Alt+.
    Up: Alt+;
    (Note: use Ctrl on the Mac)

Dynamic Navigation Menus

Now that you have the existing demo site integrated, you will want to take advantage of additional system functionality – dynamic navigation menus. The first task is to set up our new blocks. You want to create a context navigation index block and breadcrumbs index block.

A. Context Navigation Index Block

To create a context navigation block:

  1. Browse to your blocks/index folder. For the demo, we don’t have one so we will create /web/blocks/index.
  2. In the index folder, click on New -> Default -> Block.
  3. For Block Type, choose Index Block and click Submit.
  4. You will be in the Content pane. For the Index Folder, choose the top-level folder of the site. We will choose web. To do this, click the browse folder icon, select the appropriate folder, and click the Confirm button in the browse folder window. If this field is left empty, the block will index the contents of the page’s current folder.
  5. For the Depth of Index, type 10. This is how many folders deep you want the index. If the index folder is left blank, or a negative value is used here, the system returns an index block showing that many folders above the requesting page.
  1. For Max Rendered Assets, type 0. This option is available if you need to limit the number of assets rendered, but since you don’t want to limit it, you will type 0 for an unlimited number of assets rendered.
  2. For Index Assets Types, check the box for Pages.
  3. For Indexed Asset Content, check the box for Regular Content (name, path) and the box for User Metadata (title, summary, etc).
  4. Switch over to the System pane and for the System Name field, type in context-navigation.
  5. Now click Submit to save the new index block.

On the View block screen, you’ll see the XML representation of the designated folder and sub-folders including their metadata.

B. Bread Crumbs Index Block

Now that we have the context navigation index block, we need to make the breadcrumbs index block.  This block will be similar in many respects to the block we just created, so we’ll just make a copy of the context navigation block and edit it.

To copy a block and create a bread crumbs index block:

breadcrumbs index block:

  1. Click the Copy tab of the index block just created.
  2. For the System Name field, type in breadcrumbs.
  3. Click Submit to make the copy.
  4. Now click the Edit tab on the breadcrumbs index.
  5. Select the radio button that reads Start at current page and include its folder hierarchy (boxes and radio buttons that are already selected, should remain selected). This is done so that a small XML document is returned for the index block.
  6. Now click Submit to save the updated index block.

Notice that on this view screen, the XML document is not shown. The reason it isn’t shown is because the XML document changes for every page depending on where the page exists in the system. Now that you have your index blocks created, the second task is to enhance the template for more regions.

C. Add Regions to a Template

To add regions to a template:

  1. First go to the existing template. You can do this by browsing to the template or by clicking on an existing page that uses the template. To reach the template from a page that uses it, click on the page, click on the Configurations button, and then click on the link for the desired template. We will click on /web/example and then use the Configurations pane to go to /web/templates/standard.
  2. Once you are at the template, click the Edit tab.
  3. For your integration, you’re going to add two new regions – context navigation and breadcrumbs. To do this, find the existing comment tag that denotes the default region (<!-- #BeginEditable "DEFAULT" -->) and put the following tags before it:
    <system-region name="CONTEXT-NAVIGATION"/>
    <system-region name="BREAD-CRUMBS"/>
  4. With the template content updated, click the Submit button to save the changes. By creating the two new regions in the template, you now have new areas to insert blocks and stylesheets to plug-in other content.
  5. Click the Edit tab again, and go to the Regions pane so that you can assign your blocks and stylesheets to the newly created regions. The editing interface now has the two new regions and allows for assignment of a block and/or stylesheet.
  6. Click the browse icon for the BREADCRUMBS region Block, and browse to the new breadcrumbs index block located at /web/blocks/index/breadcrumbs. Click the browse icon for the corresponding Stylesheet. There is a standard breadcrumbs stylesheet distributed in the software with the path /common/stylesheets/index/breadcrumbs.
  7. Now you need to do the same thing for the CONTEXT-NAVIGATION region Block and Stylesheet. Click the browse icon for the Block, and select the new block /web/blocks/index/context navigation. Now for the stylesheet, use the stylesheet distributed in the software with the path /common/stylesheets/index/horiz nav - current folder. Please note that index blocks and stylesheets can be applied to the DEFAULT region, thereby overriding the word processor or Data Definition content. A common example is putting in a dynamic site map in the main default region of a page.
  8. With your blocks and stylesheets assigned, click the Submit button to save the template changes. By applying the block and stylesheets to the two newly created regions, the content from those two regions will be applied to all of the pages associated with this template.

Now browse to the web/about page in the left asset tree. When the page loads, you will see the context navigation menu and the breadcrumbs. To test it, Edit the page and change the Display Name Metadata field. When the page reloads, you’ll see the new metadata value in the breadcrumbs on the page. You might not see the folder name values in the breadcrumbs hierarchy. To fix this, browse to the parent web and Edit the folder’s Metadata Display Name value (e.g. “Traders Value”). Another thing to try is swapping out different navigation menus from the /common/stylesheets/index/ folder in the system in order to see how XML index block content is filtered and rendered differently. A good stylesheet to test is /common/stylesheets/index/site map - unordered list.

D. XML/XSL Development

It is extremely valuable to download and install an XML/XSL IDE locally on your development machine in order to write custom navigation menus and transform system data into the appropriate output. Some good XML/XSL tools include: 

The XML is supplied from the system via a data definition or index block. This XML is then marked up by the XSL. It is recommended that the development of the XSL take place on your local development machine and once perfected, uploaded into the system. For example, with the Cooktop product you will have the XML in one tab and the XSL in another tab. As you make changes to the XSL, you can run the transformation and see the resulting output in the HTML tab:

Three good online XSL tutorials include:

Videos

Last modified on Wed, 13 Jun 2007 10:44:21 -0400

Topic Feedback Form

Content Rating:
Email:
Feedback:

Top / Previous / Next / Up / Table of Contents