This forum is archived. Posts are preserved for historical reference. For current help, join us on Discord.

Adding new links in the header

In UserSpice 4.3 and Below · Started by haydentech on 2017-08-30 7:43 pm · 14839 views · 6 replies

I've added a couple new links to the header, via usersc/navigation.php. That works fine, and those links get rolled up into the hamburger menu on mobile, as expected.

So my question is partially related to UserSpice and partially to Bootstrap... I now want to add a 3rd item to the header, which should NOT get rolled into the hamburger menu on mobile. Any ideas how to accomplish this?
I think maybe adding the class of "hidden-xs" may or may not do this...give it a try...
Hey, thanks for the suggestion! It didn't quite do the trick though (and maybe I didn't explain it very well). hidden-xs does remove it from the hamburger menu, but does not leave in the header. It's just gone when on mobile. I want it to stay in the header always, even on mobile.
Just leave the class empty then - should do the trick, if I'm understanding your request correctly. My understanding of bootstrap classes is nothing compared to my knowledge of PHP - so @mudmin might be able to help better
After some unsuccessful testing and then some Googling, you'll need to add a pull to get it to stay. Here's the best thread I found explaining it without having to dig through answers: https://stackoverflow.com/questions/36462195/navbar-bootstrap-allowing-one-item-to-be-outside-hamburger-glyphicon

If you still have some trouble getting it to work, please make a link to a pastebin of your navigation and any css changes and we'll help you out.
Karsen, that got me to the finish line. The trick, which as a fairly new Bootstrap user I was not expecting, is that you need to put the item in both places in the header code (collapsed and non-collapsed) and then show the right one at the right time by using visible-xs and hidden-xs.

Here's some sample code, if anyone's interested:
https://www.bootply.com/658w1tS3SS
There's a way to do it with only one link but the navigation is always a nightmare for me to get it to work how I want. Glad you have it working!