[Resolved] Apply Bootstrap To Specific Pages Using Toolset

[Author]

Posts

[JoshuaJ301]

Tell us what you are trying to do?
I'd like to apply the bootstrap grid to only pages that are using toolset. The grid is conflicting with some css on my current theme. (Buddyboss Theme)
Is there any documentation that you are following?
No
Is there a similar example that we can see?
No
What is the link to your site?
tidesofwar.net

[Christian Cox]

Hello, I have a custom code snippet that will help dequeue the Bootstrap library on specific post types or pages, but I don't have a snippet that detects whether or not Toolset is used on a specific page. In some cases it's not possible to know when the page header is constructed. If you can tell me a specific post type or post ID you want to exclude from Bootstrap, I might be able to help customize a script for your site.

// example - dequeue bootstrap on WooCommerce Product archive
function dequeue_bootstrap(){

  if ( is_post_type_archive( 'product' ) ) {


    // dequeue Bootstrap CSS
    function dequeue_bootstrap_css(){
      wp_dequeue_style( 'toolset_bootstrap_styles' );
    }
    add_action( 'wp_print_styles', 'dequeue_bootstrap_css' );

    // dequeue Bootstrap JS 
    function dequeue_bootstrap_js(){
      wp_dequeue_script( 'toolset_bootstrap' );
    }
    add_action( 'wp_print_scripts', 'dequeue_bootstrap_js' );    

  }

}
add_action( 'wp_enqueue_scripts', 'dequeue_bootstrap', 100 );

[JoshuaJ301]

Hey Christian,
Thanks for the reply.

I'd like the bootstrap to only be loaded on my post types "Twitch Channels". The reason is because when I load boostrap sitewide, it breaks my photo gallery grid that is using similar css classes.

My site is at hidden link and toolset is running on hidden link and the individual channels are the posts.

The photo grid is at this url: hidden link

Thanks for your help with this.

[Christian Cox]

Okay sure, please use this code snippet to dequeue bootstrap 3 and 4 everywhere except the Twitch Channel posts:

function dequeue_bootstrap_except_twitch_channels(){

  if ( get_post_type() != 'twitch-channel' && !is_admin()  ) {

    // dequeue Bootstrap CSS
    function dequeue_bootstrap_css(){
      wp_dequeue_style( 'toolset_bootstrap_4' );
      wp_dequeue_style( 'toolset_bootstrap_styles' );
    }
    add_action( 'wp_print_styles', 'dequeue_bootstrap_css' );

    // dequeue Bootstrap JS
    function dequeue_bootstrap_js(){
      wp_dequeue_script( 'toolset_bootstrap_4' );
      wp_dequeue_script( 'toolset_bootstrap' );
    }
    add_action( 'wp_print_scripts', 'dequeue_bootstrap_js');

  }

}
add_action( 'wp_enqueue_scripts', 'dequeue_bootstrap_except_twitch_channels', 100 );

Let me know if this does not fully dequeue the styles and scripts as needed and I can take a closer look.

[JoshuaJ301]

Hi Christian,

Thanks so much! That seems to have fixed the css conflict I had. In the future if I wanted to add any additional post types, can I do that with this code?

[Christian Cox]

In the future if I wanted to add any additional post types, can I do that with this code?
Here is a small update to make it more flexible:

function dequeue_bootstrap_except_twitch_channels(){
  // a comma-separated list of post type slugs where you want to include Bootstrap
  $cpts = array( 'twitch-channel' );
  if ( !in_array( get_post_type() , $cpts) && !is_admin()  ) {
 
    // dequeue Bootstrap CSS
    function dequeue_bootstrap_css(){
      wp_dequeue_style( 'toolset_bootstrap_4' );
      wp_dequeue_style( 'toolset_bootstrap_styles' );
    }
    add_action( 'wp_print_styles', 'dequeue_bootstrap_css' );
 
    // dequeue Bootstrap JS
    function dequeue_bootstrap_js(){
      wp_dequeue_script( 'toolset_bootstrap_4' );
      wp_dequeue_script( 'toolset_bootstrap' );
    }
    add_action( 'wp_print_scripts', 'dequeue_bootstrap_js');
 
  }
 
}
add_action( 'wp_enqueue_scripts', 'dequeue_bootstrap_except_twitch_channels', 100 );

You can modify the $cpts array to include a comma-separated list of post type slugs. This is how the $cpts array definition would look with two more custom post types:

$cpts = array( 'twitch-channel', 'cpt-slug-1', 'cpt-slug-2' );