当ブログではかなりアバウトな情報しか載せていなかったのを、『精米.me』では

• 所在地
• マップ
• 料金の目安
• 駐車場の有無
• 米ぬか持ち帰りの可否

まで掘り下げて紹介。一部のデータには、実走しておさめてきた外観写真も一緒に載せています。ぜひご利用くださいませ。

福井県のコイン精米機マップ『精米.me』
http://www.saymy.me/

日本語圏でのWordPressサイト構築事例をアトランダムに載せるまとめにしてみました。

これはなんかムズムズする仕様なので、head セクションに押し込むことにします。お約束の「ご利用は計画的に」の技術情報ですのでお含み置きを。

問題の link タグは jetpack/modules/contact-form/grunion-contact-form.php で生成されていて、692～700行目あたりにヒントが書いてあります。

	/* Can be dequeued by placing the following in wp-content/themes/yourtheme/functions.php
	 *
	 * 	function remove_grunion_style() {
	 *		wp_deregister_style('grunion.css');
	 *	}
	 *	add_action('wp_print_styles', 'remove_grunion_style');
	 */

	wp_register_style('grunion.css', GRUNION_PLUGIN_URL . 'css/grunion.css');

ということで、これを参考に functions.php にこんな感じで追記しました。

［2012.4.26　10:00追記　初出のコードにtypoがありましたので修正］

function my_jetpack_style() {
	if ( !is_admin() && defined( 'GRUNION_PLUGIN_URL' ) ) {
		function my_remove_style() {
			wp_deregister_style( 'grunion.css' );
		}
		add_action( 'wp_print_styles', 'my_remove_style' );

		function my_register_style() {
			wp_register_style( 'grunion', GRUNION_PLUGIN_URL . 'css/grunion.css' );
			wp_print_styles( 'grunion' );
		}
		add_action( 'wp_head', 'my_register_style' );
	}
}
add_action( 'after_setup_theme', 'my_jetpack_style' );

『Jetpack』が入ってない方は［プラグイン］→［新規追加］でまずはインストール。利用するにはWordPress.comのアカウントが必要なので、示された手順に沿って有効化してください。

で、めでたく有効化できたら［Jetpack］メニューをクリックして、「コンタクトフォーム」有効化。

有効化すると、ようこそ！されます。

でもって、サイドバーに「フィードバック」のメニューが出てきます（詳しくは後述）。

フォームを設置する固定ページを新たに作ってみます。「アップロード/挿入」欄にフォームのアイコンが出ているので、クリック。

フォームの項目を設定します。いきなり英語の設定画面になりますが、気にしない気にしない。

項目の並び順はドラッグ＆ドロップで並べ替えることができます。

フォームのラベルはカスタマイズ可。

フォームからのメールを［設定］→［一般］のメールアドレスとは違うアドレスに送りたいときは「Email notifications」のタブをクリックして設定を（オプション）。

「Add a new field」をクリックすることで、項目の追加ももちろんOK。ひととおり終わったら、［Add this form to my post］をクリックします。

記事本文にショートコードが埋め込まれました。必要に応じて説明文などを入れてページを公開（or 更新）しましょう。

こんな感じでページができました。

テキストを入力してみます。

送信したらこうなりました。画面遷移が起きるのが『Contact Form 7』と違うところです。

誤った形式のメアドを送ろうとすると叱られました。

管理画面の［フィードバック］をクリックすると、フォームからの内容を確認できます。

あらかじめ設定したメアドにもお知らせメールが届きました（Win版のThunderbirdだと一部文字化けしてました）。

送信完了画面のテキスト（4つ上の画像で斜体になってる部分）は blockquote タグでくくられているので、こんな感じでCSSを書くといろいろカスタマイズできますよ。

.page div[id^="contact-form-"] blockquote {
	font-style: normal;
}

セレクタを blockquote だけにすると他のページにも影響が出るので、送信完了画面だけに適用するようにセレクタを増やしました。

Jetpack supercharges your self‑hosted WordPress site with the awesome cloud power of WordPress.com.
Jetpack

そもそもFTPメールってなに？

といってもFTPメールをご存じない方も多いかと思いますので、まずはWikipediaより引用。

FTPメールとは、「FTPメール」サーバを使ってインターネット上の各種ファイルを取得する方法。FTPメールサーバは一種のプロキシサーバであり、電子メールで要求を受けつけ、それに従って遠隔のFTPサーバと（非同期に）接続する。インターネット接続に何らかの制限があってFTPを直接使えない利用者にとって、有益なサービスである。

手順

本文に実行すべきコマンドを書き連ねた電子メールをFTPメールのサーバに送る。サーバは指定された遠隔のFTPサイトにFTPログインし、結果を電子メールで送り返す。

FTPメールサーバの現状

で、現在どれくらいのFTPメールサーバが稼働しているかざっくり調べてみたのですが、かつてお世話になった ftpmail@isfs.kuis.kyoto-u.ac.jp や ftpmail@ftp.pu-toyama.ac.jp、「世界一有名」ともいわれた ftpmail@decwrl.dec.com などのFTPメールサーバはことごとくサービスを停止。現状ほぼ唯一であろうサーバが、アメリカ海洋大気庁（NOAA）が運営しているものでした。

京都大学や富山県立大学のサーバは、学外のAnonymous FTPサーバからファイルを持ってくることができましたが、NOAAのそれは、NOAAが提供する天気図などのファイルに限られています。そういう制限はありますが、ともあれファイルをgetしてみましょう。

FTPメールのコマンド

今回はNOAAが提供する北大西洋方面の天気図をFTPメールでgetしてみます。あらかじめ、ファイルが ftp://tgftp.nws.noaa.gov/fax/PPAE10.gif にあることを調べておいたので（本来は archie を使ってファイルの所在を調べる）メールの本文にこう書きます（タイトルは空白でOK）。

open
cd fax
get PPAE10.gif
quit

本文を書いたら ftpmail@ftpmail.nws.noaa.gov に送信。数分して送られてきたのがこの天気図でした。

で、なんでこんなことしたかといいますと。

言うなれば、口述伝承ですな。

「表示オプション」で設定できることが判明

しましたので、恥を忍んでここに記す次第であります。

まず、管理パネルの「外観」→「メニュー」に進みます。

画面右上の「表示オプション」（オレンジ枠の部分）をクリックします。

「詳細メニュー設定を表示」欄になにやらチェックボックスがあります。試しに「リンクターゲット」「CSSクラス」にチェックを入れてみますと……

チェックを入れる前

チェックを入れた後

「リンクを新ウィンドウまたはタブで開く」にチェックを入れれば target=”_blank” が設定できるというわけです。

この表示オプション、ほかにも隠れキャラがいまして……

「投稿」のチェックボックスをオンにすると予想どおり

カスタムリンクや固定ページと同列に「投稿」の項目が現れ

個別記事もナビゲーションメニューに取り込むことができるようになります。ナビゲーションラベルの書き換えもOKなので、記事タイトルが長い場合は適当にはしょることもできますね。

先日、このプラグインを使ったサイト構築の案件で「カレンダーの内容（＝イベントのタイトル）に応じてカレンダーの色を変えたい」というリクエストがあったので、jQueryを使って解決してみました。いつもどおり「ご利用は計画的に」の技術情報ですが、どなたかのお役に立てれば。

なお今回は、カレンダーをグリッド表示させている場合のカスタマイズ例なので予めお含み置きを。

↑こんな感じにカレンダーを表示させた場合ですね

仕込みの前に

Eternal-tearsさんが『Google Calendar Events』の日本語化ファイルを制作されているので、もろもろの仕込みを始める前に設定しておくのがおすすめです。

jQueryの設定ファイル（config.js）の作成

テーマディレクトリ内に js ディレクトリを作り js/config.js という構造でテキストファイルを一つ作ります。例えば、イベントに「hoge」という文字列が含まれているときにカレンダーの文字を赤くしたい場合、config.js の記述は以下のようになります。

