This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Moving the Main Menu from below logo to beside logo

  • Creator
    Topic
  • #1235
    sharonq
    Participant

    Jason:

    Can you give me some insight into how the menu location works. I would like to move the main menu up beside the header into the themeblvd_header_addon area.

    Do I do this by moving: themeblvd_header_content_default from themeblvd_header_menu to themeblvd_header_addon (and if so how…)

    or do I move the themeblvd_header_menu into the space where there currently is themeblvd_header_addon ? (and again – how would I do that?)

    or is there better way to move the menu?

    Hooks reference (just so I remember who goes where)

    themeblvd_header_content
    – Description: Main content area of the header, default function calls themeblvd_header_logo and themeblvd_header_addon here.
    – Default function: themeblvd_header_content_default
    themeblvd_header_logo
    – Description: Website logo, called in themeblvd_header_content by default.
    – Default function: themeblvd_header_logo_default
    themeblvd_header_addon
    – Description: Additional area within default themeblvd_header_content.
    – No default hooked function by framework
    themeblvd_header_menu
    – Description: Main menu below content of header.
    – Default function: themeblvd_header_content_default

Viewing 9 replies - 1 through 9 (of 9 total)
  • Author
    Replies
  • #1237
    Jason Bobich
    Keymaster

    There are several ways you could accomplish it, but there’s not going to be any simple 1-steppers that are going to put the menu exactly where you want it. You need to hook the menu where you want and then style it to work in that location.

    If you’re uncomfortable creating your own function that contains wp_nav_menu to output your menu location, you could just use the theme’s default function and move it.

    You can look at the action map, but I’d imagine the logical place to put it would be the “themeblvd_header_addon” hook.

    // Remove default menu from "themeblvd_header_menu" action
    remove_action( 'themeblvd_header_menu', 'themeblvd_header_menu_default' );
    
    // Add default menu function to "themeblvd_header_addon" action
    add_action( 'themeblvd_header_addon', 'themeblvd_header_menu_default' );

    But that’s just going to get the HTML markup in the right place. From there, you’re still going to have to style everything to be positioned where you want with CSS.

    #1238
    Jason Bobich
    Keymaster

    From looking at what you’re pasting, it appears there’s a typo in the documentation:

    themeblvd_header_menu
    – Description: Main menu below content of header.
    – Default function: themeblvd_header_content_default

    The default function listed there should be “themeblvd_header_menu_default” — That may be where your confusion is coming from I think.

    #1245
    sharonq
    Participant

    Thank you Jason – that is what I needed to know (and you were right – that was what was confusing me).

    Your menu is working fine beside the logo – though when I switch to UberMenu it adds a background that fills the full width and height of the header and covers the logo – I’ll check in with the menu dev to see if I can sort out the CSS to fix it.

    Sharon

    #1246
    sharonq
    Participant

    Looking deeper the problem might be with ‘#Access” that seems to be styling the header background to match the background of the menu. I now have Ubermenu turned off and my header area background is white the same as the menu – the menu looks fine if the background is transparent but seems to pick up the background of the menu.

    This is the html:

    <a href="http://teamsfirst.ca">Home</a>
    <a href="#">Search For<i></i></a>
    
    	<a href="#">Activities<i></i></a>
    	
    		<a href="http://backup.teamsfirst.ca/find-an-indoor-program/">Indoor Activity</a>
    		<a href="http://backup.teamsfirst.ca/find-an-outdoor-program/">Outdoor Activity</a>
    		<a href="#">Leadership Activity</a>
    	
    
    	<a href="#">Development<i></i></a>
    	
    		<a href="#">Leadership Development</a>
    		<a href="#">Team Startup</a>
    		<a href="#">Assessment</a>
    	
    
    	<a href="#">Virtual Teams<i></i></a>
    	
    		<a href="#">Intranet Resources</a>
    		<a href="#">Aps and Websites</a>
    	
    
    	<a href="http://backup.teamsfirst.ca/venues/">Venues<i></i></a>
    	
    		<a href="#">Hotels</a>
    		<a href="#">Conference Centre</a>
    		<a href="#">Exotic Destinations</a>
    	
    
    	<a href="#">Event Management<i></i></a>
    	
    		<a href="#">Event Managers</a>
    		<a href="#">Facilitators</a>
    		<a href="#">Large Group Activities</a>
    		<a href="#">Keynotes</a>
    	
    
    	<a href="#">Learning<i></i></a>
    	
    		<a href="#">Learning</a>
    		<a href="#">Webinars</a>
    		<a href="#">Workshops</a>
    		<a href="#">Books</a>
    	
    
    
    
    <a href="http://backup.teamsfirst.ca/contact-us-2/">Contact Us</a>
    <a href="#">News<i></i></a>
    
    	<a href="http://backup.teamsfirst.ca/category/front_page/">News</a>
    
    
    <a href="http://backup.teamsfirst.ca/wp-login.php?action=logout&_wpnonce=375851834c">Log Out</a>

    How do I tell “access” to stay within themeblvd_header_addon? It seems to want to add a background to the header container.

    • This reply was modified 7 years, 9 months ago by sharonq.
    #1247
    sharonq
    Participant

    I am working on my development site: http://backup.teamsfirst.ca/

    • This reply was modified 7 years, 9 months ago by sharonq.
    • This reply was modified 7 years, 9 months ago by sharonq.
    #1251
    sharonq
    Participant

    These are the DIVs that seem to impact:

    I can see that access is linked to Navigation – which makes sense except how to I tell access where the menu is?
    Is there a doc that talks about access?

    
    
    
    
    
    
    
    
    
    
    
    </div
    #1291
    sharonq
    Participant

    Just to close the loop – in case anyone else is trying to create a menu beside the header. I needed adjust the #access CSS to match the contatainer:

    #access: {
    min-width: 600px;
    max-width: 600px;
    float: right; }

    For some reason this did not work at the end of style.css but it did work when I added it to the existing #access

    #1295
    Jason Bobich
    Keymaster

    Possibly because you have a colon after the “#access” selector?

    It should be:

    #access {
    	min-width: 600px; 
    	max-width: 600px;
    	float: right; 
    }
    #1317
    sharonq
    Participant

    (smacks head… that could be the problem….) Perhaps it is time for new glassess…

Viewing 9 replies - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.