Shop Categorie Menu Bar

Hi,

we use theme x in our shop. Please have a look at this link: https://shop.norbert-kloiber.at/

On the whole page we have a additional menu bar for our shop categories directly under the page header.
This one a programmer implemented for us.

Now the issue is, it is not update secure. When we make the actually theme update, the bar disapears.
The menu bar elements we can set up in the default menu controlpanel in the theme area…

Can you please give us a help, how we can set up such a menu bar with onboard tools or with a plugin so that is is update secure and flexible?

Thanks a lot!
Helmut

Hi there,

Thank you for your message. Please kindly consider that this is a customization request which is outside of our support scope. We will not be able to implement such a functionality for you or maintain the suggested codes in the future, but we will do our best to get you started with this and guide you to the right direction.

First of all, you need to update the theme and Cornerstone to the latest version.

Then, you need to install the Child Theme. That will make sure that the changes will be future proof. It may need few adjustments in a case that the overridden files changes in the future which is an easy task.

You will find a file called functions.php in the child theme which you will need to add the code below to the very end of it:

function register_secondary_menu() {
  register_nav_menu('secondary-menu',__( 'Secondary Menu' ));
}
add_action( 'init', 'register_secondary_menu' );

The code above adds a new menu location called Secondary Menu which you can use to assign your additional menu to it from Appearance > Menus:

Now that you have the menu location available and you assigned a menu to it, you need to show it below the header. To do so you need to override the file responsible for the navigation from the parent theme and add a piece of code to it. The file that you need to copy to your child theme is located here:

wp-content/themes/x/framework/legacy/cranium/headers/views/global/_navbar.php

Copy the file above to:

wp-content/themes/x-child/framework/legacy/cranium/headers/views/global/_navbar.php

If you do not see the folders of the above path in the Child Theme you need to create those folders.

Now, at the very end of the _navbar.php file add the code below:

<?php wp_nav_menu( array( 'theme_location' => 'secondary-menu', 'container_class' => 'x-nav' ) ); ?>

The code above instructs the theme to add whatever menu is set to the Secondary Menu location after the main menu.

The view in the front end will be a plain view because there is no CSS styling assigned to this new menu.

That is why you need to add the CSS code below to X > Launch > Options > CSS or to the style.css file of your Child Theme:

.x-nav ul {
    list-style: none;
    display: flex;
    flex-flow: row wrap;
    margin: 10px 0;
    align-items: center;
}

.x-nav ul li {
    margin: 0 10px;;
}

I’m sure you will understand that additional styling and customization of this additional menu will be on your shoulders.

Thank you for your understanding.

Hi,

thank you very much for your help! I will give this a programmer that can implement it for us. Good to know that we have now a update secure way.

Thanks!!!
Helmut

You’re welcome, Helmut.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.