Archive for the 'Programming' Category

Logic And Style Sit’n In A Tree, K-i-s-s-i-n-g

This is nothing new… the concept and methods of using PHP inside of CSS has been gratuitously documented on the internets. So why am I posting this? Because.

At work, we use highly structured and dynamic CSS files which contain plops (yes, plops) of PHP to do things like automatically write the absurd cross-browser rules for rounded corners by only typing out <?php echo CSSFunctions::border_radius(6); ?> …among other things like reusable color variables and color blenders. CSS is powerful as it is. But without an inherent logic framework, hooking up with PHP makes CSS super. Side note: you can do browser detection with PHP and write functions that return the appropriate CSS rules for the beloved various browsers.

Okay, with that intro out of the way, onto my point: My current personal project — that I’ve been working on, on-and-off, for the last gazillion years — was using stock CSS files and I wanted to convert them to use these sup’d up CSS+PHP files (since I’m all into super CSS files now from work) but I could not get them to work!

Clarification: I could not get them to work the way I wanted them to work…

The cheap way to do it is to use an actual PHP file like this: <link rel="stylesheet" type="text/css" href="styles.php" media="screen" />

And then you give that php file a header directive that tricks the internet machines into thinking that the linked file is oh, just your average run-of-the-mill CSS file: <?php header("Content-type: text/css"); ?> But, any self-respecting coder knows (perhaps at a paranoid level) that someone will look at their code and not be fooled as easily as the machines.

So an alternative method involves some web-server finagling via a little black magic and one o’ them there .htaccess files with some rules that look like:AddType application/x-httpd-php .css This tells the web server to not send the CSS files directly to your web browser but to route them through the PHP bucket first.

But this was not working for me! So after another round of searching for some kind of a solution, and for all you inter-web architects out there, I found this: AddHandler php-cgi .css Notice the “php-cgi” bit… not all web servers are set up equally. Oh, and I also learned that the difference between the “AddType” vs. “AddHandler” directive is like the difference between “Country Crock” and “I Can’t Believe It’s Not Butter!” whatever that means. So this made it work.

Clarification: this made it work, but still not how I wanted it to work…

I didn’t want to force all my .css files to get PHP’d on. So I plugged in ‘.cssp’ into that special AddHandler line and then… cue drum roll… it didn’t work. But then…! I remembered to change the name of my CSS file to be ‘style.cssp‘ and everything was golden. :)

Clarification: It was more like silver. This is what made it golden:
<FilesMatch "\.(cssp|style)$">
SetHandler php-cgi
</FilesMatch>
Now I can add any number of file extensions that I want PHP’d to the match array without bloating my .htaccess file!

The End.

Website Source Code As Branding

This was a fun find: ASCII art in the website source code. This works because source code is almost always viewed with a monospace font so each column of characters line up just right spanning all the rows; meaning all the characters of the font set each use the same width—for example: the character ‘i’ takes up the same display width as the character ‘m’.

Code branding: Vimeo website source ASCII art

Code branding: Vimeo website source ASCII art

I’ve done this before, but not with website code. At a former place of employment we had a few servers for playing, developing, testing and live-serving the company’s many sites. I used the MOTD file to present (in glorious ASCII art) the name of the server when logging into the shell as an attempt to reinforce to the user which server they actually logged in to, like this:

Server identification as ASCII art via MOTD

Server identification as ASCII art via MOTD

Oh the internets are so much fun!