Generate a random number, test the result, use it to set a random background image on your header.<\/li>\n<\/ul>\nNot working?<\/h3>\n
I did a totally static test page and it worked fine, then I tried this same technique within a WordPress site and no dice. The solution for me was to leave the file named style.css, and use .htaccess to parse it as PHP. Just make sure this code is in the .htaccess file (Apache servers only) at the same directory level as the CSS file. Then just use PHP inside it as you would any other PHP file.<\/p>\n
<FilesMatch \"^.*?style.*?$\">\r\nSetHandler php5-script\r\n<\/FilesMatch><\/code><\/pre>\nCarlo DeAgazio wrote in to say this works for him in WordPress:<\/p>\n
<?php\r\n $absolute_path = explode('wp-content', $_SERVER['SCRIPT_FILENAME']);\r\n $wp_load = $absolute_path[0] . 'wp-load.php';\r\n require_once($wp_load);\r\n\r\n \/**\r\n Do stuff like connect to WP database and grab user set values\r\n *\/\r\n\r\n header('Content-type: text\/css');\r\n header('Cache-control: must-revalidate');\r\n?><\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"When people are asked about features they would like to CSS, “variables” always seems to come up. Whether or not this is a good idea is still something I personally haven’t decided on, but I’d lean toward yes. Regardless, using PHP, it is trivially easy to use variables in CSS. This is certainly not a […]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":[]},"categories":[4],"tags":[],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":304101,"url":"https:\/\/css-tricks.com\/a-follow-up-to-php-templating\/","url_meta":{"origin":4906,"position":0},"title":"A Follow-Up to PHP Templating","date":"February 28, 2020","format":false,"excerpt":"Not long ago, I posted about PHP templating in just PHP (which is basically HEREDOC syntax). I'm literally using that technique for some super basic templating I needed to do on this very WordPress site. The main pushback was that this kind of thing can be an XSS vulnerability. In\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/11\/layouts-flexbox.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":300328,"url":"https:\/\/css-tricks.com\/php-templating-in-just-php\/","url_meta":{"origin":4906,"position":1},"title":"PHP Templating in Just PHP","date":"December 26, 2019","format":false,"excerpt":"With stuff like template literals in JavaScript and templating languages, like JSX, I've gotten used to wanting to write my HTML templates in one nice chunk and sprinkling in variables wherever I need them. I had a situation where I needed to do that in \"raw\" PHP the other day,\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/12\/confetti.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":305435,"url":"https:\/\/css-tricks.com\/getting-javascript-to-talk-to-css-and-sass\/","url_meta":{"origin":4906,"position":2},"title":"Getting JavaScript to Talk to CSS and Sass","date":"April 3, 2020","format":false,"excerpt":"JavaScript and CSS have lived beside one another for upwards of 20 years. And yet it\u2019s been remarkably tough to share data between them. There have been large attempts, sure. But, I have something simple and intuitive in mind \u2014 something not involving a structural change, but rather putting CSS\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/03\/css-sass-js.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":331027,"url":"https:\/\/css-tricks.com\/give-your-eleventy-site-superpowers-with-environment-variables\/","url_meta":{"origin":4906,"position":3},"title":"Give your Eleventy Site Superpowers with Environment Variables","date":"December 31, 2020","format":false,"excerpt":"Eleventy is increasing in popularity because it allows us to create nice, simple websites, but also \u2014 because it\u2019s so developer-friendly. We can build large-scale, complex projects with it, too. In this tutorial we\u2019re going to demonstrate that expansive capability by putting a together a powerful and human-friendly environment variable\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/12\/eleventy-env-fun-mode.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":318658,"url":"https:\/\/css-tricks.com\/the-cicada-principle-revisited-with-css-variables\/","url_meta":{"origin":4906,"position":4},"title":"The Cicada Principle, revisited with CSS variables","date":"August 4, 2020","format":false,"excerpt":"Lea Verou digging up the CSS trickery classic and applying it to clip the backgrounds of some code blocks: The main idea is simple: You write your main rule using CSS variables, and then use\u00a0:nth-of-*()\u00a0rules to set these variables to something different every N items. If you use enough variables,\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/08\/cicada-css.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":174918,"url":"https:\/\/css-tricks.com\/sprinkling-php-server-side-techniques-help-front-end-tasks\/","url_meta":{"origin":4906,"position":5},"title":"A Sprinkling of PHP: Server-Side Techniques to Help with Front End Tasks","date":"July 8, 2014","format":false,"excerpt":"The following is a guest post by Zachary Brady. Zachary is about to take us on a beginner's journey using PHP to do some things that us front end developers sometimes need to do. To me, this kind of thing doesn't make us back end developers, but more resourceful front\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"featured_media_src_url":null,"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/4906"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=4906"}],"version-history":[{"count":10,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/4906\/revisions"}],"predecessor-version":[{"id":22207,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/4906\/revisions\/22207"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=4906"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=4906"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=4906"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}