ImCMS
latest
  • Overview of ImCMS
  • Setup
  • Tutorial
  • Design
    • Templates
    • Tag Engine
      • Text Tag
      • Menu Tag
      • Loop Tag
      • Image Tag
      • Login Tag
      • Register Tag
      • Pager Tag
      • Search Tag
  • API-Documentation
  • Content Management
  • Advanced Configuration
  • Image Archive
  • BankId
ImCMS
  • Docs »
  • Design »
  • Tag Engine »
  • Menu Tag
  • Edit on GitHub

Menu Tag¶

In this article:
  • Introduction
  • Use in template

Introduction¶

Well-known, an integral part of the page is menu. It navigate users overall web-site, and describe what kind of content was presented on. Since ImCMS based on document-presented pages each menu item can be present as specific document link

Use in template¶

There are several important part configure menu fully:

  • HTML structure such as ul-li list or div-div list
  • Information about menu-nesting

Default 2-level structured menu shows below:

<imcms:menu no='1' docId="1001">
    <ul>
        <imcms:menuloop>
            <imcms:menuitem>
                <li>
                    <imcms:menuitemlink>
                        ${menuitem.document.headline}
                    </imcms:menuitemlink>
                    <!-- sub menu definition -->
                    <imcms:menuloop>
                        <imcms:menuitem>
                            <div>
                                <imcms:menuitemlink>
                                    ${menuitem.document.headline}
                                </imcms:menuitemlink>
                            </div>
                        </imcms:menuitem>
                    </imcms:menuloop>
                </li>
            </imcms:menuitem>
        </imcms:menuloop>
    </ul>
</imcms:menu>

Available list of tag attributes:¶

Example:¶

<%@taglib prefix="imcms" uri="imcms" %>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Template</title>
    <meta charset="utf-8"/>
</head>
<body>
    <imcms:menu no='1' docId="1001">
        <ul>
            <imcms:menuloop>
                <imcms:menuitem>
                    <li>
                        <imcms:menuitemlink>
                            ${menuitem.title}
                        </imcms:menuitemlink>
                        <!-- sub menu definition -->
                        <imcms:menuloop>
                            <imcms:menuitem>
                                <div>
                                    <imcms:menuitemlink>
                                        ${menuitem.title}
                                    </imcms:menuitemlink>
                                </div>
                            </imcms:menuitem>
                        </imcms:menuloop>
                    </li>
                </imcms:menuitem>
            </imcms:menuloop>
        </ul>
    </imcms:menu>
</body>
</html>

Second example: with use nested, disable nested in the menu and in each menuItem¶

<imcms:menu no='1' docId="1001" pre="<div><ul>" post="</ul></div>" nested="true" label="something" showlabel="true">
               <li><imcms:menuitemlink>${menuitem.title}</imcms:menuitemlink></li>
</imcms:menu>

Third example: generate automatic html menu items¶

<imcms:menu index='1' nested="true" wrap="span, b, i" attributes="wcag, data, class", treeKey="20"/>
Next Previous

© Copyright 2015-2018, ImCodePartnerAB Revision 8459a688.

Built with Sphinx using a theme provided by Read the Docs.
Read the Docs v: latest
Versions
master
latest
Downloads
pdf
html
epub
On Read the Docs
Project Home
Builds

Free document hosting provided by Read the Docs.