Start a new topic
Answered

Displaying and hiding certain sections depending on platform

I was wondering if there was a way to hide certain elements, such as the top "member login" and "sign up" buttons in the top right header, based on platform viewing. So that it how's up on desktop, but is hidden on mobile browser. Since there isn't a dedicated "mobile" site and style (or is there?) is there a way to do this? Thanks!

Best Answer
Cool. I just forwarded you the original email. Please confirm.

Hi Johnny, for this type of jobs, I would recommend adding the corresponding class to the element you wish to show/hide by following the rules in the Bootstrap Site for visible and Hidden Elements. So for example, if you have an item like this
<li class="bmargin">
    <a href="/login" id="link208" class="rpad bmargin">Travel Spot Login</a>
</li>

 

and you add the visible-xs-* to the li item like this
<li class="bmargin visible-xs-*">
    <a href="/login" id="link208" class="rpad bmargin">Travel Spot Login</a>
</li>

 

This link will ONLY show in the largest screen widths and will be hidden on small devices. More information in the link provided.

Where do I add this, since the section is part of a menu portion (header mini nav) (bootstrap)?

 Hi Johnny, you can do it on any widget on the page you wish to do the changes, but I recommend editing the Bootstrap Theme - Header - Right widget which is the one that contains those buttons.

Thanks Luis, I got it! Did you by chance get the email I sent to you directly last week regarding two other issues that were discussed by other users here, that you might be familiar with?
Very Sorry Johnny, I did not, you can try the ticket system. But try the email again just in case.

 

Can you verify the email real quick? I sent to: Luis@brilliantdirectories.com
Yes, correct Johnny ^^.

 

Answer
Cool. I just forwarded you the original email. Please confirm.
Hi Johnny, confirmed and answered via email friend.