Make topbar menu unresponsive
-
i have opted to turn off the responsive layout.
but the topbar menu shows collapse-expand menu for mobile devices and causes the some blank space on right side and makes the theme looks not perfect.
Please help me with this.
This is the only thing i want to tweak with.
Truly grateful for such a wonderful theme for free of cost.
thank you
-
Hi minato4u. Can you post a link to your site? Thanks.
thank you for your reply but i’m working under localhost.
but you can try it yourself by turning off the responsive layout and re-size the browser window as it is the size of mobile or tablet
again i would like to request you to help me to get menu unresponsive
When I disable the responsive layout option the menus are visible until 719px at which point they disappear, and there aren’t any icons to expand/collapse the menus. That’s why it would be helpful to have a link to your site to see exactly what’s happening.
As i’m working offline on localhost I would like to provide you the youtube video.
When I tested it in unresponsive mode I found that the search box disappears, menu still remains the responsive, color of sidebar titles changes to gray-white also some unwanted spacing after the menu bar appears as the menu remains the responsive.
I was using Viewport Resizer chrome addon for different resolution testing, find it here: https://goo.gl/nyfH79
I’ve change nothing just installed the hueman theme, added some menu entries as you can see in the video and assign that menu to topbar.
Turned off the responsive from theme options menu.
On Hueman Theme Documentation I’ve found something that might be helpful.
Responsive Layout: If you choose to disable responsive.css, you may need to do further changes in style.css for the site to work completely as un-responsive, as there are some mediaqueries in this file as well – mainly for the menus.
bdbrown all hopes upon you please help me with this.
again thank you for you help
I want theme to remain totally unresponsive on all device, to look same on every devices.
On Hueman Theme Documentation I’ve found something that might be helpful.
Responsive Layout: If you choose to disable responsive.css, you may need to do further changes in style.css for the site to work completely as un-responsive, as there are some mediaqueries in this file as well – mainly for the menus.
Thanks for the video 🙂 Yes, there are several media queries embedded in the main style.css file. You could copy that style sheet to a child theme, remove all the media queries and then enqueue that style sheet instead of importing the default theme style sheet. But that may cause more issues as there are some theme elements that are responsive by their nature, as you’ve seen with the header elements, and the menus lose their styling. Or, you could leave them in there and try adjusting the individual elements, but you’ll need a lot of time and several cups of coffee to tackle that.
One thing you could try is setting a fixed width with css based on your current configuration; something like this:
#header, .container, #footer { width: 1380px!important; }This should take care of most of the issues. But the various media queries in the default style sheet also control, among other things, the following:
1. At 1199px the secondary sidebar title will lose the color
2. At 959px the primary sidebar title will lose the color
3. At 719px the menus will collapse into an icon that is right-justified.Maybe #1 and #2 aren’t a big deal. And you could address #3 by moving the icons with the following css:
#nav-topbar .nav-toggle, #nav-header .nav-toggle { float: left; }You may also find other issues as you make adjustments.
Another option would be to look for a non-responsive theme. I think the WP theme Twenty Ten is non-responsive, and there are probably others as well.
Hope that helps.
navigation bar is working great, but after setting the width, site body goes to the left side on my desktop resolution i.e. 1080px instead of being on center.
please provide solution for that
also I would like to thank you for spending so much time on my solution
Give this a try; adjust the widths as needed but they all have to be the same value:
#wrapper { max-width: 1024px !important; min-width: 1024px !important; margin: 0 auto !important; overflow: auto !important; box-shadow: none !important; } #header, .container, .container-inner, .main, #footer { max-width: 1024px !important; }If you’re using the default theme colors you could keep the sidebar title background colors during the viewport resizing using this css:
.s1 .sidebar-top, .s1 .sidebar-toggle { background: #3b8dbd !important; } .s2 .sidebar-top, .s2 .sidebar-toggle { background: #82b965 !important; } .sidebar-top p { color: #fff !important; }
The topic ‘Make topbar menu unresponsive’ is closed to new replies.
