How to run PHP through Adobe Muse generated CSS

Question

Thanks for having a look at my question and I hope you can help. Yes there are some similar questions that have already been answered but this is different!

What I am trying to do I am building a site that pulls posts from wordpress and displays them in a list. When designing, the thumbnails were defined as generic stock images

background: #FFFFFF url("../images/screen%20shot%202014-09-01%20at%20171216-u2353-fr.jpg") no-repeat center center;

but now I want to change it to

background: #FFFFFF url("<?php the_post_thumbnail(); ?>") no-repeat center center;

Now, I've seen that this can be done by essentially making the .css page .php, adding a head tag declaring it a php page and then linking it, but this doesn't work for me.

I'm assuming it has to do with the way Muse identifies each file, as the .css file for the page is linked as so:

<link rel="stylesheet" type="text/css" href="css/more-news.css?4117650857" id="pagesheet"/>

I'm not sure what the numbers at the end, but getting rid of them ruins the whole page.

So essentially, does anyone know how I can fix the post-thumbnail issue, or what the numbers at the end of the css filename means, and how to workaround it?

Thank you for any help, and please let me know if this wasn't worded well enough to explain the problem!

Answer 1

I would avoid having PHP process your entire CSS file, especially in WordPress. Because:

• WordPress will have to be loaded in every request to that CSS file. That is a lot of overhead for what you need to do.
• Depending on how dynamic the content you plan on putting in your CSS is, you may need to prevent the browser from caching your stylesheet. This exacerbates my first point.

I would just use inline CSS for the dynamic content. For example:

<div style="background-image:url('<?php echo $someUrl; ?>')"> ... </div>

Alternatively, you could work out a solution where WordPress generates and saves a CSS file dynamically, but this works better when the style is updated infrequently.

what the numbers at the end of the css filename means

That is the version number for the stylesheet. See the fourth parameter for wp_enqueue_style. Using a version number allows you to tell the browser that the CSS file has been modified and it should re-fetch it rather than using a cached version.