1. AdvSearch
      1. AdvSearch.AdvSearch
        1. AdvSearch.AdvSearch.tpl
        2. AdvSearch.Advsearch.paging1Tpl
        3. AdvSearch.AdvSearch.paging0Tpl
        4. AdvSearch.AdvSearch.containerTpl
        5. Advsearch.AdvSearch.extractTpl
      2. AdvSearch.AdvSearchHelp
        1. AdvSearch.AdvSearchHelp.helplinkTpl
      3. AdvSearch.AdvSearchForm
        1. Advsearch.AdvSearchForm.tpl
    2. cookieJar
    3. getYoutube
    4. aliasid
    5. AddHeaderfiles
    6. AjaxUpload
    7. amazonSES mailing list
    8. Analytics
    9. Archivist
      1. Archivist.Archivist
        1. Archivist.Archivist.tpl
      2. Archivist.ArchivistGrouper
      3. Archivist.getArchives
        1. Archivist.getArchives.tpl
    10. Articles
      1. Articles.Theming Articles
      2. Articles.Retrieving the next and previous article
      3. Articles.Roadmap
      4. Articles.Retrieving Articles Outside of Articles
      5. Articles.Creating a Blog
    11. Babel
      1. Babel.BabelLinks
      2. Babel.BabelTranslation
    12. BannerX
    13. BannerY
    14. Batcher
      1. Batcher.Roadmap
    15. bdListings
      1. bdListings.bdCategories
      2. bdListings.bdHookNewListing
      3. bdListings.bdListings
      4. bdListings.bdPriceGroups
      5. bdListings.bdRedirect
      6. bdListings.bdTargets
    16. boilerX
      1. bx-head-open
      2. bx-head-append
      3. bx-head-close
      4. bx-container-open
      5. bx-container-close
      6. bx-bottom-open
      7. bx-bottom-close
    17. BreadCrumb
      1. BreadCrumb.containerTpl
      2. BreadCrumb.currentCrumbTpl
      3. BreadCrumb.linkCrumbTpl
      4. BreadCrumb.maxCrumbTpl
      5. BreadCrumb.categoryCrumbTpl
      6. BreadCrumb.homeCrumbTpl
    18. Breadcrumbs
    19. BxrExtra
    20. cachebuster
    21. CamperManagement
      1. CamperManagement.Customizing the Component
      2. CamperManagement.Developing the front-end
        1. CamperManagement.cmCamperDetails Snippet
        2. CamperManagement.cmCampers Snippet
        3. CamperManagement.Placeholders you can use
      3. CamperManagement.Managing your vehicle
      4. CamperManagement.Module home
    22. Church Events Calendar
      1. ChurchEvents.MODX Manager functions
      2. ChurchEventsCalendar Snippet
        1. ChurchEvents.Managing events
      3. ChurchEventsList Snippet
      4. ChurchEventsRss Snippet
    23. Cliche
    24. ClientConfig
    25. CMPGenerator
      1. CMPGenerator.5 minute example
      2. CMPGenerator.Foreign Databases
    26. Collections
    27. ContextRouter
    28. CookieList
    29. CronManager
    30. cssSweet
      1. cssSweet.lighten
      2. cssSweet.modval
      3. cssSweet.prefix
    31. CustomUrls
    32. Databackup
    33. Discuss
      1. Discuss.ChunkMap
      2. Discuss.Contributing
      3. Discuss.Controllers
        1. Discuss.Controllers.board
          1. Discuss.Controllers.board.xml
        2. Discuss.Controllers.home
        3. Discuss.Controllers.login
        4. Discuss.Controllers.logout
        5. Discuss.Controllers.profile
        6. Discuss.Controllers.register
        7. Discuss.Controllers.search
        8. Discuss.Controllers.thread
      4. Discuss.Creating a Discuss Theme
      5. Discuss.Database Model
      6. Discuss.Features
      7. Discuss.Getting Started
      8. Discuss.Installation
        1. Discuss.Installation from Git
      9. Discuss.Roadmap
      10. Configuring Sphinx for Search
    34. DitsNews
    35. Eletters
      1. Eletters.API
      2. Eletters.FormIt
      3. Eletters.Import CSV
      4. Eletters.Templates
    36. EventManager
      1. EventManager.emListEvents
      2. EventManager.emNewReservationHook
    37. eventsCalendar2
      1. eventsCalendar2.eventsCalendar2
      2. eventsCalendar2.Generating events
      3. eventsCalendar2.tplCalendar2
      4. eventsCalendar2.tplCell2
      5. eventsCalendar2.tplEvent2
      6. eventsCalendar2.tplHead2
    38. EventsX
      1. EventsX.Examples
    39. ExerPlan
    40. fastField
    41. FileDownload R
      1. FileDownload R.FileDownload
      2. FileDownload R.FileDownloadLink
      3. FileDownload R.Plugins
    42. FileLister
      1. FileLister.FileLister
        1. FileLister.FileLister.directoryTpl
        2. FileLister.FileLister.fileLinkTpl
        3. FileLister.FileLister.fileTpl
        4. FileLister.FileLister.pathTpl
      2. FileLister.Roadmap
    43. FirstChildRedirect
    44. Flexibility
    45. ForcedPasswdChange
    46. FormIt
      1. FormIt.FormItCountryOptions
      2. FormIt.FormItRetriever
      3. FormIt.FormItStateOptions
      4. FormIt.Hooks
        1. FormIt.Hooks.email
        2. FormIt.Hooks.FormItAutoResponder
        3. FormIt.Hooks.math
        4. FormIt.Hooks.recaptcha
        5. FormIt.Hooks.redirect
        6. FormIt.Hooks.spam
      5. FormIt.Roadmap
      6. FormIt.Tutorials and Examples
        1. FormIt.Examples.Custom Hook
        2. FormIt.Examples.Simple Contact Page
        3. FormIt.Handling Selects, Checkboxes and Radios
        4. FormIt.Using a Blank NoSpam Field
      7. FormIt.Validators
    47. FormIt2db
    48. FormitFastPack
      1. FormitFastPack.Tutorial
      2. FormitFastPack.fieldSetDefaults
      3. FormitFastPack.field
      4. FormitFastPack.fiGenerateReport
    49. FormSave
    50. FoundationX
      1. FoundationX.How to Use FoundationX
    51. FX2themebase
      1. FX2.How to Use FX2
        1. FX2.For Theme Authors
      2. FX2.Included Extras
    52. Gallery
      1. Gallery.Example1
      2. Gallery.Gallery
        1. Gallery.Gallery.containerTpl
        2. Gallery.Gallery.thumbTpl
      3. Gallery.GalleryAlbums
        1. Gallery.GalleryAlbums.rowTpl
        2. Gallery.GalleryAlbums.containerTpl
      4. Gallery.GalleryItem
        1. Gallery.GalleryItem.albumTpl
        2. Gallery.GalleryItem.GalleryItemPagination
        3. Gallery.GalleryItem.tagTpl
        4. Gallery.GalleryItem.tpl
      5. Gallery.Plugins
        1. Gallery.Plugins.Galleriffic
        2. Gallery.Plugins.Slimbox
      6. Gallery.Roadmap
      7. Gallery.Setting Up the GalleryItem TV
      8. Gallery.Setting Up Your Gallery
    53. GatewayManager
    54. gCal
    55. getDate
    56. getFeed
      1. getFeed.Adding a Twitter Feed
    57. getPage
    58. getRelated
    59. getResourceField
    60. getResources
      1. getResources.Examples
        1. getResources.Building a RSS feed
        2. getResources.Category Index Page with Thumbnails
        3. getResources.Google XML Sitemap
    61. getUrlParam
    62. getRTImages
    63. getVimeo
    64. GoogleSiteMap
      1. GoogleSiteMap.GoogleSiteMap
        1. GoogleSiteMap.GoogleSiteMap.containerTpl
        2. GoogleSiteMap.GoogleSiteMap.itemTpl
      2. GoogleSiteMap.Roadmap
    65. GridClassKey
    66. HandyMan
      1. HandyMan.Frequently Asked Questions
      2. HandyMan.Installation
      3. HandyMan.Roadmap
    67. Hits
    68. HitsPage
    69. HybridAuth
      1. HybridAuth.Integrating Facebook
      2. HybridAuth.Integrating Google
      3. HybridAuth.Integrating Twitter
      4. HybridAuth.Integrating VK.com
    70. If
    71. Image+
    72. imageHERE
    73. ImageStyles
    74. ImportX
    75. LexRating
    76. Lingua
    77. Login
      1. Login.ChangePassword
      2. Login.ConfirmRegister
      3. Login.ForgotPassword
      4. Login.Login
      5. Login.Profile
      6. Login.Register
        1. Register.Example Form 1
      7. Login.ResetPassword
      8. Login.Roadmap
      9. Login.Tutorials
        1. Login.Basic Setup
        2. Login.Extended User Profiles
        3. Login.Request Membership
        4. Login.User Profiles
        5. Login.Using Custom Fields
        6. Login.Using Pre and Post Hooks
      10. Login.UpdateProfile
    78. Loginza
      1. Loginza.Loginza
      2. tpl.Loginza.login
      3. tpl.Loginza.logout
      4. tpl.Loginza.profile
    79. mChimpX
    80. MetaX
    81. mhPayPal
      1. mhPayPal.Snippet Usage
        1. mhPayPal.Snippet Usage.Hooks
        2. mhPayPal.Snippet Usage.Templating
    82. MIGX
      1. MIGX.Backend-Usage
      2. MIGX.Data-Entry
      3. MIGX.Frontend-Usage
      4. MIGX.Tutorials
        1. MIGX.Fancybox-images with seperate placeholders in Richtext-Content
        2. MIGX.Simple opening hours table
        3. Using resource-specific mediasource and multifile-uploader with MIGX
        4. MIGX.Varying layout-boxes
          1. MIGX.Varying layout-boxes.Configurator-Version
        5. Creating Selectable and Sortable lists for MIGX
        6. MIGX.sortable resourcelist
        7. Using resource-specific mediasource and multifile-uploader with MIGX
        8. MIGX.Using Grid Inline Editing
    83. MIGXdb
      1. MIGXdb.Configuration
      2. MIGXdb.Tutorials
        1. MIGXdb.Create a basic gallery-management from scratch with MIGXdb
        2. MIGXdb.Create doodles manager with help of MIGXdb
        3. MIGXdb.Manage Child-Resources in a grid-TV with help of MIGXdb
        4. MIGXdb.Manage Events-Resources in a CMP with help of MIGXdb
      3. MigxCalendars
    84. MinifyX
    85. miniShop
      1. miniShop.Screenshots
    86. modActiveDirectory
    87. ModDef
    88. modExtra
    89. modMobile
    90. modSwiftMailer
    91. mxCalendar
      1. mxCalendar.Examples
      2. mxCalendar.Placeholders
    92. mxExtendedMenu
    93. mxFormBuilder
      1. mxFormBuilder.Create Form
      2. mxFormBuilder.Hooks
      3. mxFormBuilder.Field Types
      4. mxFormBuilder.Create Form List in TV
      5. mxFormBuilder.Fields
    94. mxHasTvs
    95. MoneyBird
      1. MoneyBird.Contacts
      2. MoneyBird.Invoices
      3. MoneyBird.NrFormat
    96. ObfuscateEmail-Revo
    97. PackMan
      1. PackMan.Roadmap
    98. PageBreaker
      1. PageBreaker.PageBreaker
      2. tpl.PageBreaker.ajax
      3. tpl.PageBreaker.navigation
    99. Peoples
      1. Peoples.PeopleGroup
        1. Peoples.PeopleGroup.userTpl
      2. Peoples.PeopleGroups
        1. Peoples.PeopleGroups.tpl
      3. Peoples.Peoples
        1. Peoples.Peoples.tpl
      4. Peoples.Roadmap
    100. PHP Tidy (plugin)
    101. phpThumbOf
    102. Polls
      1. Polls.Polls
      2. Polls.PollsLatest
      3. Polls.PollsPrevious
      4. Polls.PollsResult
    103. POI Manager
    104. QuickCrumbs
      1. QuickCrumbs.Example
    105. Quip
      1. Quip.Quip
        1. Quip.Quip.tplComment
        2. Quip.Quip.tplCommentOptions
        3. Quip.Quip.tplComments
        4. Quip.Quip.tplReport
      2. Quip.QuipCount
      3. Quip.QuipLatestComments
      4. Quip.QuipReply
        1. Quip.QuipReply.tplAddComment
        2. Quip.QuipReply.tplLoginToComment
        3. Quip.QuipReply.tplPreview
      5. Quip.QuipRss
      6. Quip.Roadmap
      7. Quip.Upgrading
        1. Quip.Upgrading to 1.0.1
    106. Rampart
      1. Rampart.hook.RampartFormIt
      2. Rampart.hook.RampartQuip
      3. Rampart.preHook.RampartRegister
    107. Redirector
    108. renderResources
    109. ResourceWatcher
    110. RezImgCrop
    111. Rowboat
      1. Rowboat.Rowboat
    112. sekFancyBox
      1. sekFancyBox & Gallery
    113. sekFormTools
      1. sekFormTools.input.autocomplete
      2. sekFormTools.input.combobox
      3. sekFormTools.input.datepicker
      4. sekFormTools.input.helper
      5. sekFormTools.input.textfield
      6. sekFormTools Advanced Examples
    114. sekSiteTools
      1. sekSiteTools.easytabs
      2. sekSiteTools.google.analytics
      3. sekSiteTools.printdiv
    115. sekUserGalleries
      1. sekUserGalleries.album.items.helper
      2. sekUserGalleries.album.items.manage
      3. sekUserGalleries.album.manage
      4. sekUserGalleries.album.view
      5. sekUserGalleries.browse.galleries
      6. sekUserGalleries.directory
      7. sekUserGalleries.image.information
      8. sekUserGalleries.search
      9. sekUserGalleries.users.gallery.manage
      10. sekUserGalleries.users.gallery.view
    116. selfLink
    117. Shopkeeper
    118. siblingNav
    119. SimpleSearch
      1. SimpleSearch.Roadmap
      2. SimpleSearch.SimpleSearch
        1. SimpleSearch.Faceted Search Through PostHooks
        2. SimpleSearch.SimpleSearch.containerTpl
        3. SimpleSearch.SimpleSearch.currentPageTpl
        4. SimpleSearch.SimpleSearch.pageTpl
        5. SimpleSearch.SimpleSearch.tpl
      3. SimpleSearch.SimpleSearchForm
        1. SimpleSearch.SimpleSearchForm.tpl
      4. SimpleSearch.Solr
    120. SiteEditor
    121. sitemapFriend
    122. Slideshow Manager
      1. jgSlideshow Snippet
      2. Slideshow Manager CMP
    123. sLink
    124. SmartOptimizer
    125. SmartTag
    126. StatCache
    127. SocialLogin
    128. SocialSuite
      1. SocialSuite.getFacebookPhotos
      2. SocialSuite.getFacebookProfile
      3. SocialSuite.getFacebookShares
      4. SocialSuite.getGooglePlusShares
      5. SocialSuite.getTwitterProfile
      6. SocialSuite.prettyNumbers
    129. spieFeed
    130. StaticSaver
    131. StoreLocator
    132. SubscribeMe
      1. SubscribeMe.Configuring API Credentials, IPN and going Live
      2. SubscribeMe.Setting up the Payment Flow
        1. SubscribeMe - Listing the Products
        2. SubscribeMe - Setting up the Payment Methods
        3. SubscribeMe - Subscription Confirmation Page
      3. SubscribeMe.User Account Management
    133. SyntaxChecker
    134. Tagger
    135. TaggingAtoZ
    136. tagLister
      1. tagLister.getResourcesTag
      2. tagLister.tagLister
        1. tagLister.tagLister.all
        2. tagLister.tagLister.tpl
      3. tagLister.tolinks
        1. tagLister.tolinks.tpl
    137. TinyMCE
      1. TinyMCE.Spellchecker
      2. TinyMCE.Table controls
      3. TinyMCE.Template
    138. Upload to Users CMP
    139. VersionX
      1. VersionX.Roadmap
    140. virtuNewsletter
    141. VisionCart
      1. VisionCart.Back-end
        1. VisionCart.Category management
        2. VisionCart.Module management
        3. VisionCart.Option management
        4. VisionCart.Order management
        5. VisionCart.Product management
        6. VisionCart.Shop management
      2. VisionCart.Front-end
        1. VisionCart.vcGetCategories
          1. VisionCart.vcGetCategories.tpl
        2. VisionCart.vcGetProducts
          1. VisionCart.vcGetProducts.tpl
        3. VisionCart.vcWayfinder
      3. VisionCart.General
        1. VisionCart.Templating
        2. VisionCart.UserManagement
      4. VisionCart.vcGetProductImages
      5. VisionCart.vcGetProductOptions
    142. Wayfinder
      1. Wayfinder Introductory Examples
    143. xFPC

Wayfinder

Last edited by Susan Ottwell on Aug 22, 2013.
This is a user-contributed Extra. If you find issues or would like more info or help, please contact the author.

Wayfinder is a Snippet by kylej that scans a specified portion of the MODX document tree, finds all documents that satisfy a certain criteria (determined by the Parameters), and outputs a formatted list of those documents. The formatting of the output is template-driven, and can contain any combination of HTML, CSS and JavaScript, yielding an enormous degree of flexibility.

Wayfinder's primary purpose is to generate navigational menus that automatically update to reflect changes made to the document tree, but it can be used for other purposes as well.

Since you can make multiple calls to Wayfinder on a single page, and each call can specify a different section of the document tree, you can have multiple navigational menus or document lists on a single page. For example you may wish to have a main menu at the top of the page, then along the sides have secondary menus for products, services, teams, roles, etc. Each pertaining to a different section of the document tree.

Please note that since the release of Revolution there are two types of Wayfinder snippets available, one for each version. For clarity, this page uses the Evolution syntax when showing examples. Generally speaking the functionality between the two versions are the same, and so are the parameters. Mind that in Revolution, snippets must be called with [[Wayfinder? &...]] instead of [!Wayfinder? &...!].

For Wayfinder discussions on the MODX forums see http://modxcms.com/forums/index.php/board,182.0.html. Further Wayfinder 2.0 documentation can be found at http://www.muddydogpaws.com/development/wayfinder/features.html

