Skip to content

Commit

Permalink
Added navwalker.php and readme.
Browse files Browse the repository at this point in the history
  • Loading branch information
Poruno authored Jan 21, 2018
1 parent b20403a commit 8548394
Show file tree
Hide file tree
Showing 2 changed files with 83 additions and 0 deletions.
22 changes: 22 additions & 0 deletions Readme.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
1) Place navwalker.php in your WordPress theme folder /wp-content/your-theme/

2) To use Bulma-navwalker add these lines to your functions.php

require_once('navwalker.php');
register_nav_menus( array(
'primary' => __( 'Primary Menu', 'missionfit' ),
) );

3) Then add this initializer in your header (either index.php, header.php, etc...)
wp_nav_menu( array(
'theme_location' => 'primary',
'depth' => 2,
'container' => false,
// 'items_wrap' => 'div',
'menu_class' => 'navbar-menu',
'menu_id' => 'primary-menu',
'after' => "</div>",
'walker' => new Navwalker())
);

3) Congratulations you are now using Bulma!
61 changes: 61 additions & 0 deletions navwalker.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
<?php
/**
* Bulma-Navwalker
*
* @package Bulma-Navwalker
*/

/**
* Class Name: Navwalker
* Plugin Name: Bulma Navwalker
* Plugin URI: https://github.com/Poruno/Bulma-Navwalker
* Description: An extended Wordpress Navwalker object that displays Bulma framework's Navbar https://bulma.io/ in Wordpress.
* Author: Carlo Operio - https://www.linkedin.com/in/carlooperio/, Bulma-Framework
* Author URI: https://github.com/wp-bootstrap
* License: GPL-3.0+
* License URI: https://github.com/Poruno/Bulma-Navwalker/blob/master/LICENSE
*/

class Navwalker extends Walker_Nav_Menu {

public function start_lvl( &$output, $depth = 0, $args = array() ) {

$output .= "<div class='navbar-dropdown'>";
}

public function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {

$liClasses = 'navbar-item '.$item->title;

$hasChildren = $args->walker->has_children;
$liClasses .= $hasChildren? " has-dropdown is-hoverable": "";

if($hasChildren){
$output .= "<div class='".$liClasses."'>";
$output .= "\n<a class='navbar-link' href='".$item->url."'>".$item->title."</a>";
}
else {
$output .= "<a class='".$liClasses."' href='".$item->url."'>".$item->title;
}

// Adds has_children class to the item so end_el can determine if the current element has children
if ( $hasChildren ) {
$item->classes[] = 'has_children';
}
}

public function end_el(&$output, $item, $depth = 0, $args = array(), $id = 0 ){

if(in_array("has_children", $item->classes)) {

$output .= "</div>";
}
$output .= "</a>";
}

public function end_lvl (&$output, $depth = 0, $args = array()) {

$output .= "</div>";
}
}
?>

0 comments on commit 8548394

Please sign in to comment.