Disable bootstrap's dropdown-toggle

Question

I'm using bootstrap on WordPress using the _ib theme, and I would like to add in my own responsive menu for when window is less than 768px. By default bootstrap will convert the menu to a dropdown-toggle , which when clicked shows your original menu. What I would like to do is implement my own menu when it is used on a small device or at a low resolution.

How would I remove this dropdown-toggle ? I have looked around the bootstrap JS files, but I'm no JS whizz, so I can't quite figure out how to simply scrap the dropdown-toggle .

Any help appreciated!

EDIT:

<div class="container">
        <div class="row">
            <div class="site-navigation-inner col-sm-12">
                <div class="navbar navbar-default">
                    <div class="navbar-header">
                        <!-- .navbar-toggle is used as the toggle for collapsed navbar content -->
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
                            <span class="sr-only">Go to...</span>
                          <span class="icon-bar"></span>
                          <span class="icon-bar"></span>
                          <span class="icon-bar"></span>
                        </button>
                    </div>
                    <!-- The WordPress Menu goes here -->
                    <?php wp_nav_menu(
                        array(
                            'theme_location' => 'primary',
                            'container_class' => 'collapse navbar-collapse navbar-responsive-collapse',
                            'menu_class' => 'nav navbar-nav',
                            'fallback_cb' => '',
                            'menu_id' => 'main-menu',
                            'walker' => new wp_bootstrap_navwalker()
                        )
                    ); ?>
                </div><!-- .navbar -->
            </div>
        </div>
    </div><!-- .container -->

I tried the simple method of just removing this .navbar-toggle as I don't need it, but that actually removes the entire menu even on a full page window...

Answer 1

When you look at you index php page. You will see your navigation divs.

To turn off the behavior you can remove the toggle class.

<div class = container>

Etc

One of the classes will be a toggle class. Simply remove it.

What version is it? 2 or 3.

You can just replace the code with yours. I'm familiar with joomla with is basically html surrounding php.

If your looking to modify the css you will need to override it. How you do this easily will depend on wether your template uses CSS LESS or a custom.css file. You could even remove the navigation diva and replace with your own code utilizing bootstrap layout classes.

Giving the version of bootstrap will help with this question.

Bootstrap uses media queries you need to find what query you are targeting. Bootstrap website is very informative on this

http://getbootstrap.com/getting-started/

There are examples of layouts here. Make sure your nav divs and classes are the same. It will work.

Please back up or comment out old code for reuse.

When I get to my PC il look at code if not fixed by then.

You cofusing me slightly here. You have a menu (bootstrap) one and you have a plugin that is also calling a menu?

Or

Do you have two menus on the same page? Or does your plugin rely on the the current menu?

Im confused what you want here. It looks like you have a menu as part of the template and then you are calling a module to create a menu in the form of a plugin. It will not work if this is the case.

The plugin menu may conflict with the existing menu. If you have your own existing menu why dont you just remove the entire template menu and then just let your plugin be called?

If I am way of the mark I apologize. However if a plugin is involved the code is an unknown!

Is the plugin an addon to the template? If not you may have a conflict

Think you may need to contact the developer of the plugin