In case you want to read everything about Wayfinder, there's a 148 page ebook written by Kongondo to be found on the forum which covers all aspects about Wayfinder. Read about it here.

History

Wayfinder has been totally re-factored from the original DropMenu navigation builder to make it easier to create custom navigation by using Chunks as output templates. By using templates, many of the parameters are no longer needed for flexible output including tables, unordered- or ordered-lists (ULs or OLs), definition lists (DLs) or in any other format you desire.

Version history

Version
Released
MODX version
Notes
0.9 beta 1/2/3
Aug/Sept 2006
0.9.2.1
Initial release
1.0
Oct 23, 2006
0.9.2.1
1.0.1
Nov 07, 2006
0.9.2.1 - 0.9.5
2.0
Feb 27, 2007
0.9.5 +
Current release for Evolution
2.1.1 beta 1
May 21, 2009
2.0.0-beta 1
2.1.1 beta 2
Oct 20, 2009
2.0.0-beta 4
2.1.1 beta 4
Nov 05, 2009
2.0.0-beta 5 +

2.3.1 May 18, 2011 2.0+
2.3.2
Sept 20, 2011
2.0+
2.3.3
Oct 31, 2011
2.0+
Current release for Revolution

Installation

Downloads

Evolution (and before)

MODX version 0.9.5-1.0 includes Wayfinder by default in the installer. To add Wayfinder to an older version of MODX or to upgrade to a newer version of Wayfinder in Evolution:

  1. Download the neccesary files from the link above.
  2. Create a new snippet in your MODX Manager (Elements -> Manage Elements -> Snippets) and name if Wayfinder.
  3. Copy the contents of snippet.wayfinder.tpl.php to the snippet contents.
  4. Create a new folder in your file system under /assets/snippets/ and call it wayfinder.
  5. Copy the file wayfinder.inc.php to the new folder.

