Sleek Bluebird Theme

Yay! Yet another cool, new theme for one of best Twitter-clients available on the OS X platform: Bluebird. This time, the theme called Sleek is inspired by 2Smoke’s Silent Night Theme for Bowtie, what’s one of the best Bowtie themes available out there btw.

The theme itself is 100% CSS without any pictures besides the background-image. That one’s the same I’ve also already used within my HUD and HUD-Mini themes. I call this environmental-friendly recycling.

I made use of the cool features Safari already implements, like for example round corners or gradients. It’s just nice to see how much can be done using these features – at this point, the CSS hacks replaced any kind of image plus the whole work needed to make gradient-images in HTML/CSS scalable. A very cool time- and work-saver!

However, I hope you enjoy this new Bluebird theme!

Download sleek.bbtheme

Refresh Bluebird Theme

A fresh theme a day. My latest creation for the Bluebird Twitter-client is called “Refresh” – a refreshingly new theme!

This time it’s no modification or port of another app’s theme to Bluebird. Instead, it’s a new theme from scratch. The theme is held in a dark mood combined with orange and sky-blue colorized elements. For the background picture I made use of zygat3r’s Dark Wood wallpaper, which I’ve modified a bit in order to still look good if the window would ever get too big and the image’s borders would be visible.

The icons for the individual tweets are the very same icons from Mark Jardine’s “Mars Metallic” theme, with the difference that I’ve inverted their colors to make them fit better into my theme.

The tweets use rounded corners and all kind of transition effects provided by the WebKit CSS-properties. I actually also inserted a property for making the avatar images have rounded corners, but as it seems either Bluebird or WebKit itself doesn’t honor this at that point.

However, the theme is written using Bluebird’s new theme-definitions and should be compatible with Bluebird 1.0 Beta 1.1 and (hopefully) later.

Enjoy!

Download refresh.bbtheme

Modification of Flarup's "Glow"

Today I’ve just played around a bit with Bluebird and its theme-ability to make it fit more into my actual desktop. First of all, I took a look at what theme I could use best for my first tries. I decided to choose Michael Flarup‘s “Glow”-theme. The theme itself looks very neat and tidy and provides cool effects like avatar-reflections and a menu for each tweet.

First of all, I took some new picks on the colors of each tweet (regular tweet, reply, direct message, own tweet) and turned the gradient around, so that it doesn’t “pop-out” but looks more like “punched-in”. Then, I’ve changed the fonts used by the theme. The CSS definition for the fonts now look this way:


...
font: 12px/16px "Berthold Akzidenz Grotesk BE", "Lucida Grande", "Verdana", "Helvetica Neue", "Arial", Sans-Serif;
...
font: 13px "DIN Medium", "Verdana", "Helvetica Neue", "Arial", Sans-serif;
...


Unfortunately the first fonts to be used (Berthold Akzidenz Grotesk and DIN Medium) are commercial fonts which I can’t just pack-in and distribute. Though, it doesn’t look that bad using the Lucida Grande/Verdana fonts.

However, after that I’ve fixed a bug the theme had at least on my Mac (Safari 4), where the background-height was too small so that a small white line always remained at its list’s bottom.

If you like the theme, feel free to download it here and comment on it.

Enjoy!

Since I’ve already posted a quite descriptive post regarding the theme itself, I won’t beat around the bush now. For those who haven’t read the initial story, here you can review it. You can download the theme by clicking the link at the bottom of this page. Note, that the theme needs the theme-switcher-reloaded Plugin for WordPress to be up and running to work properly. Additional to that, you will need to make some changes to your actual theme, which allows the user to actually switch to the iPhone theme. These changes depend on what theme you are using, but in general you need to modify your theme’s header.php and include a code like this one:

<?php
if(empty($_COOKIE["iphonetheme" . COOKIEHASH]))
{
if (stristr($_SERVER['HTTP_USER_AGENT'], 'iPhone'))
{
echo "<div style=\"background-color: #F66; color: #fff; padding: 8px;\">";
echo "You seem to be browsing this site from your iPhone or iPod Touch.";
echo "Would you like to <a href=\"?wptheme=iphone\" title=\"\">change to the optimized site</a>?";
echo "</div>";
}
}
?>


The iPhone Theme itself already contains a button which provides you to switch back to the regular theme.

However, feel free to download, distribute, modify and have fun with my WordPress iPhone Theme – it’s released under GNU GPLv2!

Download: WordPress iPhone 0.1

The red block let's you choose.

