Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
The header with my site title and subtitle is too large. Too much negative space around text. It takes up too much real estate, especially on mobile devices. Can I reduce the header height? I went to page editor, no specification in masthead.php or header.php files to change pixel height dimensions. Any suggestions out there?
Thank you, Jeff
metrodetroitphoto.com
Hi Jeffrey
Thanks for reaching out. Please, remember that all WordPress.org themes completely overwrite their own folder during theme updates. For this reason, edits made via Appearance > Editor aren’t update safe and will be lost if you ever run a theme update.
Try going to Appearance > Customize > Theme Design > General. There is a setting there to adjust header padding.
If you open another support thread in the future, please, insert your premium order number in the field provided. We’ll be able to reply much sooner. Apologies for the delay this time.
Andrew-
Thank you for your reply. I was able to adjust header padding, as directed. Setting padding now on 5, which is near minimum setting. On Desktop, looks much better. However, on mobile device, There is a double space after heading, above sub heading. Once gain too much space between title and subtitle on mobile.
Also on mobile devices, menu is not aligned and does not seem responsive to me. All menu 4 items are appear scattered in menu bar on mobile.Looking for menu align for mobile setting. I thought this was supposed to be responsive, and mobile friendly? Perhaps I do not have settings correct. My friend who viewed site said not mobile friendly immediately.
Head over to Appearance > Theme Settings > Navigation and adjust the Mobile Menu Collapse value. It must be 480 or higher. Apologies for the hassle. In future our settings framework will have the ability to set min values. You have it at 120. That’s 120px resolution. No device is that narrow so the mobile menu never fires.
Try the following at Appearance > Custom CSS to resolve the mobile padding challenge:
/* Header */ @media (max-width: 680px) { body.responsive #masthead .hgroup .support-text, body.responsive #masthead .hgroup #header-sidebar { margin-top: 0; } }Let’s rather make it:
/* Header */ @media (max-width: 680px) { body.responsive #masthead .hgroup .support-text, body.responsive #masthead .hgroup #header-sidebar { margin-top: 0 !important; } }Andrew- That’s much better-mobile menu now collapses, looks better. However, now there’s a search bar that appears on menu screen. I don’t need that at the moment. How can I deactivate? I’ve checked through premium theme settings, and cannot find “disable search menu field”.
Maybe once I have more content, I might make that feature active in future. Please advise, and thanks for timely reply with previous Q and thanks in advance for answering this one!
Jeff
metrodetroitphoto.com
Sorry, that should be a setting. Try the following at Appearance > Custom CSS:
/* Hide Search in Mobile Nav */ .mobile-nav-frame form.search { display: none; }Glad to hear you’re making progress.
Andrew-
Code snippet for mobile menu worked, Thank you! I do appreciate your quick reply in answering my questions, and providing excellent solutions.
Now, for the next questtion-
Need to change photo gallery sub menu Items to “fly out” in a spry menu fashion. My colleagues told me its confusing that parent menu title “photo gallery” is highlighted at the same time as child sub page, and the submenu left-aligned with main parent menu item
So, what happens is two photo gallery buttons (parent and child) are highlighted simultaneously. Need to disable parent menu item that’s highlighted on roll over, so just the child pages are highlighted, on roll over or when selected.
Question 2)
My gallery page has three child portfolio pages, one per category. However, I want parent page to be a menu title only “photo gallery” that I do not want to add content to. However, it is the container for my three child gallery category pages. Its only purpose is to be a menu item that directs visitors to sub menu gallery pages. Can i eliminate “photo gallery” page so just menu item only that is not highlightable, and Can I change page links to go directly to specific gallery page and eliminate parent page in link? Sub menu category link is too long to send to customers. Would like to modify url link if possible.
for example, gallery url page currently displays: http://metrodetroitphoto.com/photo-gallery/corporate-public-relations
would prefer display to read: http://metrodetroitphoto.com/corporate-public-relations
I tried to explain my questions as clearly as possible, I hope you understand my issue.
Thank you for taking the time to reply with terrific solutions, I really appreciate your support. ,y website is starting to shape up!
Jeffrey Charles
Super :) Glad to hear you’re making progress.
1. Need to change photo gallery sub menu Items to “fly out” in a spry menu fashion. My colleagues told me its confusing that parent menu title “photo gallery” is highlighted at the same time as child sub page, and the submenu left-aligned with main parent menu item
Try the following:
/* Menu */.main-navigation ul li:hover > a { background: #343538; color: #e2e2e2;}.main-navigation ul li a:hover { background: #00bcff; color: #ffffff;}2. Please see: Thread: How can I remove the link from my top level menu item?
Hope that helps :)