ACF With PHP Based Style Sheet

• john.marcello

• November 4, 2015 at 4:01 am

I have been using this technique with great success but ran into a hitch I am hoping can be resolved…

I have a theme file called custom_style.php which gets called in the HEAD of my html and it overrides the default style sheet so that I can use ACF to style a sites color and fonts, etc.

It works great with field groups which are placed as Theme Options, however it does not work to at all with regular field groups assigned to Pages or Posts.

For example:

`<?php
include(“../../../../wp-load.php”);
header(‘Content-Type:text/css’);
?>

<!– does not work –>
.custom #landing_banner .wrapper { background: url(‘<?php the_field(‘lp_background’); ?>’) transparent no-repeat center top; background-size: cover; }

<!– works great –>
.custom #header { display: <?php the_field(‘show_header_module’, ‘option’); ?>; }
‘

Can any one help figure out how to get the custom field variables to display from Posts and Pages, not just Theme Options?

Any help would be greatly appreciated…

Best Regards!

• John Huebner

• November 4, 2015 at 10:57 am

The reason why is that you don’t have the post_id and ACF can’t get the post_id. You will need to somehow supply the post_id to the script that’s creating the CSS.

you can get the post ID in the head of a single post like this

$queried_object = get_queried_object();
$post_id = $queried_object->ID;

I don’t know you can get that to the php file, how are you calling it?

• john.marcello

• November 5, 2015 at 3:05 am

This seemed like a good solution but for whatever reason I cannot get it going…
I have tried various permutations and still the variable is not being passed…

Not sure how to answer your question how am I calling it…did I not give enough information above?

Right now I am trying something like this and still no luck

<?php // For GSL
	include("../../../../wp-load.php");
	header('Content-Type:text/css');
?>

<?php 
global $post;
$variable = get_field('lp_background', $post->ID); ?>
?>
.custom #landing_banner .wrapper { background: url('<?php $variable ?>') transparent no-repeat center top; background-size: cover; }

Are you able to provide a better code block using the actual fields name I am showing in my example?

Any help is appreciated!

• John Huebner

• November 5, 2015 at 1:10 pm

That won’t work. You need to set the id in the post that is requesting the style sheet, not in the file that is generating the style sheet.

Here is a simple example

In the post:

<?php 
    $queried_object = get_queried_object();
    $post_id = $queried_object->ID;
?>
<link rel="stylesheet" href="url/of/file.php?post_id=<?php echo $post_id; ?>" />

In the file generating the stylesheet:

$post_id = $_GET['post_id'];

include("../../../../wp-load.php");
	header('Content-Type:text/css');