[infonet]

Hello,

I currently have the following disposal :
logo (= header image) then main menu then secondary menu, empiled

Is there a way to have main menu then logo then secondary menu ?

Either by inserting a menu in the header ?
Either by inserting an image between main menu and secondary menu ?

Thanks in advance for your help.
Best Regards
Marc

[tikaram]

@infonet : Please post in your site URL.

Regards,
Tikaram

[Mahesh]

@infonet: For this, you’ll need to create child theme. You can find more about creating child theme HERE. Then in your child theme’s functions.php, add the following code.

function catchbox_main_header_image_position() {
	// Getting data from Theme Options
	$options  = catchbox_get_options();
	$position = $options['header_image_position'];

	if ( 'above' == $position ) {
		add_action( 'catchbox_child_after_primary_menu', 'catchbox_main_header_image', 10 );
	}
	elseif ( 'below' == $position ) {
		add_action( 'catchbox_after_headercontent', 'catchbox_main_header_image', 10 );
	}
}

function catchbox_header_menu() {
    //Getting Ready to load options data
    $options = catchbox_get_options();
    $classes = "mobile-menu-anchor page-menu";

    // Header Left Mobile Menu Anchor
    if ( has_nav_menu( 'primary' ) ) {
        $classes = "mobile-menu-anchor primary-menu";
    }
    ?>
    <div class="menu-access-wrap mobile-header-menu clearfix">
        <?php if ( empty ($options['disable_responsive'] ) ) { ?>
            <div id="mobile-header-left-menu" class="<?php echo $classes; ?>">
                <?php
                $hide_mobile_menu_labels = isset( $options['hide_mobile_menu_labels'] ) ? $options['hide_mobile_menu_labels'] : 0;

                $label = isset( $options['primary_mobile_menu_label'] ) ? $options['primary_mobile_menu_label'] : esc_html__( 'Menu', 'catch-box-pro' );

                $labelclass = "mobile-menu-text";

                if ( !empty ( $hide_mobile_menu_labels ) ) {
                    $labelclass = "screen-reader-text";
                }
                ?>
                <a href="#mobile-header-left-nav" id="menu-toggle-primary" class="genericon genericon-menu">
                    <span class="<?php echo esc_attr( $labelclass ); ?>"><?php echo esc_attr( $label ); ?></span>
                </a>
            </div><!-- #mobile-header-left-menu -->

            <?php
            if ( !empty ($options['enable_sec_menu'] ) && has_nav_menu( 'secondary', 'catch-box-pro' ) ) :
                    $menuclass = "mobile-enable"; ?>
                    <div id="mobile-header-right-menu" class="mobile-menu-anchor secondary-menu">
                        <?php
                        $hide_mobile_menu_labels = isset( $options['hide_mobile_menu_labels'] ) ? $options['hide_mobile_menu_labels'] : 0;
                        $label = isset( $options['secondary_mobile_menu_label'] ) ? $options['secondary_mobile_menu_label'] : esc_html__( 'Secondary Menu', 'catch-box-pro' );
                        $labelclass = "mobile-menu-text";
                        if ( !empty ( $hide_mobile_menu_labels ) ) {
                            $labelclass = "screen-reader-text";
                        }
                        ?>
                        <a href="#mobile-header-right-nav" id="menu-toggle-secondary" class="genericon genericon-menu">
                            <span class="<?php echo $labelclass; ?>"><?php echo esc_attr( $label ); ?></span>
                        </a>
                    </div><!-- #mobile-header-right-menu -->
                <?php else :
                    $menuclass = "mobile-disable";
                endif; ?>
        <?php } ?>

        <div id="site-header-menu-primary" class="site-header-menu">
            <nav id="access" class="main-navigation menu-focus" role="navigation" aria-label="<?php esc_attr_e( 'Primary Menu', 'catch-box-pro' ); ?>">
                <h3 class="screen-reader-text"><?php _e( 'Primary menu', 'catch-box-pro' ); ?></h3>
                <?php
                    if ( has_nav_menu( 'primary', 'catch-box-pro' ) ) {
                        $args = array(
                            'theme_location'    => 'primary',
                            'container_class'   => 'menu-header-container',
                            'items_wrap'        => '<ul class="menu">%3$s</ul>'
                        );
                        wp_nav_menu( $args );
                    }
                    else {
                        echo '<div class="menu-header-container">';
                            wp_page_menu( array( 'menu_class'  => 'menu' ) );
                        echo '</div>';
                    }
                ?>
            </nav><!-- #access -->
        </div><!-- .site-header-menu -->

        <?php do_action( 'catchbox_child_after_primary_menu' ); ?>

        <?php if ( has_nav_menu( 'secondary' ) ) { ?>
            <div id="site-header-menu-secondary" class="site-header-menu">
                <nav id="access-secondary" class="<?php echo $menuclass; ?>"  role="navigation" aria-label="<?php esc_attr_e( 'Secondary Menu', 'catch-box-pro' ); ?>">
                    <h3 class="screen-reader-text"><?php _e( 'Secondary menu', 'catch-box-pro' ); ?></h3>
                    <?php wp_nav_menu( array( 'theme_location'  => 'secondary', 'container_class' => 'menu-secondary-container' ) );  ?>
                </nav><!-- #access-secondary -->
            </div><!-- .site-header-menu -->
        <?php } ?>
    </div><!-- .menu-access-wrap -->
<?php
}

function catchbox_child_remove_header_action(){
	remove_action( 'catchbox_before_headercontent', 'catchbox_main_header_image', 10 );
}

add_action( 'init', 'catchbox_child_remove_header_action' );

Note: Please make sure “Above Header Content” is selected in Header Image Location

Regards,
Mahesh

[infonet]

Thanks Mahesh, it works perfectly 🙂

[Mahesh]

@infonet: I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
https://wordpress.org/support/theme/catch-box/reviews/#new-post
Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated.
Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know.

Regards,
Mahesh

[Derek Batty]

Hi Mahesh or anyone else

I was wanting to do what has been done with this above post.

That is move my primary menu above the site logo or header area and then have my secondary menu appear below site logo or header area.

As you can see they currently sit on top of each other and want to separate them, one above logo and secondary below, where it currently appears although we have called it a Navigation Menu.

Appreciate your help

https://theancientpathways.com

Regards

Derek

[tikaram]

@dbatty : This option is not available from theme options. You will need to download the child theme from this link. Open the functions.php file which is inside the child theme folder and add the following lines of code and save the file.

function catchresponsive_child_primary_nav_above_logo_header_image() {
  remove_action( 'catchresponsive_after_header', 'catchresponsive_primary_menu', 20 );
  add_action( 'catchresponsive_header', 'catchresponsive_primary_menu', 25 );
}
add_action( 'init', 'catchresponsive_child_primary_nav_above_logo_header_image' );

Login to your WordPress Dashboard and upload the child theme and activate the child theme. The primary menu should move above the logo or header part. Let me know if you need further assistance.

Regards,
Tikaram

[Author]

Posts