Twenty Thirteen: add visual Indicator for menu items with children

[downstairsdev]

It's helpful to have a visual indicator when a top level menu item contains a hidden drop down menu.

This patch adds a filter to wp_nav_menu_objects in order to add the class "has-children" to top level menu items that contain children. This allows us to style it with psuedo element, similar to how the menu-toggle is styled for smaller screens.

The filter I used was posted by @chipbennet on the WordPress Theme Reviewers List. The same functionality could also be achieved by a Custom Nav Walker (see ​http://wptheming.com/2013/03/drop-down-menu-indicator/), but Chip's solution seemed more straightforward.

Neither method works unless a menu has actually been set.

Visual Indicator Patch

Screen Shot of Indicator

Alternatively, a "has-children" class could just be added to the menus in WordPress core so that it is available to all themes. I'll look into a patch for that next.

Replying to downstairsdev:

Alternatively, a "has-children" class could just be added to the menus in WordPress core so that it is available to all themes. I'll look into a patch for that next.

That would be much better -- that way *all* themes can take advantage of the class and style it as they wish.

Replying to downstairsdev:

I'll look into a patch for that next.

Try here first: #15214

Chatted about this a lot today during IRC office hours ​log, and also got an opinion from Joen.

It's a bit late to get the core change in before beta, so we'll punt this to a future release. In case it's helpful, here is some example CSS from Joen to style (based on proposed class names in #15214):

.menu-item-with-sub-menu,
.page_item_with_children {
  content: ‘\f502′;
  font: 8px/1 Genericons;
  -webkit-font-smoothing: antialiased;
  margin-left: 6px;
}