Revolution

In MODX Revolution, Wayfinder can be downloaded via Package Management. Simply load Package Management, click "Download Extras", go to Navigation -> Wayfinder and download the latest version. Then right click in your Packages grid, and click Install. After it installs, you're finished and good to go.

Getting started

The minimum Wayfinder snippet call:

[[Wayfinder? &startId=`0`&level=`1`]]

will output the HTML for a multi-level, unordered list of the entire document tree (with certain exceptions), where each list item is a link to a corresponding document in the MODX document tree.

See Wayfinder Introductory Examples for some thorough examples comparing Wayfinder snippet calls to HTML output.

Parameters

General Parameters

Parameter Description
Default
&startId
The starting point (document ID) for the menu to list documents from. Specify 0 to start from the site root.
current docId
&displayStart
Show the document as referenced by &startId in the menu.
0
&level
Depth (number of levels) to build the menu from. '0' goes through all levels.
0
&limit
The limit parameter causes Wayfinder to only process the number of items specified per level.
0
&ignoreHidden
Ignore the "Show in menu" checkbox for documents, and include them in the menu anyway.
0
&ph
Name of a placeholder to set with the output results, instead of directly returning the output.
0
&debug
Set to '1' to enable debug mode for extra troubleshooting.
0
&hideSubMenus
Set to '1' to only output the active submenu.
0
&removeNewLines
Set to '1' to remove newline characters from the output.
0
&textOfLinks
The field to get the actual link text from. Possible values: menutitle, id, pagetitle, description, parent, alias, longtitle, introtext menutitle
&titleOfLinks
The field to get the link title from. Possible values: menutitle, id, pagetitle, description, parent, alias, longtitle, introtext pagetitle
&rowIdPrefix
If set, this parameter creates a unique ID for each item. The value will be rowIdPrefix + docId.
0
&useWeblinkUrl
When set to 1, the link specified in a weblink document will be output to the placeholder [ wf.link] instead of the link to the weblink.
1
&includeDocs Comma separated list of document IDs to be included in the menu.
&excludeDocs
Comma seperated list of document IDs to be excluded from the menu.
0
&cacheResults
caches queries for faster loading ( added in 2.2.0-rc1)
&cacheTime The number of seconds to store the cached menu, if cacheResults is 1. Set to 0 to store indefinitely until cache is manually cleared. 3600
&contexts
Contexts to use for building the menu. Defaults to the current context. ( added in 2.2.0-rc1)
&startIdContext
( added in 2.2.0-rc1)
&config external php file to configure Wayfinder ( see core/components/wayfinder/configs for examples)
&scheme
format for how URLs are generated. Possible values are (based on makeURL API call):
  • -1 : (default value) URL is relative to site_url
  • 0 : see http
  • 1 : see https
  • full : URL is absolute, prepended with site_url from config
  • abs : URL is absolute, prepended with base_url from config
  • http : URL is absolute, forced to http scheme
  • https : URL is absolute, forced to https scheme (added in 2.3.1-pl)
