Blog

Gavin Pickin

December 23, 2016

Spread the word


Share your thoughts

As we continue with our 12 Tips of (ContentBox) Christmas, we at Ortus Solutions are giving you a gift of developer productivity, we will share a few tips and tricks that will keep giving all year around. Brad Wood is also doing 12 Tips of (CommandBox) Christmas.

ContentBox's default navigation is based on your Pages. You can add edit and delete pages in the admin under Content > Site Map. Sometimes you need more than page to make your website. The menu manager allows you to create 'Menus' to be used in a variety of ways in your ContentBox Website. A Menu can contains several Items, which can be from a range of Item types, Content like Pages and Blog posts, Media, Submenus, URLs, JS or Free type. Menus are easy to create, and give you a lot more options that relying on pages inside your traditional Sitemap structure.

To use a Menu instead of the Sitemap, you have to install a Theme which supports Menus, and then select the Menu you wish to use as you main site Menu.

Some Themes may support additional menus for top menus, footer menus, side bar menus. Please refer to your Theme.

Menu Data

  • Title: The name of the Menu
  • List Type: ( ul | ol ) Unordered List or Ordered List
  • Menu Slug: This is the code referenced slug, to be used to retrieve the Menu in the Theme or View, where required.
  • CSS Classes: Optional CSS Classes to be added to the Main Menu List itself ( ul or ol - when supported by the Theme )
  • List CSS Classes: Optional CSS Classes to be added to each of the List Items ( li - when supported by the Theme )

 

Item Types

  • Content
  • Media
  • Submenu
  • URL
  • JS
  • Free

Each content type has it's own set of attributes.

Common Attributes (Shared by all Item Types)

  • Label - Read Only - Same as the Item Content field below.
  • Item Content - This is Name/Title that shows in the Menu Item itself.
  • CSS Classes - Optional additional CSS classes to be added to the list item

 

Type: Content

Content refers to a Page, or Blog Entry. You can search and select the content item you wish this item to link to. The Item Content ( visible label for the menu item ) automatically populates when you select an item for Content Item.

In Addition to the Common Attributes listed above, this type also includes:

  • Content - This is a search and selection tool to help you select a page or blog entry for this Menu Item to link to.
  • URL Classes - Additional CSS for this Menu Item's HTML Element
  • Target - Allows you to select how the link is treated by the browser, allowing
    • _self
    • _blank
    • _parent
    • _top
  • Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
  • Title - A accessible title, commonly used by browsers as a tool tip.

 

Type: Media

Refers to Media from the Media Manager
In Addition to the Common Attributes listed above, this type also includes:

  • Media - This is a search and selection tool to help you select a media item from the Media Manager for this Menu Item to link to.
  • URL Classes - Additional CSS for this Menu Item's HTML Element
  • Target - Allows you to select how the link is treated by the browser, allowing
    • _self
    • _blank
    • _parent
    • _top
  • Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
  • Title - A accessible title, commonly used by browsers as a tool tip.

 

Type: Submenu

A Submenu type allows you to select an entire Menu to be included in the current Menu, as a Menu Item.

In Addition to the Common Attributes listed above, this type also includes:

  • Select Sub-menu - This is a drop down select list of all of the Menus available for selection.
  • Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
  • Title - A accessible title, commonly used by browsers as a tool tip.

Note: This relies on the Theme you are using, to utilize this feature.

 

Type: URL

A URL allows you to add any linkable URL you might desire into your Menu.

In Addition to the Common Attributes listed above, this type also includes:

  • URL - The URL you wish to use for this menu item
  • URL Classes - Additional CSS for this Menu Item's HTML Element
  • Target - Allows you to select how the link is treated by the browser, allowing
    • _self
    • _blank
    • _parent
    • _top
  • Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
  • Title - A accessible title, commonly used by browsers as a tool tip.

 

Type: JS

Not all menu items will be Links to other HTTP resources, with todays applications, we are commonly using more and more JavaScript, and the Menu Manager allows you to add JavaScript into your Menu Items as well.

In Addition to the Common Attributes listed above, this type also includes:

  • JavaScript Code - JavaScript to be excuted when this Menu Item is clicked.
  • URL Classes - Additional CSS for this Menu Item's HTML Element
  • Data Attributes - Allows you to add one or many data attributes for the menu item. You can use JSON ( {"me":"you"} ) or a comma-delimited list ( me=you,icecream=awesome )
  • Title - A accessible title, commonly used by browsers as a tool tip.

 

Type: Free

This is a menu item that creates a 'free-text' menu item. This item only uses the common attributes, Item Content, and CSS Classes... listed above.

Preview

As you add, edit, and delete Menu Items, you can preview those menu items in page. You can refresh the menu by clicking the refresh icon next to the title Preview if the preview has not updated as expected.

 

Add Your Comment

Recent Entries

Ortus Content Digest for week of August 19th

Ortus Content Digest for week of August 19th

It's August 19th... Into the Box is approaching fast, what has Ortus been publishing this week? We have the CFML News Podcast, some CFCasts and YouTube Videos, lots of Ortus and ITB Blog Posts. We have a lot more planned for next week as well.

Gavin Pickin
Gavin Pickin
August 19, 2022
Integrating ColdBox with Existing Code Series 5: Using Wirebox

Integrating ColdBox with Existing Code Series 5: Using Wirebox

Recently, I did a webinar on Refactoring Legacy Code and the question came up about whether or not it was possible to use ColdBox with existing code without converting everything to a ColdBox module or making changes to the existing codebase. In the first installation in this series, we took a tour of the various elements which make up ColdBox. In the second installation, we looked at creating layouts, views, and routes in the main site. In the third, we created a module and did the first integration of our existing code into our ColdBox site. In the fourth, we continued developing our module with a handler and passing variable back to Coldbox. Now we'll use Wirebox with and without ColdBox Modules to see how these approaches differ from a traditional approach.

Dan Card
Dan Card
August 18, 2022
Ortus Content Digest for week of August 12th

Ortus Content Digest for week of August 12th

It's August 12th... what has Ortus been publishing this week? We have the CFML News Podcast, some CFCasts and YouTube Videos, lots of Ortus and ITB Blog Posts. We have a lot more planned for next week as well.

Gavin Pickin
Gavin Pickin
August 12, 2022