Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Can you add your own media queries width and override bootstrap?
Howdy mortmazer!
To switch between minified and non-minified versions, add define( 'SCRIPT_DEBUG', true );
to your wp-config.php file.
To see how The Bootstrap looks with different screen sizes, you can refer to http://responsinator.com/?url=the-bootstrap.obenland.it.
To alter the default Bootstrap behavior, I would recommend the same as Andrew: Create a Child Theme and overwrite the media queries there. This way you modifications will be future-proof.
In the next version, the responsive part will be enqueued separately, so it’ll be less of a hassle to change a file and replace it.
Konstantin
Ok, sorry, I just posted this to Konstantin’s blog. I won’t do that again.
Ok, I have done workarounds and figured out how collapsing menu works. You’re going to need to maintain two menus for the user, one for fixed items, and one for those that should collapse. But here’s the bug On when I view page on my HTC Evo LET droid. The touch rectangle (using your factory css) over each menu item will work once, but rarely a second time. The translucent green rectangles are appearing down and to the right of the menu item, and sometimes in even odder places. While this will happen on the UNcollapsed menu sometimes, it always happens when you turn the phone over to landscape mode. Then the rectangles are totally off.
What to do?
Reponsinator.com is a nice tool, but unforuntately, it’s giving me a different result from my phone. First off, the touch menu (3 bars) icon is on its own line above the menu, and there are no focus or touch rectangles at all here. So that must be tested on a phone.
Ok, sorry, I just posted this to Konstantin’s blog. I won’t do that again.
No worries, it’s all good!
This really sounds like issues with the core Bootstrap files. All I did in The Bootstrap really was make Bootstrap play with WordPress requirements. That’s why style.css
is so short. 🙂
Thank you for reaching out though, I really appreciate that!
Well, this is bizarre. I live previewed another theme “responsive” and all of a sudden, the weird focus rectangles are gone and all is working fine. Still seems like a a bug somewhere, tho.
I have created two menus. One for “Fixed” items, and one for “Extra” The Extra are always added to the collapsed menu automatically, but I to insert a manual theme call to add them to the web interface. Thus, in a browser, there are 4 fixed items, plus 4 Extra links on one menu line, while on the phone there are just 4 fixed items, and the Extras appear when use selects the touch (icon-bar) btn.
It would be nice if bootstrap could handle this scenario, as I think most non-tech users wouold go crazy trying to understand how to make this work. But it is a great looking theme base. I will show you my first version soon.