Resolving Bootstrap conflicts

WP Customer Area is using Bootstrap as a framework. Unfortunately, a lot of themes or plugins also use Bootstrap, and this could conflict with the version loaded by WP Customer Area.

If your dropdown menus are not working, or if you notice something displaying not correctly, you should first check the steps mentioned in the FAQ How to check if I have a conflict with another plugin. You can also switch your site theme to TwentyTwelve+ and check if the menus are working. If that is the case, the conflict comes from the WordPress theme you are using.

This conflict comes from Bootstrap javascript files loaded twice. To fix that conflict, you will need to either disable all Bootstrap JS loaded by your theme, or disable those loaded by WP Customer Area. The best practice for you would be to disable the Bootstrap loaded by your theme when we are displaying a WP Customer Area page. To do that, you need to browse the PHP files from your theme (start by looking into functions.php), and find where Bootstrap JS files are loaded. It should look like this:

wp_enqueue_script('bootstrap-scripts');

Note that the name given to the styles or scripts can depend from your theme or plugin (bootstrap-scripts is just an example slug that your theme could use, you need to find the right one !).

If you can’t find this by looking into the files, grab an advanced text editor (Notepad++ and so on ..) and perform a search in files action for the word wp_enqueue_script, then copy/paste the slug inside the quotes to the function shown below, in place of the example slug bootstrap-scripts.

Once you have found this, add the following function to the bottom of your functions.php file (preferably inside a child theme):

function fix_cuar_and_theme_bootstrap_conflict(){
    if (function_exists('cuar_is_customer_area_page')
        && (cuar_is_customer_area_page(get_queried_object_id())
            || cuar_is_customer_area_private_content(get_the_ID())))
    {
        wp_dequeue_script('bootstrap-scripts');
    }
}
add_action('wp_enqueue_scripts', 'fix_cuar_and_theme_bootstrap_conflict', 20);

Do not forget to replace the slug bootstrap-scripts by the one you found in your theme or it won’t fix anything.

If you prefer disabling WP Customer Area Bootstrap instead of the one loaded by your theme or plugin, you can use our theme_supports.