Full width menu
-
Hi
Is there any way to allow the top menu to use the full width of the page? At the moment, if the menu reaches the right sidebar it wraps onto a second line. The current menu has been limited to prevent this happening, bu we many want to add more items in the future and it would be good not to have it wrapping.
Thanks
Ian
The page I need help with: [log in to see the link]
-
Hi Ian,
I presume you’re referring to the main navigation menu? Unfortunately, I can’t see your site. I simply get your Coming Soon page.
There are two functions within Ephemeris that display the Logo container and the Nav Menu container. These functions are called
ephemeris_logo_grid()andephemeris_nav_grid(), respectively.The Logo container is 40% width and the Nav container is 60%. If you want to increase the size of the nav container, you have a couple of options.
– Start by copying the
ephemeris_logo_grid()andephemeris_nav_grid()functions fromfunctions.phpin Ephemris, into thefunctions.phpin your child theme. (don’t include the “if ( ! function_exists(…” line. Just copy the function itself. i.e. “function ephemeris_nav_grid() {…..}”)You can either:
– Decrease the size of the Logo container by changing the class names in
ephemeris_logo_grid(). e.g. change the classes fromgrid-40 tablet-grid-40togrid-20 tablet-grid-20
– Increase the size of the Nav Container by changing the class names inephemeris_nav_grid(). e.g. change the classes fromgrid-60 tablet-grid-60togrid-80 tablet-grid-80This would give you 20% container for the Logo and 80% container for the Nav.
Or, you could increase both containers to 100%:
– Increase the size of the Logo container by changing the class names in
ephemeris_logo_grid(). e.g. change the classes fromgrid-40 tablet-grid-40togrid-100 tablet-grid-100
– Increase the size of the Nav Container by changing the class names inephemeris_nav_grid(). e.g. change the classes fromgrid-60 tablet-grid-60togrid-100 tablet-grid-100When you copy those two functions (
ephemeris_logo_grid()andephemeris_nav_grid()) into your child theme, they will override the functions within Ephemeris.Thanks for the detailed response Anthony. Yes we are pre-launch now so the site has been put into ‘Coming Soon’ mode.
I’ll have a look at the functions.php. I’m not sure I will be allowed to amend the file directly, even in a child theme, as this is a managed wordpress hosting package. Hopefully I’ll be allowed to do so in a child theme.
Ian
Hi Ian,
“Managed WordPress hosting” usually just means that they look after your site updates and backups for you. You should be able to still edit your own child theme files.
Of course, when you’re making changes like this though, it’s always best to test them on a development or staging domain first, rather than making them directly on the live website.
Thanks Anthony, that has worked perfectly.
Thanks again for your prompt assistance.
Ian
That’s not a problem 🙂
One more question, sorry. The menu seems to be right justified now, how do I make it align to the left of the page?
Thanks
Ian
Ignore that, I’ve resolved it thanks.
Ian
The topic ‘Full width menu’ is closed to new replies.
