Venetian Drop down submenus don’t work

Hi Dawn!

Sorry to hear that there are some problems getting your drop down menus to work as expected in our Venetian WordPress theme and our team will do everything we can to help!

Venetian is one of our Classic themes and uses an older version of our theme framework, which has the unfortunate downside of only being able to render drop downs for menus assigned to the Primary menu location. However we can change where the Primary menu location displays in your header using some custom PHP configurations.

My preferred tool to add custom PHP to websites is the Code Snippets plugin which makes it easy to add custom code without having to create a separate Child Theme. Once you have Code Snippets installed and activated, go to Snippets > Add New in your WordPress dashboard and add the following code to the new snippet.

function venetian_bottom_primary_nav( $configs ) {
    remove_action( 'venetian_columns' , 'venetian_columns' );
    $configs['template']['locations']['header'] = [
        '1' => [ '[menu]secondary' , '[action]venetian_branding_social' ],
        '5' => [ '[widget]boldgrid-widget-2' ],
        '8' => [ '[action]boldgrid_primary_navigation'],
    ];
    return $configs;
}

add_filter( 'boldgrid_theme_framework_config' , 'venetian_bottom_primary_nav' );

function venetian_branding_social() { ?>
    <div class="row">
		<div class="col-sm-4">
			<?php do_action( 'boldgrid_site_identity' ); ?>
		</div>
		<div class="col-sm-8">
			<div class="row">
				<?php do_action( 'boldgrid_menu_social' ); ?>
			</div>
		</div>
	</div>
<?php }

add_action( 'venetian_branding_social' , 'venetian_branding_social' );

That code moves the Primary menu location out of the original position and makes it display where the Below Header menu location used to. Once that code is implemented on your website just set your menu back to using the Primary location and it should display in the expected area.

One other thing you will need to do in order to maintain your current design is add some custom CSS as well that will center the menu in your header since the primary menu has a default setting that floats it to the right. The following CSS uses a Media Query to target only the Tablet and Desktop displays which are the screen sizes that expand the menu across the header instead of hiding it behind the mobile hamburger icon.

@media (min-width: 768px;) {
    #site-navigation {
        float: none;
        width: max-content;
        margin: 0 auto;
    }
}

I hope that this helps you get your drop down menus functioning in the correct location Dawn and please let us know if there is anything else that we can do to help!

Hi Dawn!

I think what is going on with the Code Snippets is that some of the symbols used to display the code in the HTML for my response might not have translated over as expected when copied directly into the snippet form.

We have an alternative way of embedding code and hopefully this one translates into the Code Snippets plugin easier:

The custom CSS included in my previous message can be added with the Custom CSS configuration found under the Advanced section of the Customizer. The following guide from our support center provides some more in depth information on how to access those controls as well.

https://www.boldgrid.com/support/boldgrid-themes/how-to-use-the-custom-css-editor/

The only thing you will need to do once the snippet is activated and the custom CSS code is  added is reassign your website navigation menu to use the Primary menu location instead of the current Below Header setting. You can change the menu location assignment by Opening up the Customizer and navigating to the Menus section and selecting the menu that you want to change the location assignment for.

Hopefully the alternative code sharing solution helps you gets the snippet working as expected Dawn and please let us know if you have any other questions for us!

Hi Dawn!

I reworked the code snippet slightly to use a different configuration to change the priority assignments for the filters that might give us some more favorable results.

I also reviewed the CSS code that I previously sent and there was a typo in the beginning of the media query. Here is the updated code for that:

If there are still problems getting the code to work correctly after trying these new configurations could you create a Premium Support ticket with our team so we can get started on investigating the problem more thoroughly?

Thank you for your understanding throughout this whole process Dawn!

Hi Dawn-

Thanks for the update, I’m sorry to hear that we still haven’t got you set up.

I definitely understand the frustration, you’re right that drop-down menus are a normal part of any WordPress Theme, and they do work with Venetian out-of-the-box, but not in custom locations like this.

I do want to point out that as a Web Hosting Hub customer, your BoldGrid Premium membership is included in your hosting subscription, and you don’t need to pay extra, either for Premium Support or any premium BoldGrid products.

We’re happy to help you get this working through a Premium Support Ticket and it won’t be of any cost to you. (Just be sure to log in with the email address associated with your Hub account)

• This reply was modified 3 years, 4 months ago by Jesse Owens. Reason: note Hub email address for premium support