In my stylesheet I'm hoping to use code like this...

background-image: url(/wp-content/images/' . $category->cat_ID . '.jpg);

...to pull in a different background image for each category. So I'll have an image called 1.jpg and it'll show that image as the background to the li element I'm trying to style for Category 1.

That approach works fine in template files like this...

<img src="/wp-content/images/' . $category->cat_ID . '.jpg">

...but in the stylesheet it's not working for me.

Any tips?

  • Any solution? Please mark something as solved or add your own answer and mark this one as solution. – kaiser Oct 24 '11 at 12:58

Stylesheets can hold only CSS.

If you make use of the body_class() function, then you get classes for nearly every request. You can then define those classes (ex. backgrounds) inside your stylesheet.

Add this inside your templates: <body <?php body_class(); ?>> (if you haven't already got it).


You can also define just this class in your 'header.php', though following @kaiser's suggestion is generally a preferred way of doing it.


In fact, any stylesheet accepts php code, and it's perfectly valid.

All you need to do is:

  1. Change your stylesheet file extension to .php, eg. style.css > style.php.
  2. Paste the code below as the first line, so your new php-stylesheet will be treated as a stylesheet not php script:

header("Content-type: text/css");

Change stylesheet linking code in your blogs header section:

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('template_directory'); ?>/style.php" />  

Now you can do any PHP magic within your .css file.

In your case it's pointless, all you need to do is to write custom class and maybe a custom loop.

We'll help, but we need some code first.


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.