Search code examples
wordpressvisual-composer

WPBakery Page Builder get custom css from design options


I have a page with a theme that integrates WPBakery Page Builder. The theme creates a single page layout by adding together different pages.

The single pages itself have some custom design options, e.g. row paddings, margins, background-image, etc. If I open one page alone, I can see the custom css applied.

But in the one-page-layout, those custom design options are not applied. From the HTML I can see that the custom CSS that is generated in the single page is not generated in the one-page-layout (which consists of multiple pages).

My idea is to tweak the theme and manually add the CSS - but it has been months since I worked with Wordpress programatically, so I hope someone can give me a hint. How can I programatically get the CSS code that WPBakery creates for a page's design options? Somewhere in WPBakery, it must take the design options stored in the shortcodes and add it to the head.

I hope the problem is understandable :-)


Solution

  • The css is in the meta _wpb_shortcodes_custom_css.

    I used this to solve a similar issue :

    <style type="text/css" data-type="vc_shortcodes-custom-css"><?php echo get_post_meta( 17250, '_wpb_shortcodes_custom_css', true ); ?></style>