Skip to content
Browse files

Added custom walker for top menu. Added block grids.

  • Loading branch information...
1 parent 2f539ca commit 2b3c6c46f8780a3bfb397360931c470e8c2fe581 @mindctrl committed Feb 15, 2012
Showing with 301 additions and 35 deletions.
  1. +3 −1 changelog.txt
  2. +2 −2 header-hero.php
  3. +4 −4 header.php
  4. +3 −3 inc/bootstrap-js.php
  5. +145 −1 inc/menus.php
  6. +49 −0 inc/tweaks-deprecated.php
  7. +7 −21 inc/tweaks.php
  8. +3 −2 js/alienship_dropdown-toggle.js
  9. +85 −1 style.css
View
4 changelog.txt
@@ -12,7 +12,9 @@ Version 0.3 - February
- Breadcrumbs
- Minor cosmetics
- Cleaned up old CSS
-
+- Added block grids, courtesy of Zurb Foundation.
+- Added Custom Walker for Top Nav and a fallback function to create/display a blank menu if a custom menu is not set. Disabled jQuery code that built the dropdown elements.
+- Removed self-closing tags that don't need it in HTML5.
Version 0.2 - February 6, 2012
View
4 header-hero.php
@@ -71,15 +71,15 @@
<!-- Load Top Menu -->
<div class="navbar" data-scrollspy="scrollspy">
<div class="navbar-inner">
- <div class="container">
+ <div class="container-fluid">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar-text">Menu</span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
<div class="nav-collapse">
- <?php wp_nav_menu( array( 'theme_location' => 'top', 'container' => false, 'menu_class' => 'nav' ) ); ?>
+ <?php wp_nav_menu( array( 'theme_location' => 'top', 'container' => false, 'menu_class' => 'nav', 'walker' => new alienship_Navbar_Nav_Walker(), 'fallback_cb' => 'alienship_menu_fallback' ) ); ?>
</div><!-- /nav-collapse -->
</div><!-- /container -->
</div><!-- /navbar-inner -->
View
8 header.php
@@ -68,19 +68,18 @@
<body <?php body_class(); ?> onload="prettyPrint()">
<!--[if lt IE 8]><p class="chromeframe">Your browser is <em>ancient!</em> <a href="http://browsehappy.com/">Upgrade to a different browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to experience this site.</p><![endif]-->
-
<!-- Load Top Menu -->
<div class="navbar">
<div class="navbar-inner">
- <div class="container">
+ <div class="container-fluid">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar-text">Menu</span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>
<div class="nav-collapse">
- <?php wp_nav_menu( array( 'theme_location' => 'top', 'container' => false, 'menu_class' => 'nav' ) ); ?>
+ <?php wp_nav_menu( array( 'theme_location' => 'top', 'container' => false, 'menu_class' => 'nav', 'walker' => new alienship_Navbar_Nav_Walker(), 'fallback_cb' => 'alienship_menu_fallback' ) ); ?>
</div><!-- /nav-collapse -->
</div><!-- /container -->
</div><!-- /navbar-inner -->
@@ -96,5 +95,6 @@
<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
</hgroup><br />
<!-- End Site title and description in masthead -->
- </header><!-- #masthead -->
+ </header><!-- #masthead -->
<div id="main">
+ <?php if (function_exists('alienship_breadcrumbs')) alienship_breadcrumbs(); ?>
View
6 inc/bootstrap-js.php
@@ -22,8 +22,8 @@ function bootstrap_js_loader() {
}
add_action('wp_enqueue_scripts', 'bootstrap_js_loader');
-function bootstrap_dropdown_helper() {
- // Add toggles to dropdown menus.
+/* Add toggles to dropdown menus. - Currently disabled. Using custom walker instead. */
+/* function bootstrap_dropdown_helper() {
wp_enqueue_script('alienship_dropdown-toggle.js', get_template_directory_uri().'/js/alienship_dropdown-toggle.js', array('jquery'), '1.0', true );
}
-add_action('wp_enqueue_scripts', 'bootstrap_dropdown_helper');
+add_action('wp_enqueue_scripts', 'bootstrap_dropdown_helper'); */
View
146 inc/menus.php
@@ -5,4 +5,148 @@
register_nav_menus( array(
'top' => __( 'Top Menu', 'alienship' ),
'bottom' => __('Bottom Menu', 'alienship')
- ) );
+ ) );
+
+
+ /* Custom Walker stuff - Credit to Roots Theme */
+ class alienship_Nav_Walker extends Walker_Nav_Menu {
+ function check_current($val) {
+ return preg_match('/(current-)/', $val);
+ }
+
+ function start_el(&$output, $item, $depth, $args) {
+ global $wp_query;
+ $indent = ($depth) ? str_repeat("\t", $depth) : '';
+
+ $slug = sanitize_title($item->title);
+
+ $class_names = $value = '';
+ $classes = empty($item->classes) ? array() : (array) $item->classes;
+
+ $classes = array_filter($classes, array(&$this, 'check_current'));
+
+ $class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item));
+ $class_names = $class_names ? ' class="' . esc_attr($class_names) . '"' : '';
+
+ $id = apply_filters('nav_menu_item_id', 'menu-' . $slug, $item, $args);
+ $id = strlen($id) ? ' id="' . esc_attr( $id ) . '"' : '';
+
+ $output .= $indent . '<li' . $id . $class_names . '>';
+
+ $attributes = ! empty($item->attr_title) ? ' title="' . esc_attr($item->attr_title) .'"' : '';
+ $attributes .= ! empty($item->target) ? ' target="' . esc_attr($item->target ) .'"' : '';
+ $attributes .= ! empty($item->xfn) ? ' rel="' . esc_attr($item->xfn ) .'"' : '';
+ $attributes .= ! empty($item->url) ? ' href="' . esc_attr($item->url ) .'"' : '';
+
+ $item_output = $args->before;
+ $item_output .= '<a'. $attributes .'>';
+ $item_output .= $args->link_before . apply_filters('the_title', $item->title, $item->ID) . $args->link_after;
+ $item_output .= '</a>';
+ $item_output .= $args->after;
+
+ $output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
+ }
+}
+
+/* Custom Walker for Top Menu */
+class alienship_Navbar_Nav_Walker extends Walker_Nav_Menu {
+ function check_current($val) {
+ return preg_match('/(current-)|active|dropdown/', $val);
+ }
+
+ function start_lvl(&$output, $depth) {
+ $output .= "\n<ul class=\"dropdown-menu\">\n";
+ }
+
+ function start_el(&$output, $item, $depth, $args) {
+ global $wp_query;
+ $indent = ($depth) ? str_repeat("\t", $depth) : '';
+
+ $slug = sanitize_title($item->title);
+
+ $li_attributes = '';
+ $class_names = $value = '';
+
+ $classes = empty($item->classes) ? array() : (array) $item->classes;
+ if ($args->has_children) {
+ $classes[] = 'dropdown';
+ $li_attributes .= ' data-dropdown="dropdown"';
+ }
+ $classes[] = ($item->current) ? 'active' : '';
+ $classes = array_filter($classes, array(&$this, 'check_current'));
+
+ $class_names = join(' ', apply_filters('nav_menu_css_class', array_filter($classes), $item));
+ $class_names = $class_names ? ' class="' . esc_attr($class_names) . '"' : '';
+
+ $id = apply_filters('nav_menu_item_id', 'menu-' . $slug, $item, $args);
+ $id = strlen($id) ? ' id="' . esc_attr( $id ) . '"' : '';
+
+ $output .= $indent . '<li' . $id . $class_names . $li_attributes . '>';
+
+ $attributes = ! empty($item->attr_title) ? ' title="' . esc_attr($item->attr_title) .'"' : '';
+ $attributes .= ! empty($item->target) ? ' target="' . esc_attr($item->target ) .'"' : '';
+ $attributes .= ! empty($item->xfn) ? ' rel="' . esc_attr($item->xfn ) .'"' : '';
+ $attributes .= ! empty($item->url) ? ' href="' . esc_attr($item->url ) .'"' : '';
+ $attributes .= ($args->has_children) ? ' class="dropdown-toggle" data-toggle="dropdown"' : '';
+
+ $item_output = $args->before;
+ $item_output .= '<a'. $attributes .'>';
+ $item_output .= $args->link_before . apply_filters('the_title', $item->title, $item->ID) . $args->link_after;
+ $item_output .= ($args->has_children) ? ' <b class="caret"></b>' : '';
+ $item_output .= '</a>';
+ $item_output .= $args->after;
+
+ $output .= apply_filters('walker_nav_menu_start_el', $item_output, $item, $depth, $args);
+ }
+ function display_element($element, &$children_elements, $max_depth, $depth = 0, $args, &$output) {
+ if (!$element) { return; }
+
+ $id_field = $this->db_fields['id'];
+
+ // display this element
+ if (is_array($args[0])) {
+ $args[0]['has_children'] = !empty($children_elements[$element->$id_field]);
+ } elseif (is_object($args[0])) {
+ $args[0]->has_children = !empty($children_elements[$element->$id_field]);
+ }
+ $cb_args = array_merge(array(&$output, $element, $depth), $args);
+ call_user_func_array(array(&$this, 'start_el'), $cb_args);
+
+ $id = $element->$id_field;
+
+ // descend only when the depth is right and there are childrens for this element
+ if (($max_depth == 0 || $max_depth > $depth+1) && isset($children_elements[$id])) {
+ foreach ($children_elements[$id] as $child) {
+ if (!isset($newlevel)) {
+ $newlevel = true;
+ // start the child delimiter
+ $cb_args = array_merge(array(&$output, $depth), $args);
+ call_user_func_array(array(&$this, 'start_lvl'), $cb_args);
+ }
+ $this->display_element($child, $children_elements, $max_depth, $depth + 1, $args, $output);
+ }
+ unset($children_elements[$id]);
+ }
+
+ if (isset($newlevel) && $newlevel) {
+ // end the child delimiter
+ $cb_args = array_merge(array(&$output, $depth), $args);
+ call_user_func_array(array(&$this, 'end_lvl'), $cb_args);
+ }
+
+ // end this element
+ $cb_args = array_merge(array(&$output, $element, $depth), $args);
+ call_user_func_array(array(&$this, 'end_el'), $cb_args);
+ }
+}
+
+
+/* Top Menu fallback callback. If no menu is assigned, let's assign one - and optionally create one if needed. */
+function alienship_menu_fallback() {
+ $locations = get_theme_mod('nav_menu_locations');
+ if (! has_nav_menu('top') && ! is_nav_menu( 'Blank Top Menu' )) {
+ $locations['top'] = wp_create_nav_menu('Blank Top Menu', array('slug' => 'top'));
+ set_theme_mod('nav_menu_locations', $locations);
+ }
+ set_theme_mod('nav_menu_locations', $locations);
+}
View
49 inc/tweaks-deprecated.php
@@ -0,0 +1,49 @@
+<?php
+/* Deprecated functions */
+
+/**
+ * Get our wp_nav_menu() fallback, wp_page_menu(), to show a home link.
+ *
+ * @since Alien Ship 0.1
+ */
+/* function alienship_page_menu_args( $args ) {
+ $args['show_home'] = true;
+ return $args;
+}
+add_filter( 'wp_page_menu_args', 'alienship_page_menu_args' ); */
+
+/** Tweak menu output
+ *
+ * @since Alien Ship 0.3
+ */
+/* Add <ul class="nav"> to first <ul> occurrence on wp_page_menu output
+function alienship_add_page_menu_class($ulclass) {
+ return preg_replace('/<ul>/', '<ul class="nav">', $ulclass, 1);
+}
+add_filter('wp_page_menu','alienship_add_page_menu_class'); */
+
+/* Replace class="children" with class="dropdown-menu" on wp_page_menu output
+function alienship_replace_page_menu_class($ulclass) {
+ return preg_replace('/<ul class=\'children\'>/', '<ul class="dropdown-menu">', $ulclass);
+}
+add_filter('wp_page_menu','alienship_replace_page_menu_class'); */
+
+/* Replace class="sub-menu" with class="dropdown-menu" on wp_nav_menu output
+function alienship_replace_wp_nav_menu_class($ulclass) {
+ return preg_replace('/<ul class="sub-menu">/', '<ul class="dropdown-menu">', $ulclass);
+}
+add_filter('wp_nav_menu','alienship_replace_wp_nav_menu_class'); */
+
+
+/* function alienship_nav_menu_args($args = '') {
+ $args['container'] = false;
+ $args['depth'] = 2;
+ $args['items_wrap'] = '<ul class="nav">%3$s</ul>';
+ if (!$args['walker']) {
+ $args['walker'] = new alienship_Nav_Walker();
+ }
+ return $args;
+}
+add_filter('wp_nav_menu_args', 'alienship_nav_menu_args'); */
+
+
View
28 inc/tweaks.php
@@ -8,29 +8,15 @@
* @since Alien Ship 0.1
*/
-/**
- * Get our wp_nav_menu() fallback, wp_page_menu(), to show a home link.
- *
- * @since Alien Ship 0.1
- */
-function alienship_page_menu_args( $args ) {
- $args['show_home'] = true;
- return $args;
-}
-add_filter( 'wp_page_menu_args', 'alienship_page_menu_args' );
-
-
-/** Tweak wp_page_menu output to add <ul class="nav"> to first <ul> occurrence
- *
- * @since Alien Ship 0.3
- */
-function alienship_add_page_menu_class($ulclass) {
-return preg_replace('/<ul>/', '<ul class="nav">', $ulclass, 1);
+/* @since Alien Ship 0.3
+ * We don't need to self-close these tags in html5: <img>, <input> */
+function alienship_remove_self_closing_tags($input) {
+ return str_replace(' />', '>', $input);
}
-add_filter('wp_page_menu','alienship_add_page_menu_class');
-
-
+add_filter('get_avatar', 'alienship_remove_self_closing_tags');
+add_filter('comment_id_fields', 'alienship_remove_self_closing_tags');
+add_filter('post_thumbnail_html', 'alienship_remove_self_closing_tags');
/**
* Adds custom classes to the array of body classes.
View
5 js/alienship_dropdown-toggle.js
@@ -1,7 +1,8 @@
/* Adding the class "dropdown" to li elements with submenus */
jQuery(document).ready(function(){
- jQuery("ul.sub-menu").addClass("dropdown-menu").removeClass("sub-menu"); // switch sub-menu to dropdown-menu
- jQuery("ul.children").addClass("dropdown-menu").removeClass("children"); // switch wp_page_menu children to dropdown-menu
+// The following two lines are deprecated and are now handled in inc/tweaks.php
+// jQuery("ul.sub-menu").addClass("dropdown-menu").removeClass("sub-menu"); // switch sub-menu to dropdown-menu
+// jQuery("ul.children").addClass("dropdown-menu").removeClass("children"); // switch wp_page_menu children to dropdown-menu
jQuery("ul.dropdown-menu").parent().addClass("dropdown"); //add dropdown to top-level li.
jQuery("[id^=menu-] li.dropdown a").addClass("dropdown-toggle"); //add dropdown-toggle to top-level menu item
jQuery("ul.nav li.dropdown a").addClass("dropdown-toggle"); // add dropdown-toggle to wp_page_menu output
View
86 style.css
@@ -603,5 +603,89 @@ table.hide-on-tablets {
font-weight: normal;
padding: 15px 20px;
}
+}
+
+/* --------------------------------------------------
+ :: Block grids - Thanks to Zurb Foundation
+ http://foundation.zurb.com/
+
+ These are 2-up, 3-up, 4-up and 5-up ULs, suited
+ for repeating blocks of content. Add 'mobile' to
+ them to switch them just like the layout grid
+ (one item per line) on phones
+
+ For IE7/8 compatibility block-grid items need to be
+ the same height. You can optionally uncomment the
+ lines below to support arbitrary height, but know
+ that IE7/8 do not support :nth-child.
+ -------------------------------------------------- */
+
+ .block-grid {
+ display: block;
+ overflow: hidden;
+ }
+
+ .block-grid > li {
+ display: block;
+ height: auto;
+ float: left;
+ padding: 10px 0;
+ margin-bottom: 12px;
+ }
-}
+ .block-grid > li > blockquote {
+ border-left: none;
+ padding: 0 15px;
+ }
+
+ .block-grid.two-up {
+ margin-left: -4%
+ }
+
+ .block-grid.two-up > li {
+ margin-left: 4%;
+ width: 46%;
+ }
+
+ .block-grid.three-up {
+ margin-left: -2%
+ }
+
+ .block-grid.three-up > li {
+ margin-left: 2%;
+ width: 31.3%;
+ }
+
+ .block-grid.four-up {
+ margin-left: -2%
+ }
+
+ .block-grid.four-up > li {
+ margin-left: 2%;
+ width: 23%;
+ }
+
+ .block-grid.five-up {
+ margin-left: -1.5%
+ }
+
+ .block-grid.five-up > li {
+ margin-left: 1.5%;
+ width: 18.5%;
+ }
+
+/* --------------------------------------------------
+ :: Mobile Block Grids
+ -------------------------------------------------- */
+
+ @media only screen and (max-width: 767px) {
+ .block-grid.mobile {
+ margin-left: 0;
+ }
+
+ .block-grid.mobile > li {
+ float: none;
+ width: 100%;
+ margin-left: 0;
+ }
+ }

0 comments on commit 2b3c6c4

Please sign in to comment.
Something went wrong with that request. Please try again.