Login

Recover Your Password

Welcome

Bring Your Vision To Life

We provide software and services that enable our customers and partners to turn advanced technology into real solutions.

What We Do

Contensive works as a team member with client partners, providing the highest level of technical competence and support in the design, production, management & lifecycle support of online applications.

api illustration
API Integration

You name it, we can integrate it

mobile development illustration
Mobile App Development

Custom mobile apps that can do everything

cloud app dev illustration
Cloud Application Development

Customized applications with the features you need

cloud host illustration
Best-In-Class Cloud Hosting

AWS platform, the leader in cloud computing

life cycle illustration
Life Cycle Management

Continuous monitoring, user support, and training

business process illustration
Business Process Automation

Streamline your operations and increase efficiencies

Let’s work on a solution to your problem today!

Process

Agile Software Development Process

Benefits

Why You Should Choose Contensive

The greatest product we offer is our experienced team and our dedication to real-world, time-tested principles: a realistic budget, a disciplined process, and enough flexibility and creativity to accommodate any requirement.

contensive favicon
Proven Development Process

Our agile scrum process allows total transparency

contensive favicon
Time Tested Principles

We follow best practices to get the best results

contensive favicon
Realistic Budget

Payment options that will help you succeed

contensive favicon
Expertise

30+ year history of customer success and profitability

contensive favicon
Talented Team Members

Each developer has disparate skill sets & decades of experience

Experience

Contensive’s Experience

Contensive provides software and services that enable our customers and partners to turn advanced technology into real solutions.

100k+

e-commerce transactions a month

1st

Website allowed in the chamber of US Supreme Court

8 years

Average relationship with client

600+

Websites and applications created

30+

years of experience

300k+

People visiting our applications

Contact Us

Questions?
Call Us (703)-251-0624

Tech Support
support@contensive.com

Return to Product Support > Learning Center > Managing Add-ons > Add-on List and Instructions for Use > Menuing Add-on

Menuing Add-on

The menuing collection contains an addon called Menu that builds an html list-based menu for website pages and templates. It also contains two other legacy menu addons that support older layouts, the Dynamic Menu and the Menu-Legacy.

If you are content manager interested in managing the sections in your menu, continue reading here. If you are a designer or developer creating or modifying a menu instance, skip to Menu Development below.

To Add a Menu to a Page

  • Add the menu addon to your template or page.
  • turn on Advanced Edit and click on the menu addon's option icon
  • Create a new menu or select a menu already created and hit apply

To Add a New Section to a Menu

  • Turn on edit and click the Add Section icon to the right (or bottom) of menu's sections
  • Enter the name of the new section and hit OK

Menu Development

 

In the Menung Collection, the currently supported addon is called "Menu" and creates a ul/li based menu construct.

A page can include multiple menu instances. You create a menu instance by adding the Menu add-on to your page or template.

 

Menu features such as the style class names used and javascript control are stored in Dynamic Menu records, found in the admin site under Manage Design.

 

A menu is a list of website sections. Each site section points to a single page, to which other child pages can be attached in a tree fashion. You set the depth of the tree structure in the Dynamic Menu record created for the menu.

When a Menu is first displayed, it is configured to use the Dynamic Menu record named "Default", which is created automatically if it is missing.

Menu Styles and Features

Menu features are stored in Dynamic Menu records. To edit these records log on to the admin site and go to the navigator >> Manage Design >> click on Menus

Menu Depth determines how many ul/li levels will be included in the menu.

The Layout (vertical or horizontal) controls the class of the second tier wrapper in the html contruct. See the example below. Set horizontal and class is set to layoutHorizontal. Set vertical and it becomes layoutVertical.

The javascript tab enables optional javascript flyouts. This can be disabled so you can control your menus with only CSS. Enabling javascript creates either hover or click events for each menu level.

The styles tabe controls the css class names used for each node and tier of the menu html. See the example below. Setting the fields in the Styles tab will change the class names that appear in the html.

Finally, the sections tab lets you pick which sections will appear in this menu.

Creating Multiple Menu Instances

To create a second menu instance, add it to the page's content or site template.

To change the menu so it is controlled by a different Dynamic Menu record, turn on advanced edit and view the page. Click the add-on options icon above the menu and select or enter the name of a Dynamic Menu record.

Sample html

The following HTML is provided for those who wish to create a custom css stylesheet.

This html represents sections / pages is the following structure.

  • Home
  • Section2
  • Section3
    • Section3tier2
      • Section3tier3
<div class="topWrapper">
<div class="layoutHorizontal">
<ul class="topList">
<li class="activeItem firstItem topItem"><a class="activeItem firstItem topItem" title="Home" href="/Home">Home</a></li>
<li class="topItem"><a class="topItem" title="Section2" href="/Section2">Section2</a></li>
<li class="lastItem topItem"><a class="lastItem topItem" title="Section3" href="/Section3">Section3</a>
<div class="tierWrapper" id="559914298">
<ul class="tierList">
<li class="lastItem firstItem tierItem"><a title="Section3tier2" class="lastItem firstItem tierItem" href="/Section3tier2">Section3tier2&nbsp;&#187;</a>
<div class="tierWrapper" id="1288362774">
<ul class="tierList">
<li class="lastItem firstItem tierItem" ><a title="Section3tier3" class="lastItem firstItem tierItem" href="/Section3tier3">Section3tier3</a></li>
</ul>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>