Reply To: PHP as CSS with ACF field

• jarvis

• September 22, 2021 at 7:27 am

I’ve used the below which grabs values from an option page, then creates a CSS file and enqueues it:

###################################################
# Create Custom CSS
###################################################
function acf_generate_options_css() {
	$ss_dir = get_stylesheet_directory();
	ob_start(); // Capture all output into buffer
	require($ss_dir . '/inc/custom-styles.php'); // Grab the custom-style.php file
	$css = ob_get_clean(); // Store output in a variable, then flush the buffer
	file_put_contents($ss_dir . '/css/custom-styles.css', $css, LOCK_EX); // Save it as a css file
	
}
add_action( 'acf/save_post', 'acf_generate_options_css', 20 );

I then enqueue the script:

function acf_enqueue_scripts() {
    wp_enqueue_style( 'custom-theme-css', get_template_directory_uri() . '/css/custom-styles.css' );
}
add_action( 'wp_enqueue_scripts', 'acf_enqueue_scripts', 99 );

And custom-styles.php looks like this:

$colour_name = get_field('colour_name','option');
$select_colour = get_field('select_colour','option');
.bg-colour-<?php echo str_replace(" ","-",strtolower($colour_name)); ?> {
    background-color: <?php echo $select_colour; ?>;
}

Not sure if that helps at all?