I’ve been now using Prologue for quite a very long time – I guess longer than I’ve ever used one WordPress theme before – and I’m highly pleased of it. However, even that Prologue has a built-in iPhone/iPod Touch browser-detection which cuts away the sidebar and only keeps the important news-stream in focus, I haven’t been very satisfied by that. The font is still pretty small, nearly unreadable, the links are therefor pretty hard to hit, et cetera.

However, yesterday then Andi showed me some pretty nice little framework he just found, what actually doesn’t have anything to do with WordPress itself, but made me think of a very cool idea. The iWebKit-Framework is a small set of CSS and image files that concentrates on building a website in a way so that it looks just like an iPhone or iPod Touch Application. The whole thing’s appearance is pretty sexy, you can take a look at the downloads and get the framework plus some example HTML files for testing.

My optimized front-page.

So, I took a closer look on the iWebKit stuff and did some (again better, a lot of!) PHP WordPress theme hacking. I think I spent the whole night building that thing – but I also think that it was worth it, heh. And I guess, I’ve created a revolutionary and new WordPress theme aimed for the usage on iPhones and iPod Touches – the only problem I had left was: How to I get WordPress to use this theme only on the tiny Safari, but on nothing else? After some more PHP hacking, which included modifying my Prologue theme but not the actual WordPress (what’s the really cool thing within the whole story), I’ve found a way.

When you browse my WordPress now using your iPhone, you should be getting a red message right on top of the site, which tells you that it has detected the tiny Safari and suggests you to use the iPhone optimized theme. If you confirm by clicking the first link, the whole site’s design should get to look just like on the pictures I’ve inserted here.

My contact information - optimized.

I will extend the theme some more, maybe by building in JavaScript effects or other Eye-Candy, to make it fit even better into the iPhones Look & Feel. I was also thinking of some Cover-Flow’ish effect for my Gallery (which at the moment just links to my Picasa-Site, but thanks to the great API provided by Google it shouldn’t be too hard to implement that right into the page).

Maybe, after some more testing I’ll be able to provide it for download, including a whole documentation of how to make it work. Until then, I hope you enjoy browsing my Blog, especially over the iPhone or your iPod Touch. Please feel free to write me your impressions, feedback and also suggestions for improvement by commenting here or writing me an e-mail. So far …

Have fun!

Safari 4 Top Sites

Okay, so for now already two days I’ve been testing the public beta of Apple’s new Safari 4 and I need to say that I’m pretty impressed. While talking to colleagues and friends of mine, who seem to be having quite some problems with the browser-beta, I personally can’t confirm any of these.

The noticeable features regarding Safari 4 are the tabbing-feature, the browser history and of course the brand new and likable ability of displaying a graphical “list” of the most visited websites. However, let’s start with the “Top Sites”. By default, Safari opens this as homepage for each new window. I personally turned it off, since I don’t actually really need such a feature. But I think, Apple just tried to copy Google’s Chrome on that. Yet, the feature is – at least on my internet connection – really slow. In my first test, Safari did not manage it to load all previews in an acceptable amount of time, as you can see on the screenshot. This feature can be turned on by pressing the new button (the one with many tiny squares) contained in the Bookmarks-bar.

The browser-history became something of a mixture of the Top Sites preview-feature with a Cover-Flow combination. By that, the history can be browsed now using a graphical interface that display a preview of each site. And I think I don’t even want to know how much disk space and cpu-power this feature needs… but eh.

And of course the last any maybe most important, noticeable feature: The tabs. Actually, Apple moved the tab bar which was beneath the Bookmarks-bar before right into the window’s title. On the right to corner, there’s now a plus-icon for adding a new tab to the window. Moving tabs within or even across different windows is still as simple as it was before, just that now you know exactly which window contains what tabs, even if the window’s in background with only the title-bar visible.

Safari 4 breaking Adium Style

Of course, Apple also improved the browser’s Webkit backend with many different new features and speed enhancements. This was the first thing I’ve noticed, even without having Safari running. How? Well, somehow, after installing the new beta, restarting the system and opening Adium, my Message-window style was broken. It seems like the new engine does something different regarding the CSS stuff that was used by the theme. By that, the picture-reflection didn’t work out anymore the way they should.

Altogether I’m pretty happy with the upcoming version of Safari and despite all other, negative comments I’ve heard, I have to say that here it’s working pretty cool. Of course, I did not have any obscure plug-ins installed in Safari 3 (oh, wait, I had, Cooliris… where is it now, by the way?) nor do I run a MacOsX86 Hackintosh. Heh.