-1
&sortBy Which field to sort by e.g. 'published'
&sortOrder The sorting order, 'ASC' or 'DESC'
&where
JSON style filtering option. For example when trying to hide blog or news from the Articles addon: &where=`[{"class_key:!=": "Article"}]`
&hereId Define the current ID to use for the snippet. Use a value of [[*id]] if the template specified by hereTpl and activeRowParentTpl is not applied correctly to the menu item. See here for more information. iterated ID
&hereTpl The hereTpl template is used when the current item is displayed in the menu.

Template Parameters

These parameters specify the chunks that contain the templates that will drive the generation of Wayfinder's output.

With the current version of WayFinder in Revolution, you can access your own custom TVs by using a placeholder without the 'wf.' prefix, e.g. [[+my_TV]]

As of this writing, only the raw TV value will be returned: it will not be formatted. E.g. if your TV is an image, normal use of the TV inside your template would return the full image tag, but inside of a WayFinder tpl, only the path to the image will be returned.

If you want MODX 2.x to process a TV (e.g. an image TV with a base path/url as an input option (since MODX 2.1.x) or with an @inherit value) you might do that by calling a snippet within the wayfinder row template (&rowTpl). Let's say, your image TV is named icon. Normally you would use some code thing like this:

... <img src="[[+icon]]" /> ...

