Hello,
For some reason, the menu bars it’s always highlighted on the “contact” section, even when im on Home or any other area.
This is a new error; it was ok until this morning.
Any idea how to fix this?
Thank you in advance for your prompt response.
Regards,
Hello @LuzFer,
Thanks for asking. 
Can you please share website URL for us to take closer look?
Thanks.
Of course!
Please find in on a secure note.
Also, since I’m not able to place the logo in the middle of the nav bar, I want to change the look of it, as I don’t like at all the way it is right now.
This is how it looks rigth now:
And this is how I want it to look:
As you can see, I want to add the menu and social icon all on the top bar, eliminating the menu bar as it is right now.
Please consult the referential pictures attached, as I wrote notes there to be more clear.
Let me know if you have any questions.
Regards,
Hi There,
As you have a mixed menu between One Page Menu - Since your contact is part of your home page. - and multi page menu, you will need to create two menus on Appereance > Menus
1- You already have it, where the contact page has the full link :
http://wandersoulwanderlust.com/#Contact
2- You will create another menu that is exactly the same, but instead of linking the contact menu item with the whole URL you will use just #Contact
Once you do that, go to your home page, click edit page on WP top admin bar and select this new menu you have created as your One Page Menu.
Hope it helps!
Hello, Joao,
No, this didn’t help at all.
1st of all, most of my questions have not been answered nor address at all.
Please, read my previous message, I will copy it here once again, hoping this time it will get address…
PREVIOUS MESSAGE:
Also, since I’m not able to place the logo in the middle of the nav bar, I want to change the look of it, as I don’t like at all the way it is right now.
This is how it looks right now:
And this is how I want it to look:
As you can see, I want to add the menu and social icon all on the top bar, eliminating the menu bar as it is right now.
Please consult the referential pictures attached, as I wrote notes there to be more clear.
END OF the PREVIOUS MESSAGE
By the way, the current menu, the way it is linked right is with #contact no using the whole link, as you suggested.
Like I mentioned before, it was all good, this is a recent error, which it won’t matter anymore, as I want to place the whole menu on the top bar, to the right where the social media icons are.
Thank you once again,
Looking forward to your earliest reply.
Regards,
Hey there,
The header layout you want isn’t possible with X. It’s possible using Pro header builder or custom development.
I could not determine what is causing the current menu issue. I tested the same setup in my test site and it does not happen so something is wrong in your setup testing for a plugin conflict. You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.
Thanks.
Hello,
Where/how do I get the Pro Header Builder then?
Where/how do I delete the name form the menu bar?
Also, I have tested the plugin before written, is not that…
Looking forward to your earliest reply.
Regards,
Hi There,
The Wandersoul Wanderlust is the Site Title which you can change or remove under Settings > General
To remove the entire Navbar, you can add the following custom CSS on Theme Options > CSS
/*hide the navbar*/
.x-navbar-wrap {
display: none;
height: 0;
}
<ul class="x-nav x-nav-top left man">
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Home</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">About</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Memories</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Wander Blog</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Contact</a></li>
</ul>
Keep in mind that this is just a simple menu and further customization from here would fall outside of the support that we can offer, we can only provide custom CSS for cosmetic of it.
/*topbar menu styling*/
.x-topbar .x-nav li.menu-item {
float: left;
padding: 10px 20px;
}
/*topbar menu link colors*/
.x-topbar .x-nav li.menu-item a {color: black; font-weight: 600; }
.x-topbar .x-nav li.menu-item a:hover {color: white;}
/*wp generated empty tag fixed*/
p:empty {display: none;}
Hope this helps,
Cheers!
Hello Friech,
Thank you so much, that helped, at least got me closer to the look im after.
Just to follow up regarding the new menu:
Im trying to change the color, from black to brown, and the hoover from White to yellow, I tried to change it, but it didn’t work, like the colors for the Social Media icons.
How do I link this menu like the one I had before? As a 1-page Navigation Menu?
How/where do I get rid of the current menu?
Please see referential picture attached.
Looking forward to your earliest reply.
Regards,
Hi There,
Upon checking your website seems like you solved the issue.
The only thing I would sugestt is changing the hover color by adding the following code to Theme Options CSS
.x-topbar .x-nav li.menu-item a:hover {
color: red;
}
Hope it helps!
Hello,
What? No, not at all!!!
where do you see any of these issues been solved?
Im trying to change the color, from black to brown, and the hoover from White to yellow, I tried to change it, but it didn’t work, like the colors for the Social Media icons.
How do I link this menu like the one I had before? As a 1-page Navigation Menu?
How/where do I get rid of the current menu?
Please, pleaseee, I need to get this solve as soon as possible, NONE of the issues above has been solve, none!
Looking forward to your earliest reply.
Regards,
Hi there,
1 From the above CSS that you added, please change this CSS
.x-topbar .x-nav li.menu-item a {color: black; font-weight: 600; }
.x-topbar .x-nav li.menu-item a:hover {color: white;}
to this
.x-topbar .x-nav li.menu-item a {color: brown; font-weight: 600; }
.x-topbar .x-nav li.menu-item a:hover {color: yelow;}
You’re supposed to change that color according to your preference, they are only given as a sample.
2 This is given to you as an initial code and it’s up to you how you’ll modify it based on your preference.
<ul class="x-nav x-nav-top left man">
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Home</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">About</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Memories</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Wander Blog</a></li>
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#">Contact</a></li>
</ul>
Which, you’ll have to modify the URL to match your linking, example,
<li class="menu-item menu-item-type-custom menu-item-object-custom"><a href="#Contact">Contact</a></li>
You’ll see that I changed the URL for to #Contact matching your contact form section’s ID. And to enable smooth scrolling effect, please add this code to your global custom javascript as well.
jQuery( function($){
$(document).on('click', '.x-topbar .x-nav li.menu-item a[href^="#"]', function(e){
e.preventDefault();
$('html, body').stop().animate( { scrollTop:$( $(this).attr('href') ).offset().top }, 750 );
} );
} );
3 I don’t see any other menu, it’s just the top menu.
Thanks!
Hello Rad,
Thank you so much for such of detailed reply, I really appreciate it.
I followed all the instructions given, but new issues followed:
Please see referential picture attached:
I feel we are finally getting closer to solve this and I will be able to launch the site!
Thank you in advance for your prompt response.
Regards
Hi there,
I can’t really find that one, this is what I’m getting
Perhaps you can provide some instruction on how I can replicate your issue, or maybe you’re working on different URL?
Thanks.
Hello there,
It is exactly the same url, what you’re seeing shows only when you are not logged in.
When you log in and go the customise section it shows there.
Please log in, and go to customise, you will see the menu there.
Also, please do not overlook the other issue I have mentioned:
Thank you in advance for your prompt response.
Regards,
Hi there,
I’m logged in and as you can see from above screenshot, there is an admin bar indicating that I’m logged in. And here is the screenshot of customizer area.
I flush the cache and it still the same, and this is really weird. I’m not dodging your question , at least I need to check the issue first but I can’t do it as I’m seeing different view compared to your screenshots. Plus, I though you changed something because it doesn’t look like that before.
How about contacting your hosting provider and force the cache to be flushed. This is my first time seeing this kind of issue.
Thanks!
Hello, Rad,
Thank you, I can see you’re logged in, I’ll give the provider a call and see how that goes.
Again, that was just one out of 4 inquiries.
It is now three times Im writing regarding the same issue.
1. The list menu now shows “stack” one on top of the other one, instead of the “in line” list menu.
3 . None of the links works, only the contact one.
4. Please note the blog “Wander Blog” is a link to another page, this should open in a different page, no under the one-page navigation menu.
This has been taking way too long; everything should have been taken care of from mail one, the menu shows is only one of them!
And yes, it looks different because I followed your instructions, which generated the different issues.
could you please now go over the other three problems?
Thank you!
Hi There,
Sorry if this gets too long to resolve, part of this because my initial instructions above (5 days ago) was not really followed. Please see this screenshot on what did gone wrong there. That should answer your question #1 I did go ahead and resolve that by adding the missing bracket.
3 & 4) Well, One Page Menu only works on one page and that is your Home page. This won’t gonna work on other pages because the sections (#home, #about, #memories, #contact) are not present on other pages. With this said you need a different menu to for your other pages, and like I said above this is just a simple menu and further customization from here would fall outside of the support that we can offer.
I did put a comments on the provided CSS, you should able to identify which block of css is for which element. Feel free to change those color values.
If you can deactivate the caching while the site is still in development mode, that would be great. Cached are better enable only when you finish the site, because caching sometimes fools us, it does not show the changes we made immediately, same can be said to the browser’s cache. If you can’t deactivate the caching then clear it every-time you preview the site.
Hope this shed some lights,
Cheers!
Thank you so much for your help, I would of never catch those error, as don’t know anything about programming.
I understand what you are saying, regarding the one-page navigation menu, and its fine, my question now is:
Can I have the one single navigation page active ONLY on the home page, and hide them for ALL other pages?
I would use the page specific menu for the other pages; I understand it would look different.
How can I hide it from the rest of the website?
Thank you for all of your help!
Regards,
Hi There,
Ok, since that One Page Menu is not for all pages, please do not set that as your Primary menu (https://prnt.sc/gr3bvf)
Create a new menu or use any of your existing menu to be the Primary Menu instead, this would be the menu for your all pages except home page.
Now this is the the code that hides the navbar, right?
/*hide the navbar*/
.x-navbar-wrap {
display: none;
height: 0;
}
But now we only need to hide the navbar on homepage, so you need to update that to this:
/*hide the navbar*/
.home .x-navbar-wrap {
display: none;
height: 0;
}
On contrary we need to hide the Topbar Menu on all pages except homepage. In CSS that would be:
/*hide topbar menu except on homepage*/
body:not(.home) .x-nav-top {
display: none;
}
Don’t forget to clear your cache.
Cheers!