Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
Rendering manual menus with VHS
<div xmlns:v=""
<!-- By setting the "as" argument, we create a new variable accessible inside tag content -->
< as="myMenuVariable">
<ol class="mySpecialMenu">
<f:for each="{myMenuVariable}" as="menuPage">
<!-- A few key properties are added on {menuPage} for user friendliness -->
<!-- These are: "linktext", "link", "active", "current", "hasSubPages" -->
<f:if condition="{menuPage.current}">
<!-- Special rendering of "current" page title as raw text -->
<!-- And with a conditional next level menu using auto rendering: -->
<f:if condition="{menuPage.hasSubPages}">
< pageUid="{menuPage.uid}" />
<!-- There are two common methods of rendering the page links: -->
<!-- Using which will re-create the "link" HREF -->
< pageUid="{menuPage.uid}" class="{menuPage.class}">{menuPage.linktext}</>
<!-- Or with manual link tags using pre-built "link" HREF -->
<a href="{}" class="{menuPage.class}">{menuPage.linktext}</a>
<!-- Note that the {myMenuVariable} no longer exists since the variables are cleaned after tag finishes -->

This comment has been minimized.

Copy link

@abteilung abteilung commented Dec 4, 2014

Just noticed an error in the closing </v:page>. Should be </>.
Also, I would comment out one of the two ways to render the page links. The double rendering of page links was confusing to me at first.


This comment has been minimized.

Copy link

@Outdoorsman Outdoorsman commented Apr 17, 2018

Just a comment for more recent versions of VHS

  1. is deprecated so use v:menu
  2. hasSubPage no longer works like it used so here an alternative...

In place of

<f:if condition="{menuPage.hasSubPages}">

Instead now use...

<v:variable.set name="hasSub" value="{ 'TRUE', else: 'FALSE', pageUid: '{item.uid}', includeHidden: 0, showHiddenInMenu: 0)}" />
                    <f:if condition="{hasSub} =='TRUE' ">

(I found this info from a comment by Rob De Vries in the #fluidtypo3 channel in TYPO3's Slack)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment