Skip to content

Instantly share code, notes, and snippets.

@blpraveen

blpraveen/functions.php

Last active August 29, 2015 14:12
Show Gist options
  • Save blpraveen/34938e76a0f65a635ed0 to your computer and use it in GitHub Desktop.
Save blpraveen/34938e76a0f65a635ed0 to your computer and use it in GitHub Desktop.
Download ZIP
Wordpress MegaMenu
Raw
functions.php
function megamenu_nav_update( $menu_id, $menu_item_db_id ) {
// verify this came from our screen and with proper authorization.
if ( ! isset( $_POST['megamenu-nonce'] ) || ! wp_verify_nonce( $_POST['megamenu-nonce'], 'megamenu-nonce-name' ) )
return;
if(isset($_POST['mega-menu-colopt'][$menu_item_db_id]) && $_POST['mega-menu-colopt'][$menu_item_db_id] != '') {
update_post_meta( $menu_item_db_id, '_mega_menu_colopt', $_POST['mega-menu-colopt'][$menu_item_db_id]);
} else {
delete_post_meta( $menu_item_db_id, '_mega_menu_colopt' );
}
}
function megamenu_custom_fields( $item_id, $item, $depth, $args ) {
$nav_menu_selected_id = isset( $_REQUEST['menu'] ) ? (int) $_REQUEST['menu'] : 0;
$_menu_object = '';
$nav_menus = wp_get_nav_menus( array('orderby' => 'name') );
$menu_count = count( $nav_menus );
// Get recently edited nav menu
$recently_edited = absint( get_user_option( 'nav_menu_recently_edited' ) );
$one_theme_location_no_menus = ( 1 == count( get_registered_nav_menus() ) && ! $add_new_screen && empty( $nav_menus ) && ! empty( $page_count->publish ) ) ? true : false;
$add_new_screen = ( isset( $_GET['menu'] ) && 0 == $_GET['menu'] ) ? true : false;
if ( empty( $recently_edited ) && is_nav_menu( $nav_menu_selected_id ) )
$recently_edited = $nav_menu_selected_id;
// Use $recently_edited if none are selected
if ( empty( $nav_menu_selected_id ) && ! isset( $_GET['menu'] ) && is_nav_menu( $recently_edited ) )
$nav_menu_selected_id = $recently_edited;
// On deletion of menu, if another menu exists, show it
if ( ! $add_new_screen && 0 < $menu_count && isset( $_GET['action'] ) && 'delete' == $_GET['action'] )
$nav_menu_selected_id = $nav_menus[0]->term_id;
// Set $nav_menu_selected_id to 0 if no menus
if ( $one_theme_location_no_menus ) {
$nav_menu_selected_id = 0;
} elseif ( empty( $nav_menu_selected_id ) && ! empty( $nav_menus ) && ! $add_new_screen ) {
// if we have no selection yet, and we have menus, set to the first one in the list
$nav_menu_selected_id = $nav_menus[0]->term_id;
}
// If there's a menu, get its name.
if ( ! $nav_menu_selected_title && is_nav_menu( $nav_menu_selected_id ) ) {
$_menu_object = wp_get_nav_menu_object( $nav_menu_selected_id );
$nav_menu_selected_title = ! is_wp_error( $_menu_object ) ? $_menu_object->name : '';
}
if ( 0 == $nav_menu_selected_id ) {
$new_menu_title = trim( esc_html( $_POST['menu-name'] ) );
if ( $new_menu_title ) {
$_nav_menu_selected_id = wp_update_nav_menu_object( 0, array('menu-name' => $new_menu_title) );
if ( is_wp_error( $_nav_menu_selected_id ) ) {
} else {
$_menu_object = wp_get_nav_menu_object( $_nav_menu_selected_id );
$nav_menu_selected_id = $_nav_menu_selected_id;
}
}
} else {
$_menu_object = wp_get_nav_menu_object( $nav_menu_selected_id );
}
$menu_locations = get_nav_menu_locations();
?>
<?php
if($_menu_object && $menu_locations['primary'] == $_menu_object->term_id && $depth == 1) {
?>
<input type="hidden" name="megamenu-nonce" value="<?php echo wp_create_nonce( 'megamenu-nonce-name' ); ?>" />
<div class="description-wide" style="margin: 5px 0;">
<span class="description"><?php _e( "Column Select (Mega Menu)", 'nav-menu-roles' ); ?></span>
<br />
<?php
$mega_colpot = get_post_meta( $item->ID, '_mega_menu_colopt', true );
$column_options = array('full' => 'Full Column','col4' => 'Fourth Column','col3' => 'Third Column','col2' => 'Second Column','col1' => 'First Column', 'item' => 'Menu Item');
if(!$mega_colpot) {
$mega_colpot = 'col1';
}
?>
<div class="role-input-holder" style="float: left; width: 100%; margin: 2px 0;">
<select name="mega-menu-colopt[<?php echo $item->ID ;?>]" id="mega-menu-colopt-<?php echo $item->ID ;?>" >
<?php foreach($column_options as $key => $colopt) {
$select_colopt = selected( true, $mega_colpot == $key , false );
?>
<option value="<?php echo $key;?>" <?php echo $select_colopt; ?>><?php echo $colopt;?></option>
<?php } ?>
</select>
</div>
</div>
<?php
}
}
add_action( 'wp_update_nav_menu_item', 'megamenu_nav_update', 10, 2 );
add_action( 'wp_nav_menu_item_custom_fields', 'megamenu_custom_fields', 10, 4);
Raw
mega_mene.css
.mega-menu , .mega-menu * {
margin: 0;
padding: 0;
list-style: none;
}
.mega-menu {
line-height: 1.0;
}
.mega-menu > li {
padding-bottom: 10px;
}
.mega-menu ul.sub-menu a:hover {
color:#222;
text-decoration:underline;
}
.mega-menu ul.mega-submenu-item > li {
min-width: 200px;
}
.mega-menu ul.mega-submenu-item > li > a {
margin-top:15px;
color:#ff0f00;
}
.mega-menu ul.sub-menu .sub-menu-item:first-child {
margin-top:15px;
}
.mega-menu ul.sub-menu .sub-menu-item {
min-width:200px;
}
.mega-menu ul.sub-menu > li > a:hover {
color:#f58b00;
}
.mega-menu ul.sub-menu a {
font-size:12px;
color:#999;
font-weight:normal;
line-height:12px;
padding:4px 2px;
}
.mega-menu .mega-submenu-col {
display:table-cell;
}
.mega-menu .mega-submenu-col > ul {
margin:0px !important;
}
.mega-menu ul.sub-menu {
position: absolute;
width: auto; /* left offset of submenus need to match (see below) */
max-width: 980px;
top: -999em;
z-index: 200;
padding: 0px 20px 20px 20px;
display:table;
}
.mega-menu li {
float:left;
}
.mega-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */
}
.mega-menu a {
display: block;
position: relative;
}
.mega-menu ul li {
float:none;
width: auto;
}
.mega-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */
}
.mega-menu .sub-menu {
-webkit-transition: all 0s ease;
transition: all 0s ease;
}
.mega-menu .sub-menu li li {
width:250px;
float:none;
display:block;
}
.mega-menu li:hover .sub-menu {
-webkit-transition-delay: .25s;
transition-delay: .25s;
}
.mega-menu li:hover .sub-menu {
top: 39px;
}
.mega-menu .sub-menu {
background:#fff;
width:auto;
box-shadow: 0 4px 6px 3px #bababa;
min-height:350px;
}
.mega-menu .sub-menu li {
}
.mega-menu a {
padding:8px 10px 7px 10px;
text-decoration:none;
cursor:pointer;
font-size:12px;
text-transform:uppercase;
font-weight:900;
line-height:1.3em;
}
Raw
megamenu_walker.php
class MegaMenu_Walker extends Walker_Nav_Menu {
var $output = array('col1' => '','col2' => '','col3' => '','col4' => '','full' => '', 'item' =>'','top' => '','sub' => '');
var $colopt = '';
var $mega_colopt = '';
var $tree_type = array( 'post_type', 'taxonomy', 'custom' );
var $db_fields = array( 'parent' => 'menu_item_parent', 'id' => 'db_id' );
function start_lvl( &$output, $depth = 0, $args = array() ) {
$indent = str_repeat("\t", $depth);
if($depth) {
$this->output[$this->mega_colopt] .= "\n$indent<ul class=\"sub-menu-$depth\">\n";
} else {
$this->output[$this->mega_colopt] .= "\n$indent<ul class=\"sub-menu\">\n";
}
}
function end_lvl( &$output, $depth = 0, $args = array() ) {
$indent = str_repeat("\t", $depth);
if(!$depth) {
foreach(array('col1','col2','col3','col4','full','item') as $type) {
if($type != 'item' && !empty($this->output[$type])) {
$this->output[$type] .= '</ul></li>';
}
if($this->output[$type] != '') {
$this->output['sub'] .= $this->output[$type];
}
}
$this->mega_colopt = 'top';
$this->output['top'] .= $this->output['sub'];
}
$this->output[$this->mega_colopt] .= "$indent</ul>\n";
if(!$depth || $depth == 1) {
$this->output[$this->mega_colopt] .= "<div class='clr'></div>\n";
}
}
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
$class_names = $value = '';
if(!$depth) {
$this->mega_colopt = 'top';
} else if($depth == 1) {
$this->colopt = get_post_meta( $item->ID, '_mega_menu_colopt', true );
if(!$this->colopt) {
$this->colopt = 'col1';
}
if(empty($this->output[$this->colopt]) && in_array($this->colopt,array('col1','col2','col3','col4'))) {
$this->output[$this->colopt] .= '<li class="mega-submenu-col"><ul class="mega-submenu-item">';
} else if(empty($this->output[$this->colopt]) && $type == 'full') {
$this->output[$this->colopt] .= '<li class="mega-submenu-full"><ul class="mega-submenu-item">';
}
$this->mega_colopt = $this->colopt;
} else {
$this->mega_colopt = $this->colopt;
}
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes[] = 'menu-item-' . $item->ID;
$classes[] = 'level-' . $depth ;
if($this->mega_colopt == 'item') {
$classes[] = 'sub-menu-item';
}
$class_names = join( ' ', apply_filters( 'theretailer_nav_menu_css_class', array_filter( $classes ), $item, $args ) );
$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
$id = apply_filters( 'theretailer_nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
$this->output[$this->mega_colopt] .= $indent . '<li' . $id . $value . $class_names .'>';
$atts = array();
$atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : '';
$atts['target'] = ! empty( $item->target ) ? $item->target : '';
$atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : '';
$atts['href'] = ! empty( $item->url ) ? $item->url : '';
$atts = apply_filters( 'theretailer_nav_menu_link_attributes', $atts, $item, $args );
$attributes = '';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
$attributes .= ' ' . $attr . '="' . $value . '"';
}
}
$item_output = $args->before;
$item_output .= '<a'. $attributes .'>';
/** This filter is documented in wp-includes/post-template.php */
$item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
$item_output .= '</a>';
$item_output .= $args->after;
$this->output[$this->mega_colopt] .= apply_filters( 'theretailer_walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
function end_el( &$output, $item, $depth = 0, $args = array() ) {
if($depth > 0 ) {
$this->output[$this->mega_colopt] .= "</li>\n";
} else if(!$depth) {
$output .= $this->output['top'];
$output .= "</li>\n";
$this->output = array('col1' => '','col2' => '','col3' => '','col4' => '','full' => '', 'item' =>'','top' => '','sub' => '');
$this->colopt = '';
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment