Simple way to do some Visual Composer Grid cleanup, when you are using Bootstrap within your theme. This removes and cleans up classes.

  1. add_filter('vc_shortcodes_css_class', function ($class_string, $tag) {
  2.   $tags_to_clean = [
  3.           'vc_row',
  4.           'vc_column',
  5.           'vc_row_inner',
  6.           'vc_column_inner'
  7.   ];
  8.   if (in_array($tag, $tags_to_clean)) {
  9.        
  10.           $class_string = str_replace(' wpb_row', '', $class_string);
  11.           $class_string = str_replace(' vc_row-fluid', '', $class_string);
  12.           $class_string = str_replace(' vc_column_container', '', $class_string);
  13.           $class_string = str_replace('wpb_column', '', $class_string);
  14.          
  15.           // replace vc_, but exclude any custom css
  16.           // attached via vc_custom_XXX (negative lookahead)
  17.           $class_string = preg_replace('/vc_(?!custom)/i', '', $class_string);
  18.          
  19.           // replace all vc_
  20.           // $class_string = preg_replace('/vc_/i', '', $class_string);
  21.   }
  22.   $class_string = preg_replace('|col-sm|', 'col-sm', $class_string);
  23.   return $class_string;
  24. }, 10, 2);

Visual Composer for WordPress
Bootstrap / Bootstrap Sass

Enjoy coding …

Alex

I am a full-stack developer.

I love programming,  design and know my way around server architecture as well.  I would never feel complete, with one of these missing.

I have a broad range of interests, that’s why I constantly dive into new technologies and expand my knowledge where ever required. Technologies are evolving fast and I enjoy using the latest.

Apart from that, I am a peace loving guy who tries to have people around him that think the same.  I truly believe in the principle: “If you help someone, someone will help you, when you need it."

View Comments

  • When you replace "vc_" it removes the background image in a row. Not sure why.

    • Quick fix: add

      $class_string = str_replace('custom_', 'vc_custom_', $class_string);

      Alex

    • Or even better using a negative lookahead :)

      $class_string = preg_replace('/vc_(?!custom)/i', '', $class_string);

      Updated the above code accordingly.
      Enjoy
      Alex

  • Hey Alex, great job! So we can forget about the .container and container-fluid wrapper class from bootstrap or how do you handle that?

    • Hi,
      it will behave just like a standard bootstrap theme. Some tweaks might be needed, depending on addons used or special use cases.

      Alex

Recent Posts

iPanorama 360 – Events / API

Extending iPanorama 360 can be challenge, as none of the events are documented. You can talk to the developer… Read More

1 week ago

Extending iPanorama 360 with an arial / floor – map

WHAT IS IPANORAMA 360? iPanorama 360 for WordPress is specialized plugin that enables users to create and display interactive… Read More

1 week ago

Day 2: Typebot Chatbots – 7 Days of Docker

Chatbots Typebot is free and open-source platform that lets you create conversational apps and forms, which can be embedded… Read More

4 weeks ago

Day 1: IT-Tools – 7 Days of Docker

Developer Tools IT Tools is an amazing docker image that gives you access to ton of developer tools for… Read More

4 weeks ago

7 Days of Docker

I am huge Docker fan and run my own home and cloud server with it. What is Docker? "Docker… Read More

1 month ago

Archaeology Travel 2023 – Adventures in Archaeology & History for Everyone

Archaeology Travel is an online travel guide for people who enjoy exploring the world’s pasts. Inspiration for where to go… Read More

3 months ago