class Rst_Custom_Navigation extends Walker_Nav_Menu {
function display_element($element, &$children_elements, $max_depth, $depth = 0, $args = [], &$output = '') {
// Check if current element has children
$element->has_children = !empty($children_elements[$element->ID]);
// Continue the normal walker process
parent::display_element($element, $children_elements, $max_depth, $depth, $args, $output);
}
function start_el( &$output, $item, $depth = 0, $args = null, $id = 0 ) {
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes = array_diff($classes, ['menu-item-has-children']);
/*
$classes1 = array();
$classes1[] = 'menu-item';
$classes1[] = 'menu-item-' . $item->ID;
*/
if (!empty($item->has_children)) {
$classes[] = 'rst-menu-item-has-children';
}
$mega_menu = get_field('mega_menu',$item);
if($mega_menu){
$classes[] = 'has-submenu-mega-menu';
}
$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
$id = 'menu-item-'. $item->ID;
$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
$promotion = get_field('promotion',$item) ? get_field('promotion',$item) : 'current';
$href = !empty($item->url) ? $item->url : '#';
$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( 'nav_menu_link_attributes', $atts, $item, $args, $depth );
$attributes = '';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
$attributes .= ' ' . $attr . '="' . $value . '"';
}
}
$output .= '<li' . $id . $class_names .'>';
$output .= '<a' . $attributes . '>';
$output .= esc_html( $item->title );
$output .= '<svg class="icon_link" width="10" height="10" viewBox="0 0 10 10" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.96875 0.375C9.32422 0.375 9.625 0.675781 9.625 1.03125V7.59375C9.625 7.97656 9.32422 8.25 8.96875 8.25C8.58594 8.25 8.3125 7.97656 8.3125 7.59375V2.61719L1.99609 8.93359C1.72266 9.20703 1.3125 9.20703 1.06641 8.93359C0.792969 8.6875 0.792969 8.27734 1.06641 8.03125L7.38281 1.71484L2.40625 1.6875C2.02344 1.6875 1.75 1.41406 1.75 1.03125C1.75 0.675781 2.02344 0.375 2.40625 0.375H8.96875Z" fill="#E32838"/></svg>';
if ( in_array( 'rst-menu-item-has-children', $classes ) ) {
$output .= ' <span class="submenu-icon"><svg width="13" height="9" viewBox="0 0 13 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.5625 8.03516L5.88867 7.36133L1.20117 2.67383L0.527344 2L1.875 0.681641L2.51953 1.35547L6.5625 5.36914L10.5762 1.35547L11.25 0.681641L12.5684 2L11.8945 2.67383L7.20703 7.36133L6.5625 8.03516Z" fill="#C7202F"/></svg></span>';
}
$output .= '</a>';
ob_start();
if($mega_menu){
?>
<div class="rst-mega-menu-container">
<div class="rst-mega-menu-container-inner">
<div class="rst-mega-menu-left">
<div class="rst-mega-menu-left-inner">
<div class="rst-mega-menu-left-inner-heading">
Emergency Services
</div>
<?php
$emergency_services = get_field('emergency_services','option');
if(is_array($emergency_services) && !empty($emergency_services)){
?>
<div class="rst-mega-menu-left-inner-content">
<h3><?php echo $emergency_services['title']; ?></h3>
<p><?php echo do_shortcode($emergency_services['description']); ?></p>
<?php
if(get_field('phone','option')){
?>
<a href="tel:<?php echo get_field('phone','option'); ?>">Call Now</a>
<?php
}
?>
</div>
<?php
}
?>
</div>
</div>
<div class="rst-mega-menu-center">
<div class="rst-back-menu">
<span>BACK</span>
<svg width="13" height="9" viewBox="0 0 13 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.5625 8.03516L5.88867 7.36133L1.20117 2.67383L0.527344 2L1.875 0.681641L2.51953 1.35547L6.5625 5.36914L10.5762 1.35547L11.25 0.681641L12.5684 2L11.8945 2.67383L7.20703 7.36133L6.5625 8.03516Z" fill="#C7202F"/></svg>
</div>
<?php
}
$output .= ob_get_clean();
}
function end_el( &$output, $item, $depth = 0, $args = null, $id = 0 ) {
ob_start();
$mega_menu = get_field('mega_menu',$item);
$promotion = get_field('promotion',$item) ? get_field('promotion',$item) : 'current';
if($mega_menu){
?>
</div>
<div class="rst-mega-menu-right <?php echo $promotion == 'current' ? 'promotion-current' : 'promotion-featured'; ?>">
<div class="rst-mega-menu-right-inner">
<?php
if($promotion == 'featured'){
$featured_promotion = get_field('featured_promotion','option');
if(is_array($featured_promotion) && !empty($featured_promotion)){
?>
<span>Featured Promotion</span>
<h3><?php echo $featured_promotion['title']; ?></h3><p><?php echo $featured_promotion['description']; ?></p>
<?php
if($featured_promotion['promo_code']){
?>
<a href="#footer" data-promo="<?php echo $featured_promotion['promo_code']; ?>" class="use-promo-code">
<svg width="13" height="15" viewBox="0 0 13 15" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5 10.375C10.9648 10.375 11.375 9.99219 11.375 9.5V3.92188C11.375 3.8125 11.3203 3.70312 11.2383 3.62109L9.37891 1.76172C9.29688 1.67969 9.1875 1.625 9.07812 1.625H6.125C5.63281 1.625 5.25 2.03516 5.25 2.5V9.5C5.25 9.99219 5.63281 10.375 6.125 10.375H10.5ZM11.8398 2.99219C12.0859 3.23828 12.25 3.59375 12.25 3.92188V9.5C12.25 10.4844 11.457 11.25 10.5 11.25H6.125C5.14062 11.25 4.375 10.4844 4.375 9.5V2.5C4.375 1.54297 5.14062 0.75 6.125 0.75H9.07812C9.40625 0.75 9.76172 0.914062 10.0078 1.16016L11.8398 2.99219ZM1.75 4.25H3.5V5.125H1.75C1.25781 5.125 0.875 5.53516 0.875 6V13C0.875 13.4922 1.25781 13.875 1.75 13.875H6.125C6.58984 13.875 7 13.4922 7 13V12.125H7.875V13C7.875 13.9844 7.08203 14.75 6.125 14.75H1.75C0.765625 14.75 0 13.9844 0 13V6C0 5.04297 0.765625 4.25 1.75 4.25Z" fill="#1B459B"/>
</svg>
<span>Use Promo Code: </span>
<?php echo $featured_promotion['promo_code']; ?>
</a>
<?php
}
}
?>
<a href="#footer" data-code="<?php echo $featured_promotion['title']; ?>" class="get_this_deal">Get this deal</a>
<?php
}else{
$current_promotion = get_field('current_promotion','option');
if(is_array($current_promotion) && !empty($current_promotion)){
?>
<span>Current promotion</span>
<h3><?php echo $current_promotion['title']; ?></h3>
<p><?php echo $current_promotion['description']; ?></p>
<?php
if($current_promotion['image']){
?>
<img src="<?php echo $current_promotion['image']; ?>" alt="" />
<?php
}
?>
<?php
}
}
?>
</div>
</div>
</div></div>
<?php
}
$output .= ob_get_clean();
$output .= '</li>';
}
function start_lvl( &$output, $depth = 0, $args = null ) {
$output .= '<ul class="sub-menu">';
}
function end_lvl( &$output, $depth = 0, $args = null ) {
$output .= '</ul>';
}
}
function custom_wp_nav_menu_shortcode($atts) {
$atts = shortcode_atts(
array(
'menu' => '',
'container' => 'div',
'container_class' => 'rst-main-menu-container',
'menu_class' => 'menu',
),
$atts,
'smo_nav_menu'
);
if (!empty($atts['menu'])) {
return wp_nav_menu(array(
'menu' => $atts['menu'],
'container' => $atts['container'],
'container_class' => $atts['container_class'],
'menu_class' => $atts['menu_class'],
'walker' => new Rst_Custom_Navigation(),
'echo' => false
));
}
}
add_shortcode('smo_nav_menu', 'custom_wp_nav_menu_shortcode');
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter