今回は2.9.xからのバージョンアップ。
念のためにバックアップをきっちりとってから、管理画面のバージョンアップボタンをポチりましたが、問題なく全て自動でバージョンアップできました。

多くの新機能が備わったようで、検証が楽しみです。

この記事を書いている目的の一つに、リビジョンの時差についての検証があります。

＞Wordpress.org：フォーラム：時刻設定

結論：Wordpress 3.01 では、リビジョンの時差は治っています。

※SSL絡みの au端末で発生する無限リダイレクト問題は治っていない模様。

【解決策】
ライブラリを読み込む際に、以下を記述しておく。
※郵便番号 input : id=”zip”
※都道府県 input : id=”pref”
※住所 input : id=”addr”

ググったところ、これは、他のライブラリとの干渉を防ぐためにのWordoress仕様のjQueryの親心だそうな。

解決策としては、JSの「$()」を「jQuery()」にすればOK。

ようやく重い腰を上げて、当サイトのWordpressのバージョンを2.8.xから最新の2.9.2にアップグレードしました！

及び腰だったのは、使っているサーバ（sakura）のMySQLのバージョンが4.0で、2.9.xからMySQLのバージョンが5.0以上が必須になったからなのでした。
バージョンアップ自体はサーバのコンパネからの操作で簡単にできるのですが、DBのバックアップ→リストアといういかにも不測の事態が起こりそうな作業が必要なのです。

念のため、先達のバージョンアップ報告をチェックしつつおそるおそる作業を始めたわけですが・・・・予想通りトラブル発生。

#1007 ? Can’t create database ‘データベース名’; database exists
というエラーメッセージが出てインポートできません。

よくよく先の先達のバージョンアップ報告を見ると、コメントに同様の報告がされていました。
よく見ておけば・・・
がしかし、報告されている解決手順では解決できず・・・・・

真っ青になりつつも、念のためにWordpressのプラグイン「WP-DBManager」でバックアップしておいたデータをあててみたところ、無事インポート成功！復活しました。
備えあれば憂いなし。
バックアップって、本当に大事ですね。

ちなみに、データベースが空の状態でWordpressにアクセスすると初期セットアップの画面になり、ここでセットアップ→DBプラグイン有効化→バックアップデータのリストア、の手順でリストアしたところ、Wordpressが管理側・表示側ともに真っ白になってしまいました。
ではと、データベースを一旦まるごと削除して作り直し、バックアップデータをphpmyadminの画面からインポートしたところ、無事成功、というなんとも冷や汗ものな作業工程でありました。

WordPress 自体のバージョンアップは、そんな苦労がアホらしくなるほどあっさり簡単に成功しました。やれやれ。

PC（windows）があれば、USBメモリを挿してこれを起動するだけで、自分用にカスタマイズしたサーバー環境を実現できるというわけです。
ステキです。

で、どうせならと、ワードプレスのインストールに挑戦したところ、あっさりと動いちゃいました。

ワードプレスのテスト環境というのはもちろん、個人的な日記・データベース目的としてもおもしろいんじゃないでしょうか。
意外に簡単にできちゃいますので、興味のある方はぜひチャレンジを。

さらに「どこでも仕事ができる！（緊急用）」をテーマに、USBメモリにいろいろとアプリを仕込んでいます。
レジストリ等を汚さないアプリであることが前提なので、気兼ねなく入れたり捨てたりできて楽しいです。

それについてはまた後日。（未定）

query_postsを使う

<?php if (have_posts()) : query_posts('cat=15&showposts=5'); ?>
<?php while (have_posts()) : the_post(); ?>
ループ
<?php endwhile; endif;??>

get_postsを使う

<?php
$lastposts = get_posts('category=15&numberposts=5');
foreach($lastposts as $post) : setup_postdata($post);
?>
〜ループ〜
<?php endforeach; ?>

先に紹介したNAVTデフォルトクラスでナビゲーションの『表示中ページ』カスタムを使うと、前者の場合、問題が発生するので、後者を使った方がベターです。

各テンプレートタグの詳細は以下を参照ください。

• テンプレートタグ/query posts – WordPress Codex 日本語版
• テンプレートタグ/get posts – WordPress Codex 日本語版

デフォルトのWordpressにはこの機能はありません。
CMSのようなデータベース型WEB構築システムで、この機能を後付けするのはかなり難しいでしょう。

そこで、以前にも紹介した弊サイトイチオシのナビゲーションプラグイン、NAVTの出番です。

このプラグインのデフォルトのCSSクラスを利用させていただきます。

まず、管理画面のNAVT用管理画面を開き、設定したいナビゲーショングループのギアアイコンをクリックし、グループのオプション画面を開きます。
オプション画面の『CSS』タブをクリックしてCSSクラスの設定画面を開き、『NAVTのCSSクラスを使用』にチェックして保存します。

NAVTのデフォルトCSSは、表示中ページ・表示中ページの親ページのリンクの li タグにそれぞれ、以下のクラスを割り当てています。

• current_page_item：表示中ページ
• current_item_parent：表示中ページの親ページ

このクラスにCSSでデザインを割り当ててやればOKです。

※注記
この方法を使った場合、トップなどに特定カテゴリの記事一覧を表示する等のカスタマイズに query_posts タグを使っている場合、『表示中ページ』がカスタム表示した特定カテゴリになってしまう事があります。
その場合は、query_posts ではなく get_posts を使うようにすればOKです。

NAVTのデフォルトCSSは他にも便利なクラスがたくさんあるので、テンプレートに合わせてNAVTをカスタマイズするのではなく、NAVTに合わせてCSSをコーディングしておくと便利です。

以下に使えそうなNAVTのCSSクラスをかいつまんでご紹介します。

ULタグに適用

• menu
• （設定画面で自ら設定したグループ名）
• msie / firefox / safari / opera ：（閲覧ブラウザ）
  ※Google Chromeでは safari になります。

LIタグに適用

• erow/orow ：（奇数/偶数）
• （スラッグ）-cat/page ：（カテゴリー/ページ）
• current_page_item ：（表示中ページ）
• current_item_parent ：（表示中ページの親ページ）

Aタグに適用

• navt-plink/navt-clink/navt-ilink ：（NAVTの取り扱い種別）
• current_item ：（表示中ページ）
  ※表示中ページの親ページにはクラス無し

1. WP-DBManager プラグインでデータベースをバックアップ
2. ダッシュボード＞プラグイン管理画面から、全プラグインの使用を停止
3. FTP にてサーバ上の WordPress 関連ファイルを全てダウンロード
4. 公式サイトから WordPress 2.8 日本語版をダウンロード
5. 解凍した全ファイルを FTP にてアップロード
6. ダッシュボードにアクセスし、データベースをアップグレード
7. ダッシュボード＞プラグイン管理画面から、全プラグインの使用を開始

2.8 → 2.8.1 は自動アップグレードで行いましたが、問題なく無事アップグレード完了しました。

参考までに・・2.8 の新機能についてはこちら。
以下に個人的によさげだと思う新機能を抜粋してみます。

• 新規テーマインストーラ
• テーマエディタ/en・プラグインエディタ/en に CodePress 構文強調表示を追加
• 管理パネル > メディア > 新規追加/en に「Cancel Upload」ボタンと「Delete」リンクを追加
• 全てのプラグインファイルを編集できるようにする
• ページのパーマリンクエディタを変更・修正
• データベースのパフォーマンスを向上
• SWFUpload to 2.2.0.1 に更新
• スクリプトローディングのパフォーマンスを向上

なかなかいじり倒す時間がとれないのが辛いところ・・・

コリスさんのところで情報がまとめられていましたので紹介します。
WordPress 2.8のアップデートの注意点と対処法 | コリス.

日本語公式サイトの発表はこちら。

2.8にアップデートの際は手動でとありますが、何が何でもアップデートしないと困るという状況でないならアップデートしないのが一番かと思います。

2.8にアップデートしていないWordpressでは管理画面の上部に常に

WordPress 2.8 が利用可能です ! アップデートしてください。

と出ていますが、当面の間はうっかり寝ぼけてクリックしないよう注意しましょう。

ほぼ紹介記事で申し訳ないですが、仮にも WordPress関連記事を書いているサイトの責務として投稿させていただきました。

Labrid WP では、Contact Form 7 というフォームプラグインを使っています。
このプラグインは Akismet のスパムフィルター機能を利用できます。

Akismet は、Wordpress に標準装備されている強力なスパムフィルタープラグインです。
まずはこれを有効にします。
※Akismet を有効にするには、WordPress.com で取得できる API キーが必要です。WordPress.com のアカウントをまだ持っていなければ WordPress.com で取得することができます。

次に、Contact Form 7 のフォーム作成画面（ツール＞Contact Form 7）で、フォームの「名前」「メールアドレス」「URL」の入力項目に、それぞれ以下の Akismet オプションを追記します。

• 名前→ akismet:author
  例: [text* your-name akismet:author]
• メールアドレス→ akismet:author_email
  例: [email* your-email akismet:author_email]
• URL→ akismet:author_url
  例: [text your-url akismet:author_url]

※初期入力オプションを設定してある場合、そのオプションより前に上記 Akismetオプションを記述しないと、フォームタグが有効に認識されずそのまま出力されてしまうので注意。

設定が終わったら、このオプションが正常に働いているかテストします。
名前欄に『viagra-test-123』（必ず Akismet にスパムとして補足される名前）と入力して送信すると・・・

このようなメッセージが出て、送信できませんでした。

これでメールフォームのスパム対策完了です。
今後は問合せフォームからのメールの内容を見て、本当にスパムかどうか、削除してよいかどうかと悩まずに済む事でしょう

デフォルトテンプレート：category.php
（カテゴリーID）用のテンプレート：category-（カテゴリーID）.php

とする事で、カテゴリー毎に違うテンプレートファイルを読込んでくれます。

では、詳細画面用のテンプレートでは・・・？

single.php に if文で

<?php if (in_category('1')): ?>
（カテゴリー１用のソース）
<?php elseif (in_category('2')): ?>
（カテゴリー２用のソース）
<?php else: ?>
（その他のカテゴリー用のソース）
<?php endif; ?>

とする事で表示をカスタマイズできますが、カテゴリー一覧画面のように別ファイルで分けてしまった方がスッキリします。
そんな場合はこれ。

<?php
 $post = $wp_query->post;
 if ( in_category('1') ) {
 include(TEMPLATEPATH . '/single-1.php');
 } elseif ( in_category('2') ) {
 include(TEMPLATEPATH . '/single-2.php');
 } else {
 include(TEMPLATEPATH . '/single-0.php');
 }
 ?>

こうする事で、

カテゴリ−１の記事：single-1.php
カテゴリ−２の記事：single-2.php
その他の記事：single-0.php

と、記事の属するカテゴリーによって読込むテンプレートファイルを分割する事ができます。

尚、ヘッダーやフッターを読込むタグは、通常は

<?php get_header();??>
<?php get_footer();??>

ですが、別に設定したヘッダー／フッターを読込みたい場合は、

<?php include (TEMPLATEPATH . '/header2.php');??>
<?php include (TEMPLATEPATH . '/footer2.php');??>

とします。

ちなみにサイドバーの場合はもっと簡単で、

通常（sidebar.php）

<?php get_sidebar();??>

sidebar-2.phpを読込む場合

<?php get_sidebar('2'); ?>

となります。

ヘッダー／フッターはサイドバー形式、
カテゴリー詳細は、カテゴリー一覧形式で
テンプレートファイルを切り分けてくれると、管理が楽になるんですけどね。

WordPressには、Wordpress本体のインストールURLと異なる公開URLを設定できる機能があるので、これを利用しています。

制作時

1. 公開予定のURLの下にサブディレクトリを作成し、そこにWordpressをインストール。
   例：公開予定 → http://labrid.jp/
   WordpressインストールURL → http://labrid.jp/wp/
2. WordPressの設定から検索エンジンをブロックする。
   設定＞プライバシー設定から、『検索エンジンはブロックするが通常の訪問者の閲覧は許可する』にチェックして『変更を保存』。
3. WordPress全体をパスワードでブロックし、非公開にする。
   ※Angsuman’s Authenticated WordPress Plugin というプラグインを使って、ログインユーザー以外は全コンテンツを見られない（ログイン画面に飛ばされる）ようにする。（このプラグインは最新版のWordpressで正常動作しないのでコードを一部書き換える必要あり）
   ※ベーシック認証をかけると、記事投稿時に画像等をアップロードできなくなるので×

1. で検索エンジンを拒否しているので、一般ユーザーがアクセスしてくる事はほとんどありませんが、万が一アクセスがあった場合を想定し、3. のプラグインで全コンテンツをパスワードブロックします。
制作者、校正担当者には、Wordpressのユーザー登録画面からユーザーとして登録し、ログインしてもらう事で、全コンテンツを閲覧できます。

公開時

1. WordPressの設定から検索エンジンの巡回を許可する。
   設定＞プライバシー設定から、『このブログを、検索エンジン とアーカイブサイトを含め、誰でも閲覧できるようにする』にチェックして『変更を保存』。
2. Wordpresのインストールディレクトリ（例：http://labrid.jp/wp）のindex.phpをダウンロードし、以下の通りに変更後、公開ディレクトリ（例：http://labrid.jp）にアップロードする。
   変更前：

   /** Loads the WordPress Environment and Template */
   require('./wp-blog-header.php');

   変更後：

   /** Loads the WordPress Environment and Template */
   require('./wp/wp-blog-header.php');

3. WordPressの設定からアドレスを公開予定URLに変更する。
   設定＞一般設定＞ブログのアドレス(URL)を、初期状態（例：http://labrid.jp/wp）から公開予定URL（例：http://labrid.jp）に変更する。
4. プラグイン一覧画面から Angsuman’s Authenticated WordPress Plugin を停止する。

これで公開完了です。

WordPress本体がインストールされているのはサブディレクトリですが、Wordpressの生成する全コンテンツのURLは、3. で設定した上位ディレクトリをルートディレクトリとして生成されます。

校正環境として別サーバーで稼動させていたWordpressを移行したり、DNSのドメイン変更を行う手間と必要なスケジュールを考えると、遥かに簡素化できました。
公開サーバーでのテストも兼ねているので、サーバー仕様の違いによるトラブルは皆無。
お客様側の最終確認工程も削減できました。

それに近い事が実際に起こってしまいました。
幸いプラグインは必要最低限なものだったけど、問題は、私のWindows IE6 環境ではエラーを吐かないこと。
エラーを吐いてくれないことには Try & Error での原因究明もできないのです。

幸いクライアントが同じ業界の方だったので、プラグインのON/OFFをしながら、エラーの状況を見てもらうことにしましたが・・

それにしてもおかしい…読み込んでいる JavaScript は多くないはず。
しかも信頼のおけるJSばかり。

この時点で思い出しました。
Google 関連の JavaScript がなぜか IE6 でエラーを吐く事があるという報告があった事を。

試しに、Google Analytics のコードを削除してエラー状況を電話で確認したところ、これがビンゴ。
まさに Google Analytics が悪さしてました。

いろいろと幸いな状況が続いたのでさっくり解決できましたが、状況によっては、エラーを吐くクライアントのところまで出向いての検証作業などで丸一日程度無駄にしていたかもしれません。

結論：IE6 でスクリプトエラーが出て、他のブラウザ／バージョンでは出ない、という状況ではまず Google 関連から疑うべし。

–（後記）—-

上記エラーの理由：文字コードがUTF-8のページで外部javascript を読込む際にUTF-8を明示的に表記しないと微妙な動作をする。

解決方法：以下のソース部分を変更。

※変更前

document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

※変更後

document.write(unescape("%3Cscript charset='utf-8' src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));

情報ありがとうございました。

ランダム表示スクリプトの入手・アップロード

以下のサイトからスクリプトをダウンロードします。

• A List Apart: Articles: Random Image Rotation

ダウンロード場所が少しわかりづらいですが、後の手順はとても簡単なので、便利なスクリプトを提供してくださっている作者様に感謝の気持ちを持って記事を読み解き、ダウンロードリンクを探しましょう。

次にダウンロードした rotate.txt の拡張子を php に変更します。
サーバ上のテーマファイルのあるディレクトリの “images” フォルダ内にランダム表示用のディレクトリ “random” を作成し、ここに rotate.php を FTP ソフトでアップロードします。

/wp-content/themes/テーマ/images/random/rotate.php

ランダム表示用画像の作成・アップロード

ランダムに表示させたい画像を複数作成し、上記で作成したディレクトリ “random” にアップロードします。
画像名は自由な名前で OK です。

背景画像指定スタイルの変更

テーマのスタイルシートを編集し、背景画像を指定しているスタイルの背景画像ファイルへのパスを rotate.php へのパスに変更します。

変更前

background:url(images/bg_header.jpg) 0 50% no-repeat;

↓
変更後

background:url(images/random/rotate.php) 0 50% no-repeat;

以上で完了です。

尚、一時的に背景画像を固定したいような場合は

background:url(images/random/rotate.php?img=static_image.jpg) 0 50% no-repeat;

とすることで対応できます。

初期状態では、rotate.php を置いたディレクトリ内にある画像をランダム表示しますが、rotate.php 内のパスを変更することで、画像の置き場所を変更する事が可能です。
例えば・・・

変更前

$folder = '.';

↓
変更後

$folder = 'http://labrid.jp/images/random/';

気が利いてますね。

Labrid WP ではとりあえず仕掛けは仕込んだものの、画像が2個しかないので、これから徐々に増やしていく予定です。

• キャンペーン等のような強力にプッシュしたい特設ページを単独で作成
• 特設ページへのリンクとして、全ページにバナー画像を配置

そういった場合のカスタマイズ方法の一例として、私の行ったカスタマイズを簡単にご紹介します。

特設ページ専用カテゴリーの作成

特設ページ専用のカテゴリーを管理画面の『投稿＞カテゴリー』から作成します。
カテゴリーを作成したら、カテゴリーIDを確認しておきます。
以下、特設ページ専用カテゴリーのIDが 10 だったと仮定して説明します。

このカテゴリーはサイドバーのカテゴリー一覧メニューには表示したくないので、使用中のテーマの sidebar.php のカテゴリー表示タグ [wp_list_categories();] の引数に [exclude=10] を追加して非表示に設定します。

特設ページへのリンクバナーのページへの関連付け

特設ページを『投稿＞新規追加』から作成します。

リンクバナーを適切なサイズで作成し、投稿画面のアップローダーからアップロードします。
（本文に挿入する必要はありません。）
※画像の格納先として『wp-content/uploads』を設定し、年月ベースのフォルダは作成しない設定にしてある事を前提とします。
これは管理画面の『その他の設定』で設定・確認できます。

カスタムフィールドに『banner』をkey名とし、アップした画像名を値として登録します。

keyで指定したカスタムフィールドの値を取り出す

以前の記事で紹介したように Get Custom Fielde Values というプラグインを使ってもいいのですが、このためだけにプラグインを導入するのも面倒なので、今回はプラグインを使用せずにカスタムフィールドの値を取り出します。

使用中のテーマの function.php に以下のコードを追加します。

function getCustom($key,$id) {
$custom = get_post_custom_values($key, $id);
if(count($custom)!=1)
return implode("<br />",$custom);
else
return $custom[0];
}

これは、WebTecNote さんの記事を参考にさせていただきました。

サイドバーテンプレートのカスタマイズ

サイドバーにリンクバナーが表示されるよう、使用中のテーマの sidebar.php をカスタマイズします。

sidebar.php に以下のコードを追加します。

<?php if (have_posts()) : query_posts('cat=10'); ?>
<ul>
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><img src="<?php bloginfo('url'); ?>/wp-content/uploads/<?php echo getCustom('banner',get_the_ID()); ?>" alt="<?php the_title_attribute(); ?>" /></a></li>
<?php endwhile; ?>
</ul>
<?php endif; ?>
<ul>

リンクバナー周辺のデザインをカスタムする場合は、上記の <ul> にクラスを割り当てるなどとして、スタイルシートを適宜設定するといいでしょう。

以上で完了です。
このように本文に使用しない画像を記事に紐づける場合は、カスタムフィールドが非常に便利かつ応用がきくので、覚えておいて損はないでしょう。