transmothraI am aware of a problem with viewing this site through the narrow and unrefined lens of IE6. I have a fix for it in mind and will implement it as soon as we are done moving and settled in.
For now, why not get the juicy taste of the Twenty First Century in your mouth with a shiny new web browser? They’re Box Modelicious!
Look out for my B.U.T.T.! I’ve just finished uploading some tweaks to make the Big Urgent Wish theme a little nicer. Please, as always, wear your helmets, and let me know if anything falls on your head. I could always use a good laugh.
I hope to have a sanitized version available soon.
Whew! So far, Big Urgent Wish passes XHTML 1.0 Strict and CSS level 3*!
I have only done the index page, though, so more work is no doubt needed.
*although, due to the opacity: .6 in the CSS for the thickbox plugin I’m using, it doesn’t validate as CSS level 2
The B.U.G. hunt is on! See if you can find all the problems with my new layout… I’ve already identified the ugly 3rd-tier dropdown menu thing on the navbar at the top, but I haven’t had much time yet to test everything out. fixed Later tonight I’ll tweak it and try to get it to behave itself a little better. Please post your comments here (be sure to include your OS/browser). And thanks!
(Things are bound to be a little on the messy side for a few days while I convert this thing over to the new theme.)
EDIT: Yikes! Single posts & pages are also totally unstyled! fixed
This is the color chart I made for orchestrating and managing the background images/colors when using both a style switcher and a browser sniffer to determine which background, exactly, to display for each area of the page. You might even find it useful for your own layouts. The key is below.
Note that the header isn’t really used, and that the content and sidebars (sometimes), and the drop-downs, post meta-data, and my-own-comments boxes (always) use the same background CSS (once for each subtheme).
In all there are 6 × 3 = 18 different CSS inserts for what ended up being one of 4 types of user agents (1. browsers that cannot handle PNG transparency, 2. browsers that can and receive special message A, 3. browsers that can and receive special message B, and 4) all other user agents).
So, yeah, you can tell that this is becoming a bit of a logistical nightmare for me! Nevertheless, I’m pretty confident that once I’ve got the thing done, it’ll be easy to extend.
I’m trying to make the learning curve for anyone else as shallow as I can. Here’s how it breaks down for anyone wishing to add their own subtheme:
styles.incsniffer.inc
header.php so that cookies don’t retain old style names (there must be an easier way to do this; maybe someone will come along and improve this step so it’s automated; nevertheless, it currently only requires inserting the style names into two lines of existing code, towards the top of the page)Not too terribly bad, I think, all things considered.
Key:
| (A) | header |
| E | navbar |
| B (+C+D) | content |
| (C+D) | sidebar |
| F+G+H+I | contrast |
| J | comment1 |
| K | comment2 (alternating) |
One thing about PHP is that it can get pretty complicated. CSS can get complicated enough on its own, with one class referencing any element on the page, pointing here and there. But when you combine the two… you’ve got something pointing to something which points to something that’s pointing at a thing which references anything you choose. See how crazy this stuff can get?
What I’ve been doing the past couple of days is turning my CSS files into dynamic style sheets, renaming them with .php extensions and serving them up, after preprocessing, as CSS. Doing this allows me to use a thing called a sniffer which looks at the User Agent string browsers send when doing HTTP requests to servers, which allows me to see to what I’m delivering content, $Browser on $Platform (e.g., Safari browser on Mac OS X), so that I can send either PNG images or GIFs. The only real reason for doing this is just because PNGs can be semi-transparent, except that all but the very latest Internet Explorer beta have serious problems reading semi-transparency (called “alpha” transparency).
This is something of a specialty of mine. For those who know me online, my old site was one of the first wave of sites to use semi-transparent backgrounds.
Like I said, this is complicated stuff. So now I’ve got a sniffer going “if $browser equals ‘IE’ on Win, set $imgExt to ‘.gif’, otherwise set $imgExt to ‘.png'”. And then I’m making a PNG and a GIF for every background that I want to see through. Meanwhile, all three subthemes have got several places where they reference $imgFileXX.$imgExt for different backgrounds.
So I’m pointing, and I’m pointing, and I’m pointing, referencing this variable to get to that variable to get to an image file to put in an element. Up until this very moment, I was doing all this without a particularly coherent strategy. That changes. Now. Because I only just now realized that I had been rearranging things trying to come up with reasonable alternative GIF images to send to Infernal Exploiter versions less than 7, and I’ve turned around at noticed that I have left one hell of a wreck in my wake. I now have way too many unused background images (failed experiments), and have tossed the variables standing in for the filenames like so much salad, resulting in a chaotic mess for all the good browsers out there who actually know how to deal with PNG images!
Guess you’d have to be there.
So tomorrow, I’m going to sit and think and make a god damned chart, so I can have a set pattern across all subthemes (e.g., Image5 is for alternate comments, Image10 is for the post background).
As they say, hindsight is 20/20.
Oh, btw, I’ve named the first three subthemes “Leather” (brown and tan spaceship interior), “Saturn” (white, black, and dark teal; very clean and high-contrast), and “transmothra 3.0” (black, smoky indigo, and blue) (this last being a bit of an homage to the final version of my very nicely done old site, thankyouverymuch).
Now that I’ve said all that… it’s probably going to be another week before this thing is actually ready enough to be unveiled. It’ll be worth the wait, I promise.
Sigh.
Having CSS issues with IE (even IE7). Still trying to figure out why. So far, Big Urgent Wish works absolutely perfectly in Firefox and Opera, but in IE7 there’s irrational whitespace to the right (about the width of one of the sidebars), causing a horizontal scrollbar, while IE6 isn’t applying the opacity filter to the center div or footer (a width issue is my first guess on that one).
Once I get these issues ironed out, I’ll upload the thing and see what happens then.
[UPDATE] Just got back from Grog‘s (picking up CDs to review for the Chickenfish Speaks) and groceries. To make a crap day off crappier, on the way there, the “low tire pressure” light came on. Fearing an impending flat, I bolted, stopping at the gas station to pay 50 cents for three minutes of standing in the wind and rain, wishing I had a tire gauge and a flashlight. One tire was missing a stem cap, so that’s probably all it was, since all of the tires seemed reasonably inflated to me.Did anyone see Bush’s press conference today? Scary, creepy, and pathetic. I’ll blog more about that later.
Do you ever get to the last steps of the first major phase of a project, only to freeze up? Don’t get me wrong. This particular freeze will only last, at most, a couple of hours. I’ve just realized that I will be done enough to upload and try out my new WordPress theme, Big Urgent Wish, once I create a few insanely simple GIF backgrounds. The only thing left for this phase is to install plugins and create stylesheets for print and small screen formats. Which I don’t even actually need to do at all at this stage. But then comes the daunting task of backing everything up, taking a deep breath, and hitting “transfer” on my FTP client.
Maybe if I create a safety checklist it will help me to feel a little better.
But I wonder if i just don’t want the initial design phase to end? I do so love the process of creation. There’s nothing more thrilling or exhilarating than starting nearly from scratch and making something cool, whether it be a work of prose, visual art, music, or merely a little theme for your blog.
And I don’t care quite as much for the next processes: final testing, installation, distribution, etc. Imagine spending countless hours putting your heart and soul and everything you’ve learned into creating a work of visual art, and then having to drive it to the gallery and install it yourself, then standing around waiting for someone to awkwardly tell you that they liked or didn’t like it, finally having to make arrangements to send it home with someone else.*
*Nearly unrelated: Incidentally, I’ve never been able to let myself sell or give away any of my visual artworks, either – thank “Bob” for digital distribution channels for my other creative ventures like music and web design, thusly letting me keep the originals!
I really only have one thing left to do before I upload and activate the preview of the Big Urgent Wish WordPress theme. It’s a bit of a killer. It’s actually quite easy, but the logistics are making me swoon a bit just now. Mind you, once I have it all down, the installation will be a breeze for anyone familiar with the mind-bogglingly super-easy process of downloading and using a new WordPress theme. (The basic gist is this: download a theme, upload it to your Themes directory, and then activate it. That’s all there is.)
Here’s what I gotta do: because my theme uses semi-transparent PNG graphics for backgrounds in some places, any version of IE under 7 will not display them properly. Therefore, I have a browser sniffing PHP routine to determine what, exactly, the platform/browser are… and, hence, what the User Agent is capable of supporting (assuming UA string spoofing is not taking place).
Thus, by renaming *.css files as *.css.php (the “.css” bit is unnecessary but useful), and by parsing those files as CSS (after, of course, being processed as PHP), I can substitute GIF images instead for the crippled masses.
However, this entails a bit more typing and rearranging than I care to stomache today, so I will put it off until tomorrow (a day off from work).
Incidentally, the name “Big Urgent Wish” came to me one day as I was at my day (read: night) job (answering e-mails for a big-name online fashion retailer), extrapolating on some of the strangely translated phrases we sometimes get from non-English speaking customers abroad. This is not a phrase that was directly written out by anyone, it’s just something I thought up while trying to come up with something to top a goofy phrase I once read. As an aside, I embrace non-English speaking peoples… and, equally, the unusual and poetic, evocative turns of phrase that they can sometimes be capable of producing. Isn’t language even more wonderful from alternate angles?
Big Urgent Wish 3.0 is nearing readiness! The third subtheme has been completed.
Done:
if (function_exists()) or if (class_exists()) loops) for several useful plugins, including Browser Sniff, CustomComments, Gravatars, Landing sites, Link Indication, Now Reading, Now Watching, Popularity Contest, Related Posts, Sociable, ThickBox Plugin, Ultimate Tag Warrior, Viper’s Plugins Used, WP Random Title, WP-EMail, WP-Print, iTunesSpy, muTunes:hover and background: fixed tricksTo do:
Additionally, I’ve decided that it’ll probably launch with just three subthemes, due to time constraints; however, more subthemes will be available later.
Screenshots:
Still working on the new theme. Actually, the theme’s done, it’s the subthemes that are killing me. I’ve got the first one about 90% done, and almost as much on the second. The main thing is separating the stylesheets into usable, selectable chunks.
Boy, is this gonna be purty!
I’m also gearing up for some podcasting for the nearish future. Should be interesting. More details to come….
I think I’m getting carpal tunnel syndrome. Nevertheless, I’ve been doing a lot of typing lately. I just submitted my first batch of CD reviews for the Chickenfish Speaks, a terrific local entertainment zine run by Grog, the former bass player for local rock legends the ¡Oxymorons!.
Also, I’m still hard at work on Big Urgent Wish 3.0, my first real WordPress theme. (My current theme is based largely on the Ice theme.) It’s coming along nicely. I’ve completed the first of three subthemes. But first, a To Do: separate stylesheets into color/layout (possibly separating these further), font size, and font type (serif or sans-serif). Then I need to clean up what I’ve got and then I can finally start to work on the other two subthemes.
Haven’t been feeling 100%, so I’m working on making my own WordPress theme from scratch (though I’ll admit to scraping a little code from other themes). My current theme is called “Big Urgent Wish 2.0”, and it’s based on another theme, but i’ve decided to reuse the name and call it 3.0. This one will be a three column layout.
It’s coming along flamingly so far. It looks beautiful and has tons of really tasty hover effects. Works very well in Firefox, Opera, and IE. It’s a plush, spacey theme, with burnt oranges, ambery peaches, and velvety browns.
I’m also planning on having it support style switching, Widgets, and all of the plugins I currently use. AJAX is under consideration as well.
This will most likely end up being my first public WordPress theme.