Simple way to do some Visual Composer Grid cleanup, when you are using Bootstrap within your theme. This removes and cleans up classes.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
add_filter('vc_shortcodes_css_class', function ($class_string, $tag) { $tags_to_clean = [ 'vc_row', 'vc_column', 'vc_row_inner', 'vc_column_inner' ]; if (in_array($tag, $tags_to_clean)) { $class_string = str_replace(' wpb_row', '', $class_string); $class_string = str_replace(' vc_row-fluid', '', $class_string); $class_string = str_replace(' vc_column_container', '', $class_string); $class_string = str_replace('wpb_column', '', $class_string); // replace vc_, but exclude any custom css // attached via vc_custom_XXX (negative lookahead) $class_string = preg_replace('/vc_(?!custom)/i', '', $class_string); // replace all vc_ // $class_string = preg_replace('/vc_/i', '', $class_string); } $class_string = preg_replace('|col-sm|', 'col-sm', $class_string); return $class_string; }, 10, 2); |
Visual Composer for WordPress
Bootstrap / Bootstrap Sass
I am a full-stack developer. My expertise include:
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."
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