But it will not get you the fully processes TV. Just change your code to this:

... <img src="[[processTV? &myId=`[[+id]]` &myTV=`icon` ]]" /> ...

Within the snippet processTV you place this php-code:

<?php
$doc = $modx->getObject('modResource', $myId);
return $doc->getTVValue($myTV);

As a result the full processed image TV is returned.

&outerTpl

Name of the chunk containing the template for the outer most container; if not included, a string including "

    [[+wf.wrapper]]

" is assumed

Available placeholders are:

  • wf.classes - outputs relevant classes (including class=" ")
  • wf.classnames - outputs relevant classes (without class=" ")
  • wf.wrapper - outputs inner (row) contents. This placeholder is required.

Please note that you will need to wrap the placeholders with the relevant tags.

Evolution: [+wf._____+]
Revolution: [[+wf._____]]

Example of an &outerTpl chunk (Evo):

<ul id="topnav"[+wf.classes+]>[+wf.wrapper+]</ul>

Revo:

<ul id="topnav"[[+wf.classes]]>[[+wf.wrapper]]</ul>

The following table shows other parameters to change your output, that use the same placeholders as the &outerTpl parameter.

Parameter Description
&innerTpl
Name of the chunk containing the template for any subfolders listed in the menu.

&rowTpl

Name of the chunk containing the template for the regular row items.
Available placeholders are:

  • wf.classes - outputs relevant classes (including class=" ")
  • wf.classnames - outputs relevant classes (without class=" ")
  • wf.link - the href value for your link
  • wf.title - the title text for the link, from the field as specified in the &titleOfLinks parameter
  • wf.linktext - the text for the actual link, from the field as specified in the &textOfLinks parameter
  • wf.wrapper - outputs inner contents such as submenus
  • wf.id - outputs a unique ID attribute. You will need to specify the &rowIdPrefix parameter in order for this placeholder to receive a value. The value is your prefix + the docId.
  • wf.attributes - outputs the link attributes of the current item
  • wf.docid - the document identifier for the current item
  • wf.description - the current item's description
  • wf.level - the current depth of item (added in v2.3.3)