jQuery(document).ready(function($) {
	// イベントに hoge が含まれているときカレンダーの数字を赤くする関数
	function myAddColor() {
		$('.gce-day-number').each(function() {
			var str = $(this).nextAll().text();
			if(str.indexOf('hoge') != -1) {
				$(this).css('color', 'red');
			}
		});
	}
	myAddColor();

	// Ajaxでカレンダーが遷移したときも関数を有効にする
	$(document.body).ajaxStop(function() {
		myAddColor();
	});
}

wp-includes/js/jquery に含まれるjQueryと config.js の読み込み

ともかく破綻のないよう読み込めばいいのですが、私自身はもっぱらテーマフォルダ内の functions.php にこんな感じで書いて組み込んでます。

<?php
if ( !is_admin() ) {
	function my_register_script() {
		wp_register_script( 'config', get_stylesheet_directory_uri() . '/js/config.js' );
	}
	function my_add_script() {
		my_register_script();
		wp_enqueue_script( 'jquery' );
		wp_enqueue_script( 'config' );
	}
	add_action( 'wp_print_scripts', 'my_add_script' );
}
?>

以上です。「こうするとスクリプトがよりすっきりするよ」というアドバイスがありましたら、ぜひお寄せくださいませ。

ウホッ！

とばかりに functions.php にブヒブヒ言いながら追記してみました。勢いにまかせてやったネタなので「ご利用は計画的に」の技術情報でご容赦を。

美女の写真は『phpFlickr』を使って、FlickrのAPIをたたいて引っぱってくることにしました。あらかじめFlickrのサイト内にある「The App Garden」にてAPIキーを生成しておきます。

ダウンロードした phpFlickr.php は funtions.php と同じ階層に inc というディレクトリをつくり inc/phpFlickr/phpFlickr.php という構造で入れます。

まずは phpFlickr.php で写真のURLを取得してみます。

function my_get_flickr() {
	require_once( 'inc/phpFlickr/phpFlickr.php' ); // functions.php を基準にした phpFlickr.php のパス
	$flickr = new phpFlickr( 'YOUR_API_KEY' ); // FlickrのAPI Keyを記述
	$flickr -> enableCache( // phpFlickr のキャッシュ機能を使用
		'db', // データベースにキャッシュデータを格納
		'mysql://' . DB_USER . ':' . DB_PASSWORD . '@' . DB_HOST . '/' . DB_NAME // wp-config.php の設定値でデータベースにアクセス
	);

	$photos = $flickr -> photos_search( array( 'tags' => '美女', 'per_page' => 50, 'privacy_filter' => 1 ) ); // 「美女」というタグがついた一般公開の写真50点を取得

	shuffle( $photos['photo'] ); // 取得した画像をシャッフル
	$photos['photo'] = array_slice( $photos['photo'], 0, 1 ); // シャッフルした画像の最初の画像を取得

	$image = $flickr -> buildPhotoURL( $photos['photo'][0], 'large' ); // サムネイル画像のURLを生成
	if ( isset( $image ) ) { $image = preg_replace( "/(_b)(\.jpg|\.png|\.gif)$/", "_q$2", $image ); }

	return $image;
}

画像のURLが取得できれば、あとはご随意にOGPまわりの設定を書くだけです。ちなみに私の場合はこんな要領で。

function my_get_ogp() {
	global $post;

	$name = get_bloginfo( 'name' );
	if ( is_home() || is_front_page() ) {
		$title = get_bloginfo( 'name' );
	}
	else {
		$title = get_the_title() . ' | ' . get_bloginfo( 'name' );
	}
	$desc = 'WordPressを愛する自称(高専ウォッチャー|おむつケーキ作家|『福井にHHKBと親指シフトとxkeymacsを普及させよう会』会長)のこそこそブログ。身のまわりの雑事いろいろ。たまに毒吐き。';
	$url = get_permalink();
	$image = my_get_flickr();
	if ( !isset( $image ) || ( get_post_meta( $post -> ID, 'bijo', true ) !== '1' ) ) { // URLが取得できてないとき or カスタムフィールドの「bijo」の値が1でないときはデフォルトの画像に
		$image = 'http://www.tecking.org/path/to/default.jpg';
	}

	$str = <<<EOD
<meta property="og:site_name" content="$name" />
<meta property="og:title" content="$title" />
<meta property="og:description" content="$desc" />
<meta property="og:url" content="$url" />
<meta property="og:type" content="article" />
<meta property="og:image" content="$image" />
<meta property="og:locale" content="ja_JP" />
<meta property="fb:app_id" content="YOUR_APP_ID" />
<meta property="fb:admins" content="YOUR_ADMIN_ID" />

EOD;

	echo $str;
}
add_action( 'wp_head', 'my_get_ogp' );

のべつまくなしog:imageに美女画像が出てきてアクセス1億倍を目指すのも大人げないので、カスタムフィールド「bijo」をつくって、値が1のときだけ美女画像を出すようにしました。あと、画像のライセンス関係を今回考慮してないので my_get_flickr 関数内の photos_search にライセンスまわりの引数を与えるとベターでしょう。

エッチい写真に「美女」タグがついてることがあるので、ウォールに投稿するまでどんなサムネイルが出てくるかドキドキがとまりません

［2012.3.29追記］
コードの一部に表記ミスがあったので修正しました（これは細部の編集です）。

1. カスタムメニューを新規作成する

「外観」→「メニュー」にて『マイメニュー』というような名前（名前は任意）でカスタムメニューを新規作成。サイトホームのURLを埋め込んだ「カスタムリンク」を作ります。ナビゲーションラベルに好きな文字列を入れればオッケイ。

《欠点》
URL欄にサイトホームのアドレスを直接書くので、ドメインを変えたときなどに再設定する必要があります。

2. 固定ページでなんとかする

「設定」→「パーマリンク設定」にてページスラッグを使えるよう設定したなら、この方法もあり。たとえば、ナビゲーションメニューの「ホーム」を『HOME』にしたい場合。

まずは『HOME』という名の固定ページを作ります。ページスラッグは home にしておきましょうか。次に「設定」→「表示設定」の「フロントページの表示」にて、フロントページを『HOME』に設定。

あとは 1. のカスタムメニューの手順とほぼ同じ。「外観」→「メニュー」の「固定ページ」欄に

こんな感じで現れるので、チェックを入れてメニューに追加するだけです。

《欠点》
HOMEへのリンクは「設定」→「サイトアドレス (URL)」の設定に基づくので、ドメイン変更時も 1. のよう書き換えはおそらくないはず。ただ、設定のステップが多いのと、サイトホーム表示時に呼び出されるテンプレートが page.php という理由により「ワシゃあ index.php を呼び出したいんじゃ」というような場合には適してないでしょう。
（もちろんテンプレート階層を活用したカスタマイズは可能ですが）

3. プラグインAPIを使う

今まで「『ホーム』の文字置き換えたい問題」には 1. や 2. で対処してきたのですが、プラグインAPIを使ってもうちょっとシャキッとならんかいな？と調べたところ、こんな方法がありました。

『Twenty Eleven』をカスタマイズするなら、たいてい子テーマを作ることになるでしょうから、子テーマの functions.php にこんなスクリプトを書きます。

function my_setup_child_theme() {
	if ( !is_admin() ) {
		function my_replace_home_title( $args ) {
			$args['show_home'] = 'foobar'; // foobar の箇所に「ホーム」と置換したい文字列を書きます
			return $args;
		}
		add_filter( 'wp_page_menu_args', 'my_replace_home_title' );
	}
}
add_action( 'after_setup_theme', 'my_setup_child_theme' );

プラグインAPIに対して二重にフックをかけているのには理由があります（以降、バージョン3.3.1で説明）。

グローバルメニューの「ホーム」の文字列は /wp-content/themes/twentyeleven/functions.php の358～362行

function twentyeleven_page_menu_args( $args ) {
	$args['show_home'] = true;
	return $args;
}
add_filter( 'wp_page_menu_args', 'twentyeleven_page_menu_args' );

が /wp-includes/post-template.php の887～898行

	$args = apply_filters( 'wp_page_menu_args', $args );

	$menu = '';

	$list_args = $args;

	// Show Home in the menu
	if ( ! empty($args['show_home']) ) {
		if ( true === $args['show_home'] || '1' === $args['show_home'] || 1 === $args['show_home'] )
			$text = __('Home');
		else
			$text = $args['show_home'];

にフックするかたちで生成されます。

以上の記述により、親テーマの functions.php で書かれている $args['show_home'] = true が有効となり post-template.php にて $text = __(‘Home’) つまり、日本語環境では「ホーム」がリンク文字列として設定されます。

これを上書きするために、$args['show_home'] を再設定しているのが子テーマの functions.php 2～8行目です。

しかし、通常は子テーマの functions.php が親テーマより先に読み込まれるため、読み込み順を入れ替える必要があります。それが 1行目・9～10行目の記述になります。

まとめ

1. とか 2. で欠点を書いたので「これって使い物にならない方法？」と思われるかもしれません。でも、固定ページやカスタムリンク、投稿のカテゴリーが混在したナビゲーションメニューを作れるのがカスタムメニューのいいところなので、サイトの設計に応じてうまく使い分けてはどうでしょうか。

以下のスクリプトを reset.php の名前で保存して（もちろん文字コードはUTF-8ね）インストールディレクトリ（wp-config.php と同じ階層）にアップロードしましょう。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>テーマをデフォルトに戻すよ</title>
</head>

<body>
<p>
<?php
$dir = dirname( __FILE__ ) . '/';

if ( file_exists( $dir . 'wp-config.php' ) ) {
	require_once( $dir . 'wp-config.php' );
}
else {
	die( '同じディレクトリに wp-config.php が存在しません。' );
}

$connect = mysql_connect( DB_HOST, DB_USER, DB_PASSWORD );
mysql_select_db( DB_NAME, $connect );
mysql_query( 'UPDATE `' . $table_prefix . 'options` SET `option_value` = "Twenty Eleven" WHERE `option_name` = "current_theme"', $connect );
mysql_query( 'UPDATE `' . $table_prefix . 'options` SET `option_value` = "twentyeleven" WHERE `option_name` = "template"', $connect );
mysql_query( 'UPDATE `' . $table_prefix . 'options` SET `option_value` = "twentyeleven" WHERE `option_name` = "stylesheet"', $connect );
mysql_close( $connect );

echo 'テーマをデフォルトに戻しました。';
?>
</p>
</body>
</html>

アップの後 WordPressアドレス/reset.php にアクセスして「テーマをデフォルトに戻しました。」のメッセージが出ればオッケイです