1

I'm building a wordpress theme options page using the redux framework. I read al the data in my style.php file and i will include that file in de header so the custom css is loaded.

style.php:

<?php
?>
body {
    background-color:<?php global $variable; echo $variable['color-background'];?>;
    font-family:<?php global $variable; echo $variable['typography6']['font-family'];?>;
}

a {
    color: <?php global $variable; echo $variable['link-color']['regular'];?>;
}

<?php
?>

header.php:

<style>
<?php require_once('css/style.php');?>
</style>

Now its all messy in the head of my website. It would be great if it automatically generates a css file. Does anyone know a good option?

1

3 Answers 3

1

You can define your PHP file as a CSS file by writing header("Content-type: text/css"); at the start.

<?php
header("Content-type: text/css");
?>
body {
    background-color:<?php global $variable; echo $variable['color-background'];?>;
    font-family:<?php global $variable; echo $variable['typography6']['font-family'];?>;
}
...

If you do so you can link it with <link rel="stylesheet" type="text/css" href="css/style.php"> in header.php

Sign up to request clarification or add additional context in comments.

3 Comments

the problem with that is that returns an css file without the variables:body { background-color:; font-family:; } a { color: ; }
Where are these variables defined?
This answers the original question, and worked great for me. Thanks! @luukgruijs: you might be missing a PHP include?
0
<?PHP
echo '<style>';
?>

body {
background-color:<?php global $variable; echo $variable['color-background'];?>;
font-family:<?php global $variable; echo $variable['typography6']['font-family'];?>;
}

<?PHP
echo '</style>';
?>

Comments

0

Redux Framework already has a built-in feature to update css file dynamically using compiler argument in field array configuration http://docs.reduxframework.com/redux-framework/advanced/integrating-a-compiler/

Or you can use output argument to output you custom css directly in head tag http://docs.reduxframework.com/redux-framework/the-basics/output-2/

I'm using the first option and enqueue the css file generated through wp_enqueue_style native wp function.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.