Need to move navigation menu

Hi There, thanks so much for your help guys.
Sorry for the delay, I’ve gone from Hawaii, LA, to Colombia the past few days in transit.

@dayley the menu is set to main/primary so I wasn’t able to use your advice on this.

I put the code that @binarywc mentioned into CSS and it worked.

You were correct that I wanted the menu below the header image, but at least right now it is not behind it.

It is only a little problem and I wouldn’t move to a completely new theme. However, in the future (months/years away) I would like to move to a different theme.

If you can let me know further coding to move the menu below the header image that would be great.
As mentioned though, I’m just glad it’s not behind the header image anymore.

Thanks so much, @binarywc.

Kind Regards
Tracey

Glad to know you are a little further to resolving your website issues.
Although Davood’s method has only fixed a small part of your menu. Have you looked how it views on android mobiles, iPhones, iPad or tablets? You still have the original menu (but as a toggle menu) that is *cough* still *cough* hidden behind things, and incorrectly placed in the upper right corner, and also a side menu which is suppose to replace the original menu. Which requires more CSS.

And as I mentioned before Davood when your commented that I misunderstood the question, she did state she wanted the menu placing underneath the image.
Your code only adds a margin and doesn’t fix the problems. So what were you doing during those 20 years of web developing man?? XD

Lets get started. Add this in your child theme’s style.css:

/*-------------------------------------------------------------------
This hides the original menu on screen sizes less than 782px
-------------------------------------------------------------------*/
@media screen and (max-width: 782px) {
       	   .menu-toggle {
       		display: none;
       	}

/*-------------------------------------------------------------------
This displays the megamenu's sidebar on screen widths up to 782px
-------------------------------------------------------------------*/
           .shiftnav,
           #shiftnav-toggle-main {
       		display: block;
       	}

}

Now, in regards to moving your menu below the header image in the twentysixteen theme, I am going to point you to this thread where someone has asked the exact same question: https://en.forums.wordpress.com/topic/changing-the-position-and-style-of-the-menu-of-twenty-sixteen-theme/

And people have provided the exact same answer as to what I replied earlier. Which was “Choosing a theme with a menu below the header would be a better option than tampering with the theme itself”

There is still MANY things you can do with you menu above though… Try having a play and see what looks best. No doubt you can change most of this inside the actual MegaMenu settings, but incase you want to have a go with some css here are a few tweaks you could try:

/*-------------------------------------------------------------------
Makes the header width 100% of the available width
-------------------------------------------------------------------*/
.site-header-menu {
    width: 100%;
}

Try adding some more like:

color: blue; to change font colours
background: red; to change background colours
text-align: left; aligns the text to the left, right, centre etc
border: 1px solid green; to add a 1 pixel solid border around your object
border-radius: 10px; to curve and smoothen the edges of objects
margin: 10px 2% 10px 2%; to add 10 pixels to the top and bottom, and 2% to the left and right
margin-left: 8px; to add a margin only to the left
and there are many more….

Hope this helps! Let us know how it goes.

I knew that @dayley and had planned to provide a solution for mobile once my code was implemented. I think you still missed the overarching points of what I was saying but that’s okay. Thanks for providing the mobile friendly fix.

that saved me sometime.

Happy to help anyone anytime @askteetravel that’s what the support forum is here for.

And you see my point about the theme changing instead of theme menu replacing? If others are saying the same as myself, then surely that leans towards what I was saying to be correct.

No, because it is still unnecessary to change themes when all they need to do is make some css changes to make the menu work correctly on all devices.

Again, it is one problem they needed fix. So your point makes no sense. Also, this is not a consulting forum but a support forum.

If this was an UpWork job or the someone had contacted me directly through word of mouth then I would be advising they change themes because I would be doing that work for them if they decided to proceed with that suggestion and then I would be able to make some money off of it. People come here for the quickest free fix. Typically, that involves some CSS code.

I am talking about removing the menu from its theme location and replacing it in another location. It would be better to choose a theme that has already got a menu under the header image than to alter the theme itself! Did you look at the forum link I sent??

Someone is using the exact same twentysixteen theme as @askteetravel, they have asked the exact same question about moving the menu below the header image, and someone has provided the exact same reply as to what I provided. It is better not to alter the themes structure, but better to choose a different theme that facilitates.

What is best and what the user wants are two different things.
Yes, @askteetravel wanted it below the image and I did miss that in @askteetravel’s original post. However, this still remains a support forum… not a consulting forum. So telling them to change a theme over one problem when they are perfectly happy with the theme they are using and have only one issue is not the answer they are looking for… the CSS fix however is the fix they are looking for.

I disagree completely!
From an experienced developer, the best option *IS* what you should offer the user! – Would you offer the user a terrible way of doing things because “it is what they want”? That is madness!

You misread the question, you only provided half a solution, and your willing to provide bad fixes if it’s “what the user wants”. #DeveloperOfTheWeek!

I repeat, it is quite unlikely that @askteetravel came here looking to be told to switch themes and my method when I provide support here in the wp.org board even when I don’t miss the full question is to provide the fix for desktop then when the user implements it provide the fix for mobile if they are still looking for it. Therefore, this is not *cough* madness *cough* because they could have changed themes without coming here and asking the question. Again, the user was having one problem with the theme otherwise they were happy with it. Providing a CSS fix is the best solution in this case, unless they are looking for a consultant who they want to pay hourly to fix problems when they arise.

Half of a fix is not a bad fix. The bad fix occurs when the person trying to provide a fix misreads or does not completely read the problem! In this case, that was my mistake. I did not fully read the problem and what was desired. That said, your original solution of using the secondary menu would not have actually resolved the issue either.

With all that said, I am leaving this thread now and I hope you now see why I suggested that you look at the code before providing a solution because in fact this *cough* madness *cough* was actually caused by you also not fully understanding/reading the question and providing a useless fix. So it is quite disrespectful for you to be calling me out for providing a bad solution.

• This reply was modified 6 years, 4 months ago by Davood Denavi.
• This reply was modified 6 years, 4 months ago by Davood Denavi.
• This reply was modified 6 years, 4 months ago by stephencottontail.

@dayley, @binarywc

Both of you take a deep breath and count to 10. The problem has been fixed; no need to keep coughing at each other.

Opened again. Hope everyone has had time to take some deep breaths.

I sure did. I think @dayley has this from this point and can help @askteetravel with any further questions. I have turned off notifications and will not be replying any more.

• This reply was modified 6 years, 4 months ago by Davood Denavi.

*Deep breath taken!* aaaaaand exhale. – Thanks @stephencottontail

In my first reply

I believe your Menu ‘may’ be set as a secondary menu

the keyword which I also semi-quoted was the word ‘may’. Meaning it may or may-not be set as a secondary menu, but if so, then I provided the solution. (Nope, not half a solution, a full solution!)

Look, the user asked 2 questions. And wanted to resolve both.
You provided half the resolution for 1, and I provided the other half for it. I also informed the user on the best option from an experienced developers point of view, which would be to choose a theme that facilitates her requirements, which many other developers around the world agree as they have provided the same advice.

But, I guess myself and those many other developers are wrong about this… and only you are correct.

I decided to check back and see if @askteetravel had any further questions and I see you have completely missed the point I made about checking the code first…because it is clear by looking at the code that the menu is NOT set as the secondary menu. Also, you are sorely mistaken. It is not the case that other developers are wrong and I am the only one who can be right.