m/blog
1
0
Fork 0
mirror of https://github.com/kremalicious/blog.git synced 2024-11-22 09:56:51 +01:00
Code

post edits down to 2009

Browse Source
This commit is contained in:
Matthias Kretschmann 2013-11-20 23:03:07 +01:00
parent 5a1ab30c18
commit 013283f09b
17 changed files with 139 additions and 369 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
_src/_posts/2009-01-05-the-mac-in-futurama.markdown
View File

@ -11,41 +11,14 @@ categories:
--- ---
![The Mac in Futurama](/media/futurama-mac-teaser.png) ![The Mac in Futurama](/media/futurama-mac-teaser.png)
Time for some Mac Futurama crossover geekiness! In a fun watching process I've compiled a list of all the references to Apple's Macintosh and other Apple products. In Futurama we mainly see references to the old, classic Macs running [System 6](http://en.wikipedia.org/wiki/Apple_System_Software_6), [System 7](http://en.wikipedia.org/wiki/System_7) or [OS 9](http://en.wikipedia.org/wiki/Mac_OS_9) ending with the colorful iMac G3. This is likely caused by the timeframe in which Matt Groening and David X. Cohen developed the first season of Futurama (1997-1999). Time for some Mac Futurama crossover geekiness! In a fun watching process I've compiled a list of all the references to Apple's Macintosh and other Apple products. In Futurama we mainly see references to the old, classic Macs running [System 6](http://en.wikipedia.org/wiki/Apple_System_Software_6), [System 7](http://en.wikipedia.org/wiki/System_7) or [OS 9](http://en.wikipedia.org/wiki/Mac_OS_9) ending with the colorful iMac G3. This is likely caused by the timeframe in which Matt Groening and David X. Cohen developed the first season of Futurama (1997-1999).
So the following screens from Futurama refer all to Macs available in or before 1999. Also you'll find some nice links to downloadable Futurama stuff for your Mac at the end of this article. And may the lawyers of Twentieth Century Fox now please stop reading. So the following screens from Futurama refer all to Macs available in or before 1999. Also you'll find some nice links to downloadable Futurama stuff for your Mac at the end of this article. And may the lawyers of Twentieth Century Fox now please stop reading.
<!-- more --> <!-- more -->
For orientation: I've followed the original four season production cycle and not Fox's five seasons splitting. The "real" Season 5 are the recently released DVD movies/Episodes on Comedy Central. For orientation: I've followed the original four season production cycle and not Fox's five seasons splitting. The "real" Season 5 are the recently released DVD movies/Episodes on Comedy Central.
* Season 1
* Season 2
* Season 3
* Season 4
* Season 5
* Futurama Stuff For Your Mac
_All screens (C) 1999 by Twentieth Century Fox Film Corp._ _All screens (C) 1999 by Twentieth Century Fox Film Corp._
@ -53,9 +26,6 @@ _All screens (C) 1999 by Twentieth Century Fox Film Corp._
## Season 1 ## Season 1
## 1ACV02 - The Series Has Landed ## 1ACV02 - The Series Has Landed

39
_src/_posts/2009-02-01-portal-thingy.markdown
View File

@ -1,21 +1,20 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-02-01 06:01:28+00:00
layout: post layout: post
slug: portal-thingy
title: 'Portal Thingy: matthiaskretschmann.com' title: 'Portal Thingy: matthiaskretschmann.com'
image:
author: Matthias Kretschmann
date: 2009-02-01 06:01:28+00:00
wordpress_id: 504 wordpress_id: 504
categories: categories:
- personal - personal
--- ---
Just some self reference here. I've launched a slick new site under [matthiaskretschmann.com](http://matthiaskretschmann.com) today which has an absolute simple concept. It's kind of a digital business card site for being digitally present under my name. Beside that it has Links to my social media stuff so it's easier for you to stalk me. In the 90's we probably would have called it a Portal.
[![matthiaskretschmann.com](/media/vcardsite-mk.png)](http://matthiaskretschmann.com) [![matthiaskretschmann.com](/media/vcardsite-mk.png)](http://matthiaskretschmann.com)
Just some self reference here. I've launched a slick new site under [matthiaskretschmann.com](http://matthiaskretschmann.com) today which has an absolute simple concept. It's kind of a digital business card site for being digitally present under my name. Beside that it has Links to my social media stuff so it's easier for you to stalk me. In the 90's we probably would have called it a Portal.
<!-- more -->
As you can read in the sliding Colophon at the bottom of the site, it is written in valid XHTML 1.1 and CSS3 code and makes heavy use of jQuery. But, of course, it is fully functional without JavaScript enabled. Even the tab interface remains intact in such a case which is done by some PHP magic. Just the print and text-size buttons in the lower right will be gone without JavaScript. But that's ok because their functionality can be implemented just with JavaScript anyway. As you can read in the sliding Colophon at the bottom of the site, it is written in valid XHTML 1.1 and CSS3 code and makes heavy use of jQuery. But, of course, it is fully functional without JavaScript enabled. Even the tab interface remains intact in such a case which is done by some PHP magic. Just the print and text-size buttons in the lower right will be gone without JavaScript. But that's ok because their functionality can be implemented just with JavaScript anyway.
For your learning pleasure I've let my comments in my [jQuery file](http://matthiaskretschmann.com/js/effects.js) intact and you'll also find the sources for code-parts where I didn't wanted to invent the wheel again. Although slightly modified by me, this includes the code for the vCard popup bubble when hovering over the header ([by jqueryfordesigner.com](http://jqueryfordesigners.com/coda-popup-bubbles/)) and the text-resizing function ([from dev-tips.com](http://dev-tips.com/featured/jquery-tip-font-resizing-with-animation-effects)) . For your learning pleasure I've let my comments in my [jQuery file](http://matthiaskretschmann.com/js/effects.js) intact and you'll also find the sources for code-parts where I didn't wanted to invent the wheel again. Although slightly modified by me, this includes the code for the vCard popup bubble when hovering over the header ([by jqueryfordesigner.com](http://jqueryfordesigners.com/coda-popup-bubbles/)) and the text-resizing function ([from dev-tips.com](http://dev-tips.com/featured/jquery-tip-font-resizing-with-animation-effects)) .
@ -38,8 +37,6 @@ If you find a bug or have any additions feel free to [contact me](/contact), pos
## Inspiration ## Inspiration
With the concept of this little site I've kinda jumped on the bandwagon which obviously was started by [Tim van Damme's excellent small site under timvandamme.com](http://timvandamme.com/). With the concept of this little site I've kinda jumped on the bandwagon which obviously was started by [Tim van Damme's excellent small site under timvandamme.com](http://timvandamme.com/).
[![timvandamme.com](/media/vcardsite-tim.png)](http://timvandamme.com) [![timvandamme.com](/media/vcardsite-tim.png)](http://timvandamme.com)
@ -52,37 +49,13 @@ Another great version based on Tim's concept was crafted by [Mr. Foliage-O-Meter
Finally I find it very interesting to compare the jQuery code of the three sites afterwards. We all have some sort of tab interface with fancy stuff going on when the tabs change. But we wrote three completely different versions of code for that purpose but all with the same JavaScript library. Oh mighty flexible jQuery! Finally I find it very interesting to compare the jQuery code of the three sites afterwards. We all have some sort of tab interface with fancy stuff going on when the tabs change. But we wrote three completely different versions of code for that purpose but all with the same JavaScript library. Oh mighty flexible jQuery!
## More Business Card Style Sites ## More Business Card Style Sites
![lbaumann.com](/media/vcardsite-laurent.png) ![lbaumann.com](/media/vcardsite-laurent.png)
[Icon- and UI-Designer Laurent Baumann](http://lbaumann.com/) [Icon- and UI-Designer Laurent Baumann](http://lbaumann.com/)
![maximilianschoening.com](/media/vcardsite-maximilian.png) ![maximilianschoening.com](/media/vcardsite-maximilian.png)
[Interface-Designer Maximilian Schöning](http://www.maximilianschoening.com/) [Interface-Designer Maximilian Schöning](http://www.maximilianschoening.com/)
![arefjdey.com](/media/vcardsite-arefjdey.png) ![arefjdey.com](/media/vcardsite-arefjdey.png)
[Consultant & Blogger Aref Jdey (Design & Code by yours truly)](http://www.arefjdey.com/) [Consultant & Blogger Aref Jdey (Design & Code by yours truly)](http://www.arefjdey.com/)
If you run such a site or know of other business card style sites, feel free to post them in the comments.

25
_src/_posts/2009-02-17-out-of-whale-oil.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-02-17 20:11:55+00:00
layout: post layout: post
slug: out-of-whale-oil
title: '"We Are Out Of Whale Oil"' title: '"We Are Out Of Whale Oil"'
image: Teaser-Out-Of-Whale-Oil.jpg
author: Matthias Kretschmann
date: 2009-02-17 20:11:55+00:00
wordpress_id: 533 wordpress_id: 533
categories: categories:
- goodies - goodies
@ -13,32 +14,18 @@ categories:
Simple, high-resolution Futurama tribute wallpaper pack inspired by the latest Futurama movie Into The Wild Green Yonder. This pack includes 4 versions of the Planet Express ship whale oil indicator in 2 different sizes for desktop and iPhone use. Vivid pink Feminista versions included too ;-) Simple, high-resolution Futurama tribute wallpaper pack inspired by the latest Futurama movie Into The Wild Green Yonder. This pack includes 4 versions of the Planet Express ship whale oil indicator in 2 different sizes for desktop and iPhone use. Vivid pink Feminista versions included too ;-)
<!-- more -->
![Futurama: Out Of Whale Oil Wallpaper Detail](/media/out_of_whale_oil_detail.png)Here're the details for the whole pack: ![Futurama: Out Of Whale Oil Wallpaper Detail](/media/out_of_whale_oil_detail.png)Here're the details for the whole pack:
* 2 high-rez widescreen desktop versions with empty and full whale oil indicator (2560x1600) * 2 high-rez widescreen desktop versions with empty and full whale oil indicator (2560x1600)
* 2 iPhone versions with empty and full whale oil indicator (320x480) * 2 iPhone versions with empty and full whale oil indicator (320x480)
* 2 Feminista versions high-rez widescreen desktop versions with empty and full whale oil indicator (2560x1600) * 2 Feminista versions high-rez widescreen desktop versions with empty and full whale oil indicator (2560x1600)
* 2 Feminista iPhone versions with empty and full whale oil indicator (320x480) * 2 Feminista iPhone versions with empty and full whale oil indicator (320x480)
* Icon folder files for this wallpaper release * Icon folder files for this wallpaper release
[![Futurama: Out Of Whale Oil Wallpaper Pack by kremalicious](/media/out-of-whale-oil-overview.png)](http://www.kremalicious.com/goodies/#wall) [![Futurama: Out Of Whale Oil Wallpaper Pack by kremalicious](/media/out-of-whale-oil-overview.png)](http://www.kremalicious.com/goodies/#wall)
Seriously, the pink versions are burning my eyes but the pink is a good reference to the events in the recent movie ;-) Seriously, the pink versions are burning my eyes but the pink is a good reference to the events in the recent movie ;-)
The whole wallpaper pack can be downloaded [from the Goodies section on my website](http://www.kremalicious.com/goodies/) or via this button: The whole wallpaper pack can be downloaded [from the Goodies section on my website](http://www.kremalicious.com/goodies/) or via this button:
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/out-of-whale-oil-wall-by-kremalicious.zip">Download</a>

180
_src/_posts/2009-03-29-ultimate-coda-wordpress-share-link-bonanza.markdown
View File

File diff suppressed because one or more lines are too long

17
_src/_posts/2009-06-04-twitter-crisp.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-06-04 00:16:40+00:00
layout: post layout: post
slug: twitter-crisp
title: Twitter Crisp title: Twitter Crisp
image: Teaser-Twitter-Crisp.jpg
author: Matthias Kretschmann
date: 2009-06-04 00:16:40+00:00
wordpress_id: 794 wordpress_id: 794
categories: categories:
- goodies - goodies
@ -13,16 +14,14 @@ categories:
Here's a quick twitter icon for use on your websites which is kind of a by-product from one of my last projects. But I would consider it a waste to just bury this deep in my filesystem so I think it's best I'm throwing this out to you. ;-) Here's a quick twitter icon for use on your websites which is kind of a by-product from one of my last projects. But I would consider it a waste to just bury this deep in my filesystem so I think it's best I'm throwing this out to you. ;-)
<!-- more -->
This icon comes in various formats (PNG, ICNS, iContainer) and in 4 different sizes (128px, 48px, 32px, 16px) with each icon size redrawn (of course). Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab these icons while they're hot. This icon comes in various formats (PNG, ICNS, iContainer) and in 4 different sizes (128px, 48px, 32px, 16px) with each icon size redrawn (of course). Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab these icons while they're hot.
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/twitter-crisp-by-kremalicious.zip">Download</a>
Use them on any web project you like and/or [convert them into a send to twitter link](http://www.kremalicious.com/2009/03/ultimate-coda-wordpress-share-link-bonanza/). Have fun! Use them on any web project you like and/or [convert them into a send to twitter link](http://kremalicious.com/ultimate-coda-wordpress-share-link-bonanza/). Have fun!
These icons are free for **all your personal and commercial projects** following the [Creative Commons Attribution-No Derivative Works 3.0 License](http://creativecommons.org/licenses/by-nd/3.0/). All I'm asking you is to link back to this URL if you use this twitter icon: These icons are free for **all your personal and commercial projects** following the [Creative Commons Attribution-No Derivative Works 3.0 License](http://creativecommons.org/licenses/by-nd/3.0/). All I'm asking you is to link back to this URL if you use this twitter icon:
[http://www.kremalicious.com/2009/06/twitter-crisp/](http://www.kremalicious.com/2009/06/twitter-crisp/) [http://kremalicious.com/twitter-crisp/](http://www.kremalicious.com/twitter-crisp/)
[![Creative Commons License](http://creativecommons.org/images/public/somerights20.png)](http://creativecommons.org/licenses/by-nd/3.0/)Twitter Crisp Icon by [Matthias Kretschmann](http://kremalicious.com) is licensed under a [Creative Commons Attribution-No Derivative Works 3.0 License](http://creativecommons.org/licenses/by-nd/3.0/). [![Creative Commons License](http://creativecommons.org/images/public/somerights20.png)](http://creativecommons.org/licenses/by-nd/3.0/)Twitter Crisp Icon by [Matthias Kretschmann](http://kremalicious.com) is licensed under a [Creative Commons Attribution-No Derivative Works 3.0 License](http://creativecommons.org/licenses/by-nd/3.0/).

20
_src/_posts/2009-06-24-adiumeetie.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-06-24 21:00:38+00:00
layout: post layout: post
slug: adiumeetie
title: Adiumeetie. Tweetie Style Adium Icon title: Adiumeetie. Tweetie Style Adium Icon
image: Teaser-Adiumeetie.jpg
author: Matthias Kretschmann
date: 2009-06-24 21:00:38+00:00
wordpress_id: 844 wordpress_id: 844
categories: categories:
- goodies - goodies
@ -13,8 +14,6 @@ categories:
Here's a new desktop goodie for your pleasure. It's a replacement dock icon for the popular Mac IM client [Adium](http://adium.im/) following the style of atebit's excellent [Tweetie for Mac](http://www.atebits.com/tweetie-mac/) icon. Here's a new desktop goodie for your pleasure. It's a replacement dock icon for the popular Mac IM client [Adium](http://adium.im/) following the style of atebit's excellent [Tweetie for Mac](http://www.atebits.com/tweetie-mac/) icon.
<!-- more -->
![Adiumeetie Teaser](/media/Adiumeetie-Teaser.jpg) ![Adiumeetie Teaser](/media/Adiumeetie-Teaser.jpg)
While the Tweetie Mac icon (and it's UI) was discussed quite controversial (which caused some very nice Tweetie replacement icons to appear, like [here](http://jonasraskdesign.com/medias/medias.html), [here](http://iconblock.deviantart.com/art/Tweetie-Mix-120360482), [here](http://macthemes2.net/forum/viewtopic.php?id=16795744) or [here](http://www.flickr.com/photos/marcelomarfil/3611311439/)), I grew to like the style of it. But Adium beside Tweetie in the Dock just looked weird... (No offense, [Adam](http://www.artofadambetts.com/weblog/?p=108) ;-)) So I redrew the whole icon and used Adium's duck silhouette on it and made some obvious and subtle changes in comparison to the Tweetie icon. And thanks to [Loren](http://blog.atebits.com/) who kind of rubber-stamped this icon release. While the Tweetie Mac icon (and it's UI) was discussed quite controversial (which caused some very nice Tweetie replacement icons to appear, like [here](http://jonasraskdesign.com/medias/medias.html), [here](http://iconblock.deviantart.com/art/Tweetie-Mix-120360482), [here](http://macthemes2.net/forum/viewtopic.php?id=16795744) or [here](http://www.flickr.com/photos/marcelomarfil/3611311439/)), I grew to like the style of it. But Adium beside Tweetie in the Dock just looked weird... (No offense, [Adam](http://www.artofadambetts.com/weblog/?p=108) ;-)) So I redrew the whole icon and used Adium's duck silhouette on it and made some obvious and subtle changes in comparison to the Tweetie icon. And thanks to [Loren](http://blog.atebits.com/) who kind of rubber-stamped this icon release.
@ -24,21 +23,14 @@ The icon comes in various formats (iContainer, icns, png) in sizes from 512px-16
![Adiumeetie States](/media/Adiumeetie-Teaser-AdiumIcon.png) ![Adiumeetie States](/media/Adiumeetie-Teaser-AdiumIcon.png)
## Download ## Download
Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab this icon while it's hot. Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab this icon while it's hot.
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/adiumeetie-by-kremalicious.zip">Download</a>
## Adium Icon Usage ## Adium Icon Usage
![Adiumeetie Dock Preview](/media/Adiumeetie-Dock-Preview.png)Just double click the Adiumeetie.AdiumIcon file and the dock icon gets installed automatically. Then you can select the icon in Adium's preferences under Appearance > Dock Icon from the drop-down menu. After this the icon should be ready as your new Adium icon both in the Dock and in your Applications folder. ![Adiumeetie Dock Preview](/media/Adiumeetie-Dock-Preview.png)Just double click the Adiumeetie.AdiumIcon file and the dock icon gets installed automatically. Then you can select the icon in Adium's preferences under Appearance > Dock Icon from the drop-down menu. After this the icon should be ready as your new Adium icon both in the Dock and in your Applications folder.
The icon is free for your personal use and I hope you'll enjoy it. If you do, don't forget to [spread the word via Twitter](http://twitter.com/home?status=Adiumeetie%3A%20Tweetie%20Style%20Adium%20Dock%20Icon%20from%20%40kremalicious%20http://kremalicious.com/adiumeetie/) and all your other favorite social media sites. The icon is free for your personal use and I hope you'll enjoy it. If you do, don't forget to [spread the word via Twitter](http://twitter.com/home?status=Adiumeetie%3A%20Tweetie%20Style%20Adium%20Dock%20Icon%20from%20%40kremalicious%20http://kremalicious.com/adiumeetie/) and all your other favorite social media sites.

41
_src/_posts/2009-09-05-delibar.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-09-05 19:07:31+00:00
layout: post layout: post
slug: delibar
title: Delibar Interface Replacement Icons title: Delibar Interface Replacement Icons
image: Teaser-Delibar-Icons.jpg
author: Matthias Kretschmann
date: 2009-09-05 19:07:31+00:00
wordpress_id: 936 wordpress_id: 936
categories: categories:
- goodies - goodies
@ -13,48 +14,20 @@ categories:
[Delibar](http://www.shinyfrog.net/en/software/delibar/) from [Shiny Frog](http://www.shinyfrog.net) is a [delicious.com](http://delicious.com/) desktop client for OS X which sits in your menubar and gives you quick access to your bookmarks on delicious. But the default menubar icon and the other interface icons look quite disturbing so I've made these simple replacement icons for the [Delibar](http://www.shinyfrog.net/en/software/delibar/) interface. [Delibar](http://www.shinyfrog.net/en/software/delibar/) from [Shiny Frog](http://www.shinyfrog.net) is a [delicious.com](http://delicious.com/) desktop client for OS X which sits in your menubar and gives you quick access to your bookmarks on delicious. But the default menubar icon and the other interface icons look quite disturbing so I've made these simple replacement icons for the [Delibar](http://www.shinyfrog.net/en/software/delibar/) interface.
<!-- more --> <p class="alert alert-block alert-info">Please Note: Shinyfrog released a <a href="http://www.delibarapp.com/">refreshed version of Delibar</a> which sports a nice and completely different UI. So using these icons here along with this new version is probably no good idea.</p>
Please Note: Shinyfrog released a [refreshed version of Delibar](http://www.delibarapp.com/) which sports a nice and completely different UI. So using these icons here along with this new version is probably no good idea ;-)
## Download ## Download
Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab these replacement icons. Just head over [to my Goodies page](http://www.kremalicious.com/goodies/) or click the following download button and grab these replacement icons.
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/delibar-by-kremalicious.zip">Download</a>
## Icon Usage ## Icon Usage
We're going to replace the default app resources so you should do a backup of the Delibar app or just download a [fresh copy from Shiny Frog](http://www.shinyfrog.net/en/software/delibar/) if anything goes wrong or looks weird. We're going to replace the default app resources so you should do a backup of the Delibar app or just download a [fresh copy from Shiny Frog](http://www.shinyfrog.net/en/software/delibar/) if anything goes wrong or looks weird.
1. Close Delibar if it's running 1. Close Delibar if it's running
2. Ctrl + click or right-click on the Delibar app in your Applications folder and choose _Show Package Contents_ 2. Ctrl + click or right-click on the Delibar app in your Applications folder and choose _Show Package Contents_
3. In the opened Finder window browse to Contents > Resources 3. In the opened Finder window browse to Contents > Resources
4. Drag the contents of the _Icon Resources_ folder from the download package into this place, replacing the current files 4. Drag the contents of the _Icon Resources_ folder from the download package into this place, replacing the current files
5. Start Delibar and enjoy! 5. Start Delibar and enjoy!

41
_src/_posts/2009-12-17-wordpress-post-thumbnails.markdown
View File

@ -1,10 +1,10 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2009-12-17 04:00:21+00:00
layout: post layout: post
slug: wordpress-post-thumbnails
title: Using The New Post Thumbnail Feature In WordPress 2.9 title: Using The New Post Thumbnail Feature In WordPress 2.9
author: Matthias Kretschmann
date: 2009-12-17 04:00:21+00:00
wordpress_id: 959 wordpress_id: 959
categories: categories:
- design - design
@ -14,21 +14,28 @@ tags:
![Wordpress Logo by kremalicious](/media/wordpress-logo.png)WordPress 2.9 added a new feature which allows you to assign an image to an article to make it the post image like it's often used in magazine style themes. This new feature along with a new template tag makes all the custom field hacks usually used for this functionality in the past obsolete. So here's a quick walkthrough to make use of the new post thumbnail feature and of course how to make it backwards compatible. ![Wordpress Logo by kremalicious](/media/wordpress-logo.png)WordPress 2.9 added a new feature which allows you to assign an image to an article to make it the post image like it's often used in magazine style themes. This new feature along with a new template tag makes all the custom field hacks usually used for this functionality in the past obsolete. So here's a quick walkthrough to make use of the new post thumbnail feature and of course how to make it backwards compatible.
<!-- more -->
## 1. Activate The Feature ## 1. Activate The Feature
![Add WordPress Post Thumbnail Support To Theme](/media/wordpress-thumbnail-1.png)For whatever reason you first have to activate the feature with an entry in your theme's _functions.php_ file in order to get the Post Thumbnail box in the Editor. ![Add WordPress Post Thumbnail Support To Theme](/media/wordpress-thumbnail-1.png)For whatever reason you first have to activate the feature with an entry in your theme's _functions.php_ file in order to get the Post Thumbnail box in the Editor.
So just open up your theme's _functions.php_ file in your favorite editor or create it if there's no such file in your theme folder. Add this little code snippet to this file: So just open up your theme's _functions.php_ file in your favorite editor or create it if there's no such file in your theme folder. Add this little code snippet to this file:
{% highlight php %}add_theme_support('post-thumbnails');{% endhighlight %}
For backwards compatibility you should wrap this inside a function check for the new add_theme_support:
{% highlight php %}if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' );{% endhighlight %}
This makes sure WordPress installation prior to 2.9 won't get screwed up when using a theme with this new feature.
{% highlight php %}
<?php
add_theme_support('post-thumbnails');
?>
{% endhighlight %}
For backwards compatibility you should wrap this inside a function check for the new `add_theme_support`:
{% highlight php %}
<?php
if ( function_exists( 'add_theme_support' ) )
add_theme_support( 'post-thumbnails' );
?>
{% endhighlight %}
This makes sure WordPress installation prior to 2.9 won't get screwed up when using a theme with this new feature.
## 2. Add A Post Thumbnail To Your Post ## 2. Add A Post Thumbnail To Your Post
@ -69,19 +76,22 @@ The code will output a generic `<img />` tag with a class of wp-post-image. Need
If you want to adjust the generated output of the <img /> tag you can do this by using some array stuff. So let's say you want to have the post thumbnails to be 200x200px big and another class assigned to it, you can extend the template tag like so: If you want to adjust the generated output of the <img /> tag you can do this by using some array stuff. So let's say you want to have the post thumbnails to be 200x200px big and another class assigned to it, you can extend the template tag like so:
{% highlight php %}<?php the_post_thumbnail(array( 200,200 ), array( 'class' => 'alignleft' )); ?>{% endhighlight %} {% highlight php %}<?php the_post_thumbnail(array( 200,200 ), array( 'class' => 'alignleft' )); ?>{% endhighlight %}
If you want to add more than one class you can do this like so: If you want to add more than one class you can do this like so:
{% highlight php %}<?php the_post_thumbnail('medium', array('class' => 'alignleft another_class')); ?>{% endhighlight %} {% highlight php %}<?php the_post_thumbnail('medium', array('class' => 'alignleft another_class')); ?>{% endhighlight %}
And you can add any attributes to the <img /> tag like a title, rel or an alt attribute. For accessibility reasons you should always add at least the alt-attribute: And you can add any attributes to the `<img />` tag like a `title`, `rel` or an `alt` attribute. For accessibility reasons you should always add at least the alt-attribute:
{% highlight php %}<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext')); ?>{% endhighlight %} {% highlight php %}<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext')); ?>{% endhighlight %}
As for the title attribute this will be grabbed automatically from the entry you've made in your Media Library during the upload process but you even could override this too: As for the title attribute this will be grabbed automatically from the entry you've made in your Media Library during the upload process but you even could override this too:
{% highlight php %}<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext', 'title' => 'titletext')); ?>{% endhighlight %} {% highlight php %}
<?php the_post_thumbnail('medium', array('class' => 'alignleft', 'alt' => 'alttext', 'title' => 'titletext')); ?>
{% endhighlight %}
@ -93,6 +103,7 @@ Finally if you want to respect the custom sizes you or your users have set under
{% highlight php %}<?php {% highlight php %}<?php
$width = get_option('thumbnail_size_w'); // get the width of the thumbnail setting $width = get_option('thumbnail_size_w'); // get the width of the thumbnail setting
$height = get_option('thumbnail_size_h'); // get the height of the thumbnail setting $height = get_option('thumbnail_size_h'); // get the height of the thumbnail setting
the_post_thumbnail(array($width, $height), array('class' => 'alignleft')); the_post_thumbnail(array($width, $height), array('class' => 'alignleft'));
?>{% endhighlight %} ?>{% endhighlight %}

19
_src/_posts/2010-02-04-ipixelpad.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2010-02-04 15:21:42+00:00
layout: post layout: post
slug: ipixelpad
title: iPixelPad - Tongue Twisting But Crisp iPad Icons title: iPixelPad - Tongue Twisting But Crisp iPad Icons
image: Teaser-iPixelPad.png
author: Matthias Kretschmann
date: 2010-02-04 15:21:42+00:00
wordpress_id: 1092 wordpress_id: 1092
categories: categories:
- goodies - goodies
@ -13,8 +14,6 @@ categories:
So, what to do when [everyone seem](http://www.littleboxofideas.com/blog/design-resources/5-very-useful-free-ipad-icon-sets-for-designers) [to release iPad icons](http://line25.com/articles/free-apple-ipad-icon-set-for-your-website-designs) but fail to include some crisp small size icons? Pushing the pixels for yourself of course. So here's my take on the smaller sizes of an [Apple iPad](http://www.apple.com/ipad/) icon, called iPixelPad in the sizes 48px, 32px and 16px. Everything drawn pixel-perfect from scratch. Heck, even the wallpaper. So, what to do when [everyone seem](http://www.littleboxofideas.com/blog/design-resources/5-very-useful-free-ipad-icon-sets-for-designers) [to release iPad icons](http://line25.com/articles/free-apple-ipad-icon-set-for-your-website-designs) but fail to include some crisp small size icons? Pushing the pixels for yourself of course. So here's my take on the smaller sizes of an [Apple iPad](http://www.apple.com/ipad/) icon, called iPixelPad in the sizes 48px, 32px and 16px. Everything drawn pixel-perfect from scratch. Heck, even the wallpaper.
<!-- more -->
They also come in two different versions for each size: with a matte highlight shine and with a harder gloss. They also come in two different versions for each size: with a matte highlight shine and with a harder gloss.
And drawing the homescreen icons was quite funky and if you know the standard iPhone icons I bet you can guess what icons you can see here and in the icon files, at least in the 48px and 32px versions: And drawing the homescreen icons was quite funky and if you know the standard iPhone icons I bet you can guess what icons you can see here and in the icon files, at least in the 48px and 32px versions:
@ -23,17 +22,11 @@ And drawing the homescreen icons was quite funky and if you know the standard iP
The homescreen icons pixels in the 16px version needed all more vivid colors to get them distinguishable from the wallpaper background so they're a bit different from the other sizes. These are the times I wish I could modify just half a pixel. The homescreen icons pixels in the 16px version needed all more vivid colors to get them distinguishable from the wallpaper background so they're a bit different from the other sizes. These are the times I wish I could modify just half a pixel.
## Download ## Download
The icons come in various formats: iContainer, ICNS, ICO and PNG files for each size. Just click the following download button to grab the whole pack: The icons come in various formats: iContainer, ICNS, ICO and PNG files for each size. Just click the following download button to grab the whole pack:
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/ipixelpad_by_kremalicious.zip">Download</a>
## License ## License

12
_src/_posts/2010-03-27-office-desk.markdown
View File

@ -1,10 +1,12 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-03-27 21:31:35+00:00
layout: post
slug: office-desk
title: Office Desk title: Office Desk
image: Office-Desk.jpg
author: Matthias Kretschmann
date: 2010-03-27 21:31:35+00:00
wordpress_id: 1901 wordpress_id: 1901
categories: categories:
- photos - photos

18
_src/_posts/2010-07-03-momcorp.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann
comments: true
date: 2010-07-03 17:12:53+00:00
layout: post layout: post
slug: momcorp
title: MomCorp Wallpaper title: MomCorp Wallpaper
image: Teaser-MomCorp-Wall.png
author: Matthias Kretschmann
date: 2010-07-03 17:12:53+00:00
wordpress_id: 1453 wordpress_id: 1453
categories: categories:
- goodies - goodies
@ -13,20 +14,13 @@ categories:
The recent Futurama episode "[Attack of the Killer App](http://en.wikipedia.org/wiki/Attack_of_the_Killer_App)" mocked a phone and a company you probably all have heard of. I've made some wallpapers with the logo of MomCorp presented everywhere in this episode. The recent Futurama episode "[Attack of the Killer App](http://en.wikipedia.org/wiki/Attack_of_the_Killer_App)" mocked a phone and a company you probably all have heard of. I've made some wallpapers with the logo of MomCorp presented everywhere in this episode.
<!-- more -->
The wallpaper comes in four versions with two color variations and two text variations with Mom's favorite tagline. Here's an overview: The wallpaper comes in four versions with two color variations and two text variations with Mom's favorite tagline. Here's an overview:
![MomCorp-Walls-Overview](/media/MomCorp-Walls-Overview.png) ![MomCorp-Walls-Overview](/media/MomCorp-Walls-Overview.png)
## Download ## Download
You can grab the full zip-package with versions for Desktop, iPad, iPhone & Android included: You can grab the full zip-package with versions for Desktop, iPad, iPhone & Android included:
[download_button version=1.0] <a class="btn btn-primary icon-download-alt" href="/media/momcorp_wall_by_kremalicious.zip">Download</a>

11
_src/_posts/2010-07-18-typeface-condoms.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-07-18 20:28:33+00:00
layout: post
slug: typeface-condoms
title: Typeface condoms title: Typeface condoms
image: Typeface-condoms.jpg
author: Matthias Kretschmann
date: 2010-07-18 20:28:33+00:00
wordpress_id: 1898 wordpress_id: 1898
categories: categories:
- photos - photos

11
_src/_posts/2010-08-07-bonsai.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-08-07 20:23:31+00:00
layout: post
slug: bonsai
title: Bonsai title: Bonsai
image: Bonsai-5-Version-2.jpg
author: Matthias Kretschmann
date: 2010-08-07 20:23:31+00:00
wordpress_id: 1895 wordpress_id: 1895
categories: categories:
- photos - photos

11
_src/_posts/2010-09-01-gdr-helvetica.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-09-01 20:21:43+00:00
layout: post
slug: gdr-helvetica
title: GDR Helvetica title: GDR Helvetica
image: GDR-Helvetica.jpg
author: Matthias Kretschmann
date: 2010-09-01 20:21:43+00:00
wordpress_id: 1892 wordpress_id: 1892
categories: categories:
- photos - photos

11
_src/_posts/2010-12-11-iphone-coasters.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-12-11 21:19:29+00:00
layout: post
slug: iphone-coasters
title: iPhone Coasters title: iPhone Coasters
image: iPhone-Coasters-1-Version-2.jpg
author: Matthias Kretschmann
date: 2010-12-11 21:19:29+00:00
wordpress_id: 1889 wordpress_id: 1889
categories: categories:
- photos - photos

11
_src/_posts/2010-12-29-basically-the-monolith-is-on-my-desk.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-12-29 15:47:12+00:00
layout: post
slug: basically-the-monolith-is-on-my-desk
title: Basically, The Monolith Is On My Desk title: Basically, The Monolith Is On My Desk
image: Basically-The-Monolith-Is-On-My-Desk.jpg
author: Matthias Kretschmann
date: 2010-12-29 15:47:12+00:00
wordpress_id: 1873 wordpress_id: 1873
categories: categories:
- photos - photos

11
_src/_posts/2010-12-29-free-monkey-breath-not-soylent-green.markdown
View File

@ -1,10 +1,11 @@
--- ---
author: Matthias Kretschmann layout: image
comments: true
date: 2010-12-29 21:16:55+00:00
layout: post
slug: free-monkey-breath-not-soylent-green
title: Free Monkey Breath, Not Soylent Green title: Free Monkey Breath, Not Soylent Green
image: Free-Monkey-Breath-Not-Soylent-Green.jpg
author: Matthias Kretschmann
date: 2010-12-29 21:16:55+00:00
wordpress_id: 1886 wordpress_id: 1886
categories: categories:
- photos - photos