Please note that you will need to wrap the placeholders with the relevant tags.

Evolution: [+wf._____+]
Revolution: [[+wf._____]]

Since version 2.3.0 you can use placeholders for all fields of a Resource, such as [[+introtext]], [[+menutitle]], [[+published]], etc.
Since version 2.3.2 placeholder [[+protected]] is added that is 1 if Resource is protected by a Resource Group.

Examples of a &rowTpl (or related) chunk:

<li[+wf.id+][+wf.classes+]><a href="[+wf.link+]" title="[+wf.title+]" [+wf.attributes+]>[+wf.linktext+]</a>[+wf.wrapper+]</li>
<li><a href="[+wf.link+]">[+wf.linktext+]</a> - [+wf.description+]  [+wf.wrapper+]</li>

Revo:

<li[[+wf.id]][[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>
<li><a href="[[+wf.link]]">[[+wf.linktext]]</a> - [[+wf.description]]  [[+wf.wrapper]]</li>

The following table shows other parameters to change your output, that use the same placeholders as the &rowTpl parameter.

Parameter Description
&startItemTpl
Name of the chunk containing the template for the start item, if enabled via the &displayStart parameter. Note: the default template shows the start item but does not link it. If you do not need a link, a class can be applied to the default template using the parameter &firstClass=`className`.
&parentRowHereTpl
Name of the chunk containing the template for the current document if it is a container and has children. Remember the [ wf.wrapper] placeholder to output the children documents.
&parentRowTpl
Name of the chunk containing the template for any document that is a container and has children. Remember the [ wf.wrapper] placeholder to output the children documents.
&hereTpl
Name of the chunk containing the template for the current document.
&innerTpl Name of the chunk containing the template for each submenu. If no innerTpl is specified the outerTpl is used in its place.
&innerRowTpl
Name of the chunk containing the template for the row items in a subfolder.
&innerHereTpl
Name of the chunk containing the template for the current document if it is in a subfolder.
&activeParentRowTpl
Name of the chunk containing the template for items that are containers, have children and are currently active in the tree.
&categoryFoldersTpl
Name of the chunk containing the template for category folders. Category folders are determined by setting the template to blank or by setting the link attributes field to rel="category".
&parentRow and &activeParentRow require that the parent resource's "Container" setting is checked.

Example of how &startItemTpl could be used:

<h2 class="menustart"><a href="[+wf.link+]">[+wf.linktext+]</a></h2>[+wf.wrapper+]

CSS Class Name Parameters

You can use CSS to control the appearance (and in some cases the behavior) of various portions of the generated output. But it's up to you to tell Wayfinder the CSS classnames you want to use, and which portions of the generated output you want them associated with.

Parameter Description
Default
&firstClass
CSS class for the first item at a given menu level.
&lastClass
CSS class for the last item at a given menu level.
last
&hereClass
CSS class for the items showing where you are, all the way up the chain.
active
&selfClass
CSS class for the current item.
&parentClass
CSS class for menu items that are a container and have children.
parent
&rowClass
CSS class denoting each output row
&levelClass
CSS class denoting every output row level. The level number will be added to the specified class (level1, level2, level3 etc if you specified 'level').
&outerClass
CSS class for the outer template.
&innerClass
CSS class for the inner template
&webLinkClass
CSS class for weblink items.

Example
Simply specify the class parameters in the snippet to add the classnames to the output.

For example, adding &levelClass=`level` will result in

<li class="level2">

Code-Embedding Parameters

If the generated output of a Wayfinder call requires the presence of certain CSS or JavaScript, you can store the CSS in one chunk and the JavaScript in another, then use these parameters to have Wayfinder copy one or both chunks into the HEAD section of the webpage in which the Wayfinder call is made.

Parameter
Description
&cssTpl
Name of a chunk containing the CSS you would like added to the page when the Wayfinder call is present.
&jsTpl
Name of a chunk containing the JavaScript you would like added to the page when the Wayfinder call is present.

Default values in Revolution

Parameter Default value
&outerTpl
<ul[[+wf.classes]]>[[+wf.wrapper]]</ul>
        
&rowTpl
<li[[+wf.id]][[+wf.classes]]><a href="[[+wf.link]]" title="[[+wf.title]]" [[+wf.attributes]]>[[+wf.linktext]]</a>[[+wf.wrapper]]</li>
        
&startItemTpl
<h2[[+wf.id]][[+wf.classes]]>[[+wf.linktext]]</h2>[[+wf.wrapper]]
        

Examples

See Wayfinder Introductory Examples for some thorough examples comparing Wayfinder snippet calls to HTML output.

The Minimum Wayfinder Call

The snippet call:

[[Wayfinder? &startId=`0`]]

will output the HTML for a multi-level, unordered list of the entire document tree (with certain exceptions), where each list item is a link to a corresponding document in the ModX document tree.

Replacing DropMenu with Wayfinder

Some older templates may use the deprecated DropMenu snippet instead of WayFinder. The DropMenu snippet is not included in MODX 0.9.5 or above.
These templates can often be easily updated to use Wayfinder by replacing the call to DropMenu as follows:

Example DropMenu call in template file:

[[DropMenu?startDoc=`0`&levelLimit=`1` ]]

Can be replaced by

[[Wayfinder? &startId=`0`&level=`1`]]

Accordion menus with Wayfinder

  • [Accordion menu with Wayfinder|Accordion menu with
    Wayfinder]
  • [Accordion menu with Wayfinder using JQuery|Accordion menu with
    Wayfinder using JQuery]