2011年はアウトプットの年にしよう！と思ってから既に二ヶ月以上経って気がつけばもう三月。

お仕事用のサイトは何とかできたけど、写真のお仕事のサイトはまだ途中。本当はこれを先に仕上げなくちゃいけないのに、e.b.i.fのリニューをぽちぽちやり始めたりして。

カスタマイズの楽しさからWordPressを使うのは決まってはいたけど、iPhoneアプリが今ひとつ不安定。Tumblrはアーカイブが好きじゃないし、Posterousはテンプレ少ないし、どうしようと暫くウロウロ。

今日もそんな感じでPosterousいじってたら、WordPressへのAutopostがかなりスムーズ。後は投稿カテゴリーが設定できればなーと思っていたら、カテゴリー名をタグで入れればできる事が判明。

という事で、WPで構築、iPhoneからの投稿はメールからのPosterousのAutopostで大丈夫な予感。

後はデザインとコンテンツ…

UPDATE
サービス終了ではなくYahoo!が売却先を探す、ということになった模様。とりあえずすぐになくなるわけではなく、現状のサービスは続行されるようです。

ニュースが流れてから、Deliciousの代替えサービスや移行方法などを調べてたのだけど、「無料のサービスはまたいつかなくなるかもしれない」、「いままでDeliciousが無料だったのに有料のサービスに移行するのはちょっと悔しい」など、今ひとつ決め手になるサービスが見つけられず。「ブックマークを共有する」というソーシャルな部分はあまり利用していなかったこともあり、ここはいつものWordPressでやってみることにした。

で、できたのがこれ。↓

メモ代わりに設置方法とテーマファイルの紹介。

まず必要なもの。
インストール型のWordPress (新規) とインストールできるサーバ。

使用したWordPressのプラグイン
- Delicious XML Importer（必須）
- WP Search Tags（必須）
- Configurable Tag Cloud (CTC)（オプショナル）
- WP-PageNavi（オプショナル）

使用したテーマ – I Need Delicious (自作）
お使いになりたい方はこちらからダウンロードできます。ただし、カスタマイズなどのサポート等はできませんのでご了承ください。

＜手順＞
1. I Need Deliciousテーマをインストールして選択。

2. Delicious XML Importerを有効化。
管理画面＞ツール＞インポート＞Deliciousを選択。そうすると”Visit this link to get an XML file of your bookmarks.”というリンクがでてくるのでここをクリック。Deliciousに既にログインされている場合や、ログイン後に空白のページが表示されるのでソースコードを開き、そのファイルを.xmlで保存。（Chromeではできませんでした。）
このファイルをさっきの画面で選択して
Do you want your Delicious Bookmarks as – Posts
If posts, do you want your Delicious Tags as – Tags
にしてインポート開始。

私が使った時は500エラーでまくりでした。とりあえずエラーが出るたびにページをリフレッシュして続行。最終的にインポートが完了しました。その後このプラグインのアップデートが出たようなので今は改善されているかもしれません。

3. WP Search Tagsを有効化。
これがないとTagがうまく検索されないような感じでした。

4. 外観＞ウィジェットで検索ウィジェット追加。

5. 外観＞ウィジェットでタグクラウドウィジェット追加。
これでタグクラウドが表示されるようになりますが、delicious風にリストにして数が表示されるようにするにはConfigurable Tag Cloud (CTC) を有効化してそのウィジェットを使用。
Configurable Tag Cloud (CTC) の設定はこんな感じにしています。↓

6. ページナビゲーションをページナンバー表示にしたい場合はWP-PageNaviを有効化。

以上で設定完了。
後は管理画面＞ツールのPress It（ブックマークレット）を使えばブックマークも手軽に投稿できます。

——————
WordPress以外のインストール型ではScuttleというのがあるそうです。
Masayanさんが詳しい解説をアップしてくれてますので、興味のある方はそちらもどうぞー。
MMRT daily life » Delicious のブックマークを Scuttle に移行する

今作りかけている旅写真サイトで使いたいプラグインがあって、それが3.0で動くかどうか早く試したくて待っていたのだけど、使ってみると噂通り動かず、こちらの作業は一旦停止。

30秒で（もかかってないと思う）自動アップグレードが終わっちゃうので、ついでにここやらあちらやらPhoto-Biyoriのデモサイト、テストサイト、クライアントのWPサイトまで、まとめてアップグレード。一応データベースのバックアップとファイルのバックアップとりながら、5分ほどで全部終了。

それでもなんだかもの足りず、このサイトのテーマちょっとだけいじったり。( IE6のサポートやめちゃったり。）

とあまりにもあっさりアップグレードが完了するので、本当にアップグレードされたのかちょっと不安になる3.0の新機能は以下のリンクで。
Codex（日本語） | Codex (EN)

いっぱいありすぎてまだきちんと読んでないのですが、気になったもので簡単に導入できそうなものふたつ。

1) テーマの背景編集機能を有効にする

管理画面の外観メニュー > 背景パネルでテーマの背景が編集可能になっています。ただしテーマファイルに設定されている場合のみ。
設定方法はとっても簡単で、使用しているテーマのfunctions.phpに以下のコードを追加。

if(function_exists('add_custom_background')) add_custom_background();

これで背景パネルが使えるようになります。
Photo-Biyoriのテストサイトで試してみましたが、ちゃんと変更されました。PBにも実装予定　実装しました。

Codex (EN): 管理画面での設定方法
Codex (EN): add_custom_background

2) テーマのメニュー編集機能を有効にする

