*12*twelvelog

暗い色をきれいに魅せているサイトを40個紹介しているエントリー。

Toxel.com » 40 Beautiful Dark CSS Website Designs

黒い色を使ってるのに綺麗に魅せるのは難しいですから、かなり参考になります。

レイアウトは同じでスタイルを変えるチュートリアルのエントリー。

Five Looks, One Layout: How to Develop a Library of Web Design Styles at Your Fingertips – PSDTUTS

このエントリーは興味深いチュートリアルが載っています。勉強になりますよ。

すごい仕上がりができるPhotoShopのチュートリアルを50個集めたエントリー。

50 Excellent Digital Photography Photoshop Tutorials | Tutorials | Smashing Magazine

写真でチュートリアルを集めてくれているので、こんな加工がしたいというときに便利です。何気なく撮った写真もPhotoShopで加工すれば、クリエイティブな作品になりますね。

クリエイティブな404エラーページを60個集めたエントリー。

60 Really Cool and Creative Error 404 Pages | Inspiration

細部のデザインまでこだわったサイトは、エラーページもクリエイティブです。そこまでするのはホントはめんどくさくなるものですが。

でも、ページ数が多かったりとサイトの規模が大きくなればなるほど、エラーページの表示回数が多くなります。検索エンジンからの訪問者が、エラーページが表示されて、サイトから離脱しないためにもエラーページは結構重要です。

WordPressの管理画面カスタマイズプラグインを集めたエントリー。ちょうど3日前ぐらいに作った超簡単プラグインも配布します。

20 Incredibly Useful Themes and Plugins to Boost your WordPress Admin Area | Noupe

早くこのエントリーを知っていれば、投稿画面のカテゴリーCSSカスタマイズをもっと簡単にできたのにというタイミング。ホントに個人的ですが。

WordPressの管理画面のメニューが、使いやすくなるOzh’ Admin Drop Down Menuとかはオススメです。他はまだ試していないので何とも言えませんが、パッとみて使えそうなやつもありそうです。

ちなみに僕が作ったプラグインは、CSSclip、WDclipともにカテゴリーが多いので、それをうまく表示（上の画像）させるために作りました。

プラグインの概要は、管理画面で読み込むCSSファイルを追加するといった超簡単なものです。プラグインも20行ぐらい、読み込むCSSも20行ぐらいといった簡単なものです。

今まではwp-admin.cssにアップグレードの度に追加してたんですが、あまりにめんどくさくなって作ってみました。ちゃんと探せばプラグインも配布しているんでしょうが、見つけることができなかったので。

wp-admin-css-custom.zip

プラグインが

<?php
/*
Plugin Name: wp-admin-css-custom
Plugin URI: http://twelvelog.com/
Description: wp-admin-css-custom
Version: 0.0.1
Author: tandec
Author URI: http://twelvelog.com/
*/
function wp_admin_custom_css() {
$plugin  = wp_make_link_relative(WP_PLUGIN_URL.'/'.plugin_basename(dirname(__FILE__)));
print '<link rel="stylesheet" href="'.$plugin."/wp-admin-css-custom.css\" type=\"text/css\" media=\"all\"    />\n";
}
if (is_admin()) {
add_action('admin_head', 'wp_admin_custom_css', 999);
}
?>

CSSが

/*
投稿画面
*/
/*カテゴリーエリアの高さ*/
div.ui-tabs-panel {
height: auto;
}
/*メインカテゴリーの回り込み解除*/
#categories-all ul li {
clear: both;
}
/*サブカテゴリーの回り込み*/
#categories-all ul li ul li {
float: left;
clear: none;
margin-right: 10px;
}