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.