Right way for pass variable php to css in Wordpress

Question

i need to passing variable from php to css for customize style from custom theme option.

The only way i have find is create file.css.php and working good.

But my question is: This is good for website load a file .css.php ? or can have some other problem, like speed or seo?

There are some other good methods? Thx

You might want to look into just using an inline style within your PHP template. Maybe something like style="<?php echo $css-thing; ?>" or what ever you are trying to do. — ultraloveninja
– ultraloveninja, Commented Apr 29, 2017 at 1:49

Orun · Accepted Answer · 2017-04-29 04:54:44Z

6

Indirect solution:

It sounds like you want to include different CSS behavior based on user selection. Let's say that user selection is stored in a variable $foo. Just include it in an element's class like this

<?php 
$foo = 'option-1'; ?>
<div class="<?php echo $foo; ?>"></div>

There are also two direct solutions to your issue:

1. Use inline CSS or CSS in your file's page head:

<style>
  div.button { color:<?php echo $bar ?>; }
</style>

2. Use a PHP file as CSS. This would look like:

<link rel="stylesheet" type="text/css" href="/style.php">

Then you can use PHP variables right inside your CSS file. Just make sure you change the content-type back to CSS at the beginning of the file like this:

<?php header("Content-type: text/css; charset: UTF-8"); ?>

This method is a little bit unconventional, but it'll work without any speed or SEO drawbacks.

edited Apr 29, 2017 at 4:54

answered Apr 29, 2017 at 3:33

Orun

4,6243 gold badges31 silver badges45 bronze badges

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

Collectives™ on Stack Overflow

Right way for pass variable php to css in Wordpress

1 Answer 1

Indirect solution:

There are also two direct solutions to your issue:

1. Use inline CSS or CSS in your file's page head:

2. Use a PHP file as CSS. This would look like:

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Indirect solution:

There are also two direct solutions to your issue:

1. Use inline CSS or CSS in your file's page head:

2. Use a PHP file as CSS. This would look like:

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related