# Compile layout and global css with SCSS

**URL:** <https://community.wpbeaverbuilder.com/t/compile-layout-and-global-css-with-scss/18401>\
**Category:** Snippets\
**Created:** [March 20, 2024, 1:45pm UTC](https://community.wpbeaverbuilder.com/t/compile-layout-and-global-css-with-scss/18401 "2024-03-20T13:45:01Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![pross](https://community.wpbeaverbuilder.com/user_avatar/community.wpbeaverbuilder.com/pross/32/883_2.png) [@pross](https://community.wpbeaverbuilder.com/u/pross)\
**Post date:** [March 20, 2024, 1:45pm UTC](https://community.wpbeaverbuilder.com/t/compile-layout-and-global-css-with-scss/18401/1 "2024-03-20T13:45:01Z")

</div>

```auto
add_filter( 'fl_builder_render_css', function( $css, $nodes, $global_settings, $include_global ) {
	require_once FL_BUILDER_DIR . 'includes/vendor/sass/autoload.php';
	$compiler = new ScssPhp\ScssPhp\Compiler();
	try {
		$css = $compiler->compileString( $css )->getCSS();
	} catch ( Exception $e ) {}
	return $css;
}, 10, 4 );

```