- This topic has 15 replies, 6 voices, and was last updated 9 years, 6 months ago by
.
-
Posts
-
Good evening. So I rolled out Beautiful Pro on a site that I manage for a local group of Help-Portrait in Baltimore. I added the custom image, and setup the menu in the header. However, the menu position looks out of place. Does anyone know if this is a theme issue? It isn't in the same location as it is on the demo. Does using the custom header image throw things off?
http://www.helpportraitbaltimore.org/Loving the Genesis Life!
It looks like your logo image has made the header area quite a bit taller than the demo - you can fix that and center the menu vertically by adding
margin-top: 35px;to your stylesheet under .site-header .widget-area.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+(Andrea, I had my answer all ready, then realized you just beat me to it. So I'm just adding mine to what you've already stated. 🙂
I've experienced the same issue when using a logo image of exactly what the theme calls for (320px x 120px). So it does seem to be a bit of an issue, but at least it's an easy fix with adding the padding.
On another random note, it's fun to see a Help-Portrait site mentioned here. I do the website for the Allume Conference, and Help-Portrait was a sponsor this year. 🙂
Erin Ulrich | Genesis Recommended Developer | Design by Insight
Thanks for the quick reply. My concern is that I'm following all of the theme's instructions. I'm following the logo size that it recommends to use. I didn't want to introduce my own CSS fix if this is a known issue.
By adding that, then I need to pay attention to that amount throughout the responsiveness of the theme.
I was more curious if this was standard results for the theme. If you look at my header side by side with the demo, you'll see the menu on the demo is actually lower than the menu on my site. Thus my question on if there was something missing in the configuration to explain why mine wasn't turning out the way the demo was.
I'm quite comfortable on the CSS to fix this, I'm more interested in knowing if this is a known issue and how the theme responds when a customer header image is used. If it is, then in my opinion this is something that should be fixed in the root theme. I should not have to insert CSS when I'm following theme instructions.
Loving the Genesis Life!
I would suggest submitting a ticket to the official StudioPress support team. Since the forums are manned by volunteers, we aren't in a position to do much about that, though I definitely see where you're coming from.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+I have submitted a ticket to support. I asked the question here to see if others had seen the issue or if it was something off on my own configuration. Looks like at least 1 other person has seen this, so I'm curious to hear the response from StudioPress.
Loving the Genesis Life!
If you don't mind, update this thread when you hear back from SP so other users might be able to find this in a forum search. Thanks!
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+Don't mind at all. I've seen this in other themes as well. It's just a bit frustrating that this hasn't been polished 100%.
Loving the Genesis Life!
So in initial conversations, it appears that this is the way they did it. No real reason. Just the way the theme was designed. If you switch to not using a Header Image, then you get drastically more padding/margin built into the header right nav.
Header Image: https://www.dropbox.com/s/hjxwpnxts0m2i0g/padding-spacing-demo-vs-real.png
No Header Image: https://www.dropbox.com/s/f3rukcfglkaz9t9/No-Header-Image.png
In my opinion, if you centered the text to the text, then why wouldn't you center the text with the Header Image? The idea was something else in the designers mind. Doesn't make sense to me as one would think it would line up.
Loving the Genesis Life!
I have an issue as well with the menu. Mine is going under my Logo or if I leave Text. I really want it to be the right like the picture . Help 🙂
http://www.cruisebride.comO.K. - I"m reading through all of this, but I can't seem to fix my problem. When I uploaded a header, the header is centered with the nav bar below. I want it to look just like the demo but using my own name/header in the top left - where "Beautiful Theme" is.
Can you post a link to your site, Brenda? It's always easier to help if we can see what you see.
Andrea Whitmer, Owner/Developer, Nuts and Bolts Media
I provide development and training services for designers • Find me on Twitter and Google+Yes, it's http://www.triplebraidedlife.com
I had it in maintenance mode, but I'll take it off to show you. Thank you!
And I also don't know why I'm seeing a gray bar above the site banner?
I want to take out that bar and use the entire space above the banner for my logo/header and nav bar.
Like this: http://www.brookemcglothlin.com/
Hey, Brenda!
I was searching through the threads for an answer on a different question and in my scrolling saw the http://www.brookemcglothlin.com pop up in your post — I'm actually her designer and recently did her rebrand on her site! 🙂 Small world!
To move your logo to the right side and move your navigation bar to the left side and in line with the logo, simply follow the directions in the Beautiful Pro Theme Setup document...
"HOW TO CONFIGURE THE NAVIGATION MENUS — In the Beautiful Pro theme, the Primary Navigation menu area is not used in the demo. The default navigation area can be disabled by navigating to Appearance > Menus > Manage Locations. Set the Primary navigation to the “Select a Menu” option in the drop down to disable the default Primary Navigation Menu location. The Secondary Navigation area is disabled in the Beautiful Pro theme demo. Be sure to click the “Save Settings” button to preserve your changes.
The main navigation used in the demo of the Beautiful Pro theme is a custom Menu widget placed in the header right widget area. Navigate to Appearance > Menus and create a new menu. Add your menu items. Navigate to Appearance > Widgets. Choose the Custom menu widget and drag it to Header Right. In the widget settings, choose the navigation menu you created. Be sure to click the “Save” button to preserve your changes."
That being said, the space is much smaller and you have more menu items than Brooke did, so you could do a couple things to make it fit — get rid of your HOME item (most people know to click on the logo/header to navigate back to the homepage now), move things like Disclosure and/or Resources to a sidebar link or even in a footer section. The other option would be to fiddle with the CSS and shrink the font size down a bit!
Hope that helps!
Glad you like Brooke's site! 🙂
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.