管理画面の外観メニュー > メニューパネルでテーマの背景が編集可能になっています。テーマファイルの設定が必要ですが、ない場合はウィジェットからでも編集可能。

テーマファイルの設定方法は、まずfunctions.phpに以下のコードを追加。

if (function_exists('add_theme_support')) add_theme_support('menus');

次にメニューを表示するタグ (wp_list_pagesなど）を

<?php wp_nav_menu(); ?>

に変更。これでメニューパネルが使用可能になります。

表示したいページをチェックして、ドラッグ&ドロップで表示順を変更したり、ページ以外にもURL、表示するタイトルを入力してメニューに表示する事も可能。いままでメニュー表示にかなり苦労していたので嬉しい追加機能。

Codex (EN): 管理画面での設定方法
Codex (EN): add_theme_support
Codex (EN): wp_nav_menu

まだまだいろいろありそうなので、また時間のある時にじっくり見てみようと思っています。

日本語訳はここ。↓ (naoさん、いつもありがとうございます！）
2.9 メディア機能のアンケートに投票を！

いろいろ便利そうな機能がありますが、私が配布しているフォトログテーマ、Photo-Biyoriに使えそうなものや、自分のフォトログに便利そうなものなど、気になったものだけピックアップしてみました。

メディアアルバム (Media Albums)
（投稿内に含めるギャラリーではなく）フォトストリーミング機能のついたスタンドアロンの写真アルバムを作成・編集を可能にする。

この機能があれば、投稿とは関係なくアルバムが簡単に作れるので、イベントや旅の写真、自分のお気に入り写真などのアルバムが作れるようになるのでは。かなり期待大な機能です。

メディアメタデータ (Media Metadata)
メディアファイルに対してカテゴリーやタグを指定可能にする。

画像ファイルに直接カテゴリーやタグを指定できれば、そこからアルバムや、お気に入りページを作ることもできそうな気がする。

投稿サムネイル (Post thumbnails)
投稿・記事・抜粋と共に表示する画像を選べるようにする。

投稿の写真のサムネイルを投稿サムネイルとして指定できれば、Photo-Biyoriの現状のサムネイル自動挿入のかわりに使えるのかもしれない。

メディア設定の改善 (Better Media Settings)
メディア設定画面にある初期設定の数を増やし、アップロードの都度に必要な設定のみ上書きできるようにする。

フォトログにはあんまり必要ないけど、ここのブログには欲しい機能。

こんな感じでしょうか。

WordPressを使っている方、WPライフを快適にするためにぜひ投票に参加してください！

ただ、あまりにもスパムコメントがこないと、スパムじゃないのもはじいてそうで心配というのが欠点。ググってみると強力過ぎてちょっと…という記事も多々あり、大丈夫なのかなと思っていました。

そういう意見を考慮してくれたのか、最新バージョンではブロックしたコメントのログが見れるようになりました。プラグイン > WP-SpamFreeのGeneral Optionsの中に、”Blocked Comment Logging Mode”というのがあり、これをオンにすると３日間だけですが、ブロックしたコメントのログがテキストファイルで保存されます。これでちょっと安心。

ちなみにこのプラグインはJavascriptが有効かどうかをチェックするので、携帯からのコメントははじかれるらしい、というのをどこかで見た気がして、「あー、それはちょっとうーん…」と思っていたのですが、YurikoさんのKtai-Styleプラグインを使用すると、携帯電話でアクセスしたとき、WP-SpamFreeが起動しないようになっているようです。（2008年2月に対応済み）さすがです。

いろいろ探してみたのですが、詳しいドキュメンテーションが見当たらず、以下を参考に無理矢理挑戦。
WordPress Codex: Template Tags/wp list comments
WordPress Codex: Migrating Plugins and Themes to 2.7/Enhanced Comment Display

結構めんどくさかったので、「別に今のままでもいいや」っていう方は、使っているテーマの作者が2.7対応にアップデートしてくれるのを待ったほうがいいかも。参考になるかどうかわかりませんが、以下私がこのサイトに導入した方法です。

まず、使用しているテーマのheader.phpファイルのwp_head()の直前に

<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>

というラインを追加。

管理画面の設定 > ディスカッションから
Enable threaded (nested) comments x levels deep
というのをチェック。

次に。テーマ内のcomments.phpというファイルが今回のアップデートで大幅に変更されているようで、あれこれいじってもちゃんと動作しなかったので、自分のテーマのcomments.phpをいったんバックアップして、2.7に同梱されているデフォルトテーマのcomments.phpを自分のテーマ内にコピー。この時点でスタイルが設定されていないのでレイアウトが一時ぐちゃぐちゃになります。

この状態で、返信リンクでコメント欄がインラインで開くか、テストコメントが入れ子で表示されるかをテスト。大丈夫そうだったら、デフォルトテーマのstyle.cssを参考にしながら、コメント関係のスタイルを設定。

ただし、このままだと、コメント表示のフォーマットは変更する事ができません。デフォルトだと
xxx says:
日付／曜日／（編集リンク）
コメント
（返信リンク）
という並び。

これを変更するには、

<?php wp_list_comments(); ?>

というラインを

<?php wp_list_comments('callback=mytheme_comment'); ?>

というふうに変更し、自分のテーマフォルダ内のfunctions.phpファイルにmytheme_commentという関数を作成することになります。 （’mytheme_comment’は適宜変更。）

この関数の設定もいまひとつよくわからなかったので、このページにあるサンプルをがっつりコピーして、まずテスト。

function mytheme_comment($comment, $args, $depth) {
   $GLOBALS['comment'] = $comment; ?>
   <li <?php comment_class(); ?> id="li-comment-<?php comment_ID() ?>">
     <div id="comment-<?php comment_ID(); ?>">
      <div class="comment-author vcard">
         <?php echo get_avatar($comment,$size='48',$default ); ?>
         <?php printf(__('<cite class="fn">%s</cite> <span class="says">says:</span>'), get_comment_author_link()) ?>
      </div>
      <?php if ($comment->comment_approved == '0') : ?>
         <em><?php _e('Your comment is awaiting moderation.') ?></em>
         <br />
      <?php endif; ?>
      <div class="comment-meta commentmetadata"><a href="<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>"><?php printf(__('%1$s at %2$s'), get_comment_date(),  get_comment_time()) ?></a><?php edit_comment_link(__('(Edit)'),'  ','') ?></div>
      <?php comment_text() ?>
      <div class="reply">
         <?php comment_reply_link(array_merge( $args, array('depth' => $depth, 'max_depth' => $args['max_depth']))) ?>
      </div>
     </div>
<?php
        }

この状態だとデフォルトのテーマと同じように表示されるようなので、ここからすこしづつ、自分の表示したい順番、スタイルに変更していきました。←かなりのチカラ技です…

あと、以下のようにtypeを使えば、コメントとピンバックの表示方法を別に設定する事も可能だそうです。

<?php wp_list_comments('type=comment&callback=mytheme_comment'); ?>
<?php wp_list_comments('type=pingback&callback=mytheme_pingback'); ?>

WordPressビジネスブログ標準ガイドブック

WordPressでビジネスブログを構築・運営するためのガイドブック。最近ブログを設置したいというクライアントが多くなってきていて、「こんなんでいいのかなー」とちょっと不安だったので、日本に里帰りしていたお友達に頼んで買ってきてもらった。

最初の章はビジネスブログの目的や種類や利点、トピック選びについてなど。今までビジネスブログってこんな感じかなと、なんとなく思っていたことがわかりやすく整理されていて、実際にクライアントと話をする時に役に立ちそうな内容。使わせていただきます。:)

この本を読んでみて、自分が今までかなりいい加減にやっていたことに気づきました。ローカル環境のセットアップやテストサイトのバージョン管理なんてしてないし、サイト制作の際のコーディングスタンダードというのも知らなかったし、セキュリティに関する対策も…。(汗)　

本の構成はプランニングから、環境セットアップ、サイト制作、公開後のメンテからプロモーションまで、ブログ構築・運営の流れとポイント、それに必要な情報が網羅されていて、個人のWordPressサイトの構築・運営にも役に立つと思います。奥の深いWordPressなので、一冊の本で全てがわかるというのは不可能だけど、

「ガイドブック」という書籍名に込めているのは、この本がWordPressの世界を歩きまわるお手伝いをするガイドさんのような役割になれたら、という気持ちです。

とnaoさんが書かれている通り、興味のあるトピックをさらに深く知りたい時に役立つポイントや関連サイトのURLが沢山載っていて、WordPress探究心をかきたてられます。前々から気になっていたMAMP（Mac用ローカルサーバのパッケージ）を試してみる気になってきました。

最後に一つだけ要望。本に記載されているリソースのリンク一覧が、サポートサイトのどこかでまとめてみれると嬉しいなーと思いました。←アドレスタイプするのが面倒だから。:P

楽しみにしていたWordPress2.5の新しい管理パネルは、微妙な感じでちょっとしょんぼりだったので、WP Admin Fluencyという2.5用のテーマプラグインをダウンロードして試してみたんだけど、今ひとつ。

そんなわけで、WP Admin Fluencyのファイルを参考にしながら、管理パネル用のテーマを作ってみました。

WP Admin Compact (WP2.5+)

オリジナルの管理パネルのスタイル、レイアウトはほぼそのままで、フォントサイズを小さくしただけ。ちまちましたデザイン、レイアウト好き。:)　

WordPress開発チームに敬意を表して、カラーパレットはオリジナルのままにしています。（そのうちプラグインがでてくるはず。）

スクリーンショット

ダッシュボード ··· WP オリジナル | WP Admin Compact
新規投稿画面 ··· WP オリジナル | WP Admin Compact
ポスト管理画面 ··· WP オリジナル | WP Admin Compact

自分用に作ったのですが使ってみたい方がいらっしゃいましたら、以下よりダウンロードできます。Mac Safari、Firefoxでのみテスト済み。IE用のファイルは変更していないので、IE未対応。

ダウンロード & インストール

wp-admin-compact.zip
ファイルを解凍して、wp-admin-compactフォルダーをwp-content/wp-pluginsフォルダーにアップロード、管理パネルで有効化してください。

- 追記 -
もしWP Admin Compactをドロップダウンメニューのプラグインと同時に使用したいという場合は、プラグインファイルを少しいじるとコンパクト感が保てます。

Admin Drop Down Menus (Andy Stainesさん)

このプラグインのCSSの変更はWP Admin Compactに組み込み済み。:)

Admin Drop Down Menu (Ozhさん)

wp_ozh_adminmenu.php
1) 171行目のfont-sizeを25px→14pxに変更。

jQuery('#wphead h1').css('font-size','25px');

