I designed a new theme in WordPress. I used Bootstrap Menu bar for responsive design but shows up a toggle in Desktop Mode.

enter image description here

<div id="nav">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    wp_nav_menu( array(
            'menu'              => 'top-menu',
            'depth'             => 2,
            'container'         => 'div',
            'container_class'   => 'navbar-collapse collapse',
            'menu_class'        => 'nav navbar-nav',
            'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
            'walker'            => new wp_bootstrap_navwalker())
  </div><!-- /.container-fluid -->
        'top-menu' => 'Top Menu Location',
         'mobile-menu' => 'Mobile Menu Location',
  • Do you mean that you don't want this menu to be displayed on desktop ?
    – Q Studio
    Commented Dec 30, 2020 at 8:50
  • No, On the Desktop screen, it display in toggle mode. I solved the issue. Because of bootstrap version conflict, it shows that
    – Athi
    Commented Jan 1, 2021 at 17:32

1 Answer 1


If you want to hide elements based on breakpoints ( screen widths ) - you can use the display classes of BootStrap 4 - this might be different if you use an older version of BS.


A simple example of a class name to hide an element on desktop would be:

<div class="d-sm-none">HIDDEN ON DESKTOP</div>

This is based on the rule:

.d-{breakpoint}-{value} for sm, md, lg, and xl.

Where value is one of:

  • none
  • inline
  • inline-block
  • block
  • table
  • table-cell
  • table-row
  • flex
  • inline-flex

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.