- This topic has 11 replies, 2 voices, and was last updated 6 years, 9 months ago by Tom.
-
AuthorPosts
-
May 21, 2017 at 4:36 pm #321852Ben
Hello!
I recently installed GeneratePress premium and Elementor pro on my staging server. I’ve merged my header with my navigation but am having two issues.
1. My current website is getkohort.com (Jupiter theme/Visual Composer). My staging site with GeneratePress is staging2.getkohort.com (user: kohort, password: stage17*). I’m in the process of moving everything over and I’m trying to get my navigation to be the same as my current website. I’m lost and can’t figure out what I need to do to adjust the size of the background/buttons of the navigation. Whenever I add underline links or my CTA button they are way below or huge. I also can’t figure out how to make my sticky navigation to not be transparent.
2. When I’m in Elementor and try to edit the first section, the navigation menu is so far down that it keeps me from being able to use the Elementor tabs at the top – meaning I can’t delete or edit that top section. I think this might be solved if it’s caused by the above.
I know some CSS/HTML so I’m not afraid to make some additions/edits – but I’m not a pro and I don’t want to bug my developer if I don’t have to (he’s working on our app) and I’d rather learn myself. I appreciate any help! Thanks!
May 21, 2017 at 6:18 pm #321904TomLead DeveloperLead DeveloperHi Ben,
1. Your menu items are really tall. You can adjust this in Customize > Layout > Primary Navigation.
You can also give your navigation a background color in Customize > Colors > Primary Navigation. Then to make it transparent when necessary, do this: https://docs.generatepress.com/article/merging-header-navigation-content/
2. I’ve heard from users that they sometimes need to “un-merge” the header and content in order to edit the top sections in Elementor. This is something I’m trying to find a solution for.
May 21, 2017 at 6:35 pm #321916BenThanks, Tom!
1. Ok cool. So I had it set to 90px because that was the position I wanted it on the page and the size of the logo (I had pulled that 90 from the css of my previous site). I set it to 20px and that looks about right when I compare the CTA buttons, but now it’s all the way at the top of the page and my SVG logo has disappeared – I currently have
.site-logo img {
width: 200px;
}in my style.css file. Do I need to add or change something else to push that down?
2. That works. Thank you!
May 21, 2017 at 11:49 pm #321991TomLead DeveloperLead DeveloperTry this:
.main-navigation .navigation-logo img { width: 200px; height: auto; }
May 22, 2017 at 11:33 am #322335BenThank you! That brought back my logo. Is there a way to move the logo and the navigation down a bit on the page? Right now it’s at the very top of that page. The only way I’ve been able to move it down is with the line-height or padding, but both of those make the buttons huge again. I really appreciate your help!
May 22, 2017 at 11:51 am #322360TomLead DeveloperLead DeveloperTry this:
@media (min-width: 769px) { #site-navigation { margin-top: 10px; } }
June 5, 2017 at 9:19 pm #329130BenThank you, Tom. I was able to get my main navigation sorted out. However, the sticky navigation’s background is not going full width. Here are a couple of screenshots:
Transparent (looks good): https://www.dropbox.com/s/aw0z1t5snqcbl80/transparent_menu.jpeg?dl=0
Sticky (I’d like the blue to extend full width but the menu to sit where it is): https://www.dropbox.com/s/v851w3ux0cjatle/sticky_menu.jpeg?dl=0
Thanks!
June 5, 2017 at 11:55 pm #329155TomLead DeveloperLead DeveloperIs the page header container type set to Full width?
What about the navigation width (Customize > Layout > Primary Navigation)?
June 6, 2017 at 7:41 am #329345BenThe page header container was set to full width.
The navigation width in primary was set to contain. I changed that to full-width which gives me a full-width sticky background – but my navigation items are on the edges of the screen. Can I move them back to where they were without losing the full-width bg?
https://www.dropbox.com/s/d89utbuxruvf0zx/navwidth_full.jpeg?dl=0
June 6, 2017 at 9:01 am #329396TomLead DeveloperLead DeveloperIs the inner navigation width set to contained?
June 6, 2017 at 9:15 am #329403BenFacepalm. Thank you! That was exactly what I was looking for.
June 6, 2017 at 9:16 am #329405TomLead DeveloperLead DeveloperYou’re welcome 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.