2) 183行目から始まる#ozhmenu内のfont-sizeを11pxに変更。

テーマファイル内の comments.php (ポップアップを使っている場合は comments-popup.php) の<?php comment_text() ?>の直前、またはその近くに以下のようなコードを追加。

<?php echo get_avatar( $comment, '32' ); ?>

32は表示されるアバターのサイズなので、適宜変更。

挿入されるアバターは .avatar というクラスで定義されるのでstyle.cssに以下のようなスタイルを追加。

.commentlist li .avatar { 
  float: right;
  border: 1px solid #eee;
  padding: 2px;
  background: #fff;
}

.commentlist liの部分はテーマによって違うので要確認。このコードだとデフォルトのようにコメント欄の右はしにアバターが表示されます。

最後に管理パネルの設定 > ディスカッション設定のアバター設定が、アバターを表示するになっていることを確認。簡単導入です。:)

アバターはgravatar.comで登録します。登録したメールアドレスをコメントに使用すると、そのアバターが表示されます。画像の変更はいつでも可能。

さらに詳しい説明は↓
わーどぷれすっ！» Gravatars と WordPress 2.5
WordPress Codex > Using Gravatars（英文）

というわけで探して見つけたのが、これ。
Broken Link Checker (WP2.0.2+)
エントリとページの内部 / 外部リンク切れをチェックしてくれるプラグインです。

有効化した後、オプションメニュー (Options) > Link Checkerで設定を変更できます。ちょっとよく覚えてないのですが、最初は自動的に始まっていたような。デフォルトの設定は3日に一度全てのエントリのリンク切れチェックをするようになっているけど、こんなに頻繁にする必要は全くないかも。新規エントリーは公開する時にチェックされます。

一度チェックが始まると、後はバックグラウンドでどんどんやってくれます。しばらくしてから管理メニュー (Manage) > Broken Linksでリンク切れリストが見れるようになります。””View”、”Edit Post”、”Discard”（リンク切れのままでリンクを残す）、”Unlink”（リンクを外す）のボタンがあるので、これを使って編集。リンク切れになっているものはサイト上では “リンクテキスト” というふうに表示されます。

結果、いっぱいありました、うちのサイト（ここもフォトログも）のリンク切れ。特に毎週アップしているthis week’s del.icio.us photosはトップページではなくてエントリに直接リンクしてあったので、追跡不可能なものが沢山。素敵な写真がどこにいっちゃったのか判らなくなってしまいました。:’(

「何が違うの？」という方のために（←私含む）わかりやすい比較表。
WordPress日本語版とWordPress MEの比較表

なるほど。
—————————————–
というエントリーを書きかけていたら、今日WordPress Japan (ME) 閉鎖のお知らせというびっくりのニュースが。

WordPress Japanのサイトの構成、フォーラム 、ドキュメントの充実ぶりはかなりのもの（もう見れないですが）。このサイトがOtsukare氏が個人で運営されているサイトだと知ったときは本当にすごいなーと思いました。（今までありがとうございました。）その後、フォーラムでMEと日本語版のふたつをどう取り扱っていくかという話があったのですが、なんとなく尻切れとんぼで終わってしまっていたような。

そんな中での突然の閉鎖のニュース。結局こんな形ではからずも一本化になってしまった、という印象を受けました。MEと日本語版の共存、またはMEから日本語版へのスムーズな移行を願っていたのですが、ちょっと残念…。

今後の日本語のWordPressに関する情報は以下のサイトに。

2.5用にリリースされているドロップダウンプラグインは現在2つ。

Admin DropDown Menus (Andy Stainesさん)

アイコン付きのサブメニューです。
クリックでサブメニューが表示。サブメニューに辿り着くまで2クリックですが、オリジナルの管理画面のようにページ移動がないのでそれほど使いづらい感はないはず。うっかりマウスがメニューバーに触れてしまい、予期せずドロップダウンメニューが開いてしまう事がないので、私はこっちのほうが好き。

Admin Drop Down Menu (Ozhさん）

メニューにマウスオーバーするとサブメニューが表示されます。ちょっと縦に長い気がしなくもないですが、これなら1クリックでサブメニューに辿り着けます。もともとダッシュボードのリンクがある一番上の部分に全部のメニューが表示されるので、画面の上部がすっきりします。

どちらもファイルをダウンロードしてwp-content/plugins/フォルダーにアップロードして有効化するだけです。

管理画面の感想

レイアウト、デザイン。うーん、微妙…
2.3よりは良くなっているような気もしなくはないけど、相変わらずフォントがでっかい。余計な空白がいっぱいある気がしてしまう。開発者はきっと特大モニターを使っているに違いない…

ダッシュボード。フィードが任意で設定できる。変更できるのは、
1. Latest ActivityのIncoming Links
2. WordPress Development Blog
3. Other WordPress News
の3カ所。自分が表示したいフィードアドレスを入力することができ、表示数も変更可能。これは使える気がします。

Users > Your Profileよりカラーパレットの選択可能。ClassicとFresh。(上のスクリーンショットはFresh)

今は２セットだけど、そのうち自分で好きなパレットを選べるプラグインを誰かがきっと作ってくれるはず。 （期待)

ファイルアップローダーが一新。

投稿欄の右上にメディア用のアイコン登場。画像、ビデオ、オーディオファイルを別管理できる。

今までのiFrameを使ったものから、AJAXペースのポップアップスクリーンに変更。使いやすさはアップ。ただ、画像からオリジナルのファイルへのリンクが必ずついてしまう。（まだ開発途中だと思うけど。）それと[gallery]というコードを挿入することができて、一連の画像のサムネイルを表示する機能もあるっぽい。

サムネイルサイズを任意で変更できるようになった！私が待ち望んでいた機能。Settings > Writing > Image Sizesというところで、Thumbnail SizeとMedium Sizeが設定可能。ただ、サムネイル/中間サイズのファイルを作成しない，というオプションはないので、使用しない場合はサーバに余計なファイルが作られることになるかも。

タグ管理ページ。Manage > Tagsで簡単なタグ管理が可能になったけど、簡単すぎる…　新規タグ作成とタグ名変更のみ。プラグインSimple Tagsのような機能にはほど遠いです。

以上、私が気づいた（気になった）新機能。WP2.5のその他の新機能に関してはOdysseygateのおでさんがまとめてくれています。

Photo-Biyori関連

動作自体は問題なさそうな気がする。画像アップロード用のプラグインPB-Photopressはオプションページ、アップロード用のポップアップウィンドウのレイアウトがおかしい。要修正。
2.5から画像のEXIFデータの抽出ができるようになるらしいということなので、この件も調べなくては。

さっそくダウンロードして、iwphone.phpファイルをwp-content/plugins/に、iwphone-by-contentrobotフォルダーをwp-content/themes/にアップロードして、プラグインを有効化。サイトがiPhone/iPod Touch対応になりました。 ただし現在ページ表示やカテゴリー表示はまだサポートされていない模様。それでもかなりの優れものです。

iwphone-by-contentrobotフォルダーのstyle.cssファイルで簡単なスタイル変更ができます。ヘッダーに画像を使用したい場合は、52行目あたり

#headerwrapper {
  text-align: center;
  /*background-image: url(images/header.jpg);
  background-repeat: repeat-x;
  height: 60px;*/
  background-color: #0872ba;
}

の/*と*/を削除すると、iwphone-by-contentrobotフォルダーの中にあるheader.jpgが表示されます。このファイルを参考にカスタム画像を作れば、かなりそれっぽくなります。:)

追記
iPhone/iPod Touchを持っていなくても、iPhoneyというフリーのソフトをダウンロードすれば、iPhoneでの表示確認のテストが可能。（Mac OS X 10.4.7+）メニューから “iPhone User Agent” を選択するのを忘れずに。

2.3からプラグイン一括無効化のボタンができたので、これで一括無効化。その後すぐにMaintenance Modeのプラグインだけ有効化。

一応バックアップをとったけど、今回はDBの変更がないアップデートなので、問題なく完了。

使用しているプラグインをひとつづつ有効化。結構たくさんあるので、時間がかかった。Custom Query String ReloadedとFlash Video Playerは一度無効化すると、変更したオプション、設定を全て忘れる事が判明。次回からはこの二つは無効化しないようにしよう…

前回のアップデートでコアファイルを一部変更したのを後から思い出す。メモしておいてよかった…