ダリの雑記：WEBプログラム版

これまでの記事で、「座標の取得方法」「取得した座標からマップを表示する方法」を書いてきました。とはいえ、実際に「GoogleマップAPIで地図とマーカー・バルーンを表示（複数版）」のようなマップページを作る場合、座標をいちいち手動で取得してHTMLに書いていくのは非常にめんどくさい。こういう場合は何かしらのCMSを利用するのが一般的でしょう。

そこで今回はWordPressを使用することにして、エントリーごとに座標を登録する方法を記述します。

カスタムフィールドに座標を登録する方法と言えば、このブログでも取り扱ったことのある、「Google Maps Anywhere」（ダウンロードサイト：「WordPress Plugins/JSeries」）です。

このプラグインを使用すれば、WordPressの管理画面内だけで記事にマップを挿入できます。また、「カスタムフィールドに追加」ボタンを押すことにより、マーカーの座標がカスタムフィールドに追加されます。この座標を利用すれば、「GoogleマップAPIで地図とマーカー・バルーンを表示（複数版）」のようなマップを表示させることが可能となります。

■取得した座標の利用した、WordPressのテーマ記述例
※あくまで例なので、そのままは利用できません。

 <ul id='gmap_list'>
    <?php $myposts = get_posts('category=3&orderby=post_date');
    foreach($myposts as $post) : ?>
        <li>
        <?php endif; ?>
            <div>
                <div class='gmap_title'><a name='gmap_title'><?php echo get_post_meta($post->ID, "shopname", true); ?></a></div>
                <div class='gmap_photo'><img src='<?php echo get_post_meta($post->ID, "shopphoto", true); ?>' width='120' alt='<?php echo get_post_meta($post->ID, "shopname", true); ?>' /></div>
                <div class='gmap_info'>
                    <?php echo get_post_meta($post->ID, "shopaddress", true); ?><br />
                    TEL：<?php echo get_post_meta($post->ID, "shoptel", true); ?><br />
                    営業時間：<?php echo get_post_meta($post->ID, "shopworktime", true); ?><br />
                    定休日：<?php echo get_post_meta($post->ID, "shopholiday", true); ?>
                </div>
                <div class='clear'></div>
                <div class='gmap_description'>
                    <?php echo mb_substr(strip_tags($post->post_content),0,40,"UTF-8"); ?>...[<a href="<?php echo $post->guid; ?>">記事を読む</a>]
                </div>
                <div class='gmap_coord'>
                    <?php echo get_post_meta($post->ID, "Lat_Long", true); ?>
                </div>
            </div>
        </li>
   
    <?php endforeach; ?>
</ul>
<div id='map' style='width:600px;height:500px;'></div>
<div class='clear'></div>

「Lat_Long」：座標が入っているカスタムフィールドです。

WEB制作やってる人間がいまさらですが、この違いに疑問を持ちました。自分のブログを最近始めてからピンバックの存在に気づいたんですよね～。

トラックバックはわかるけど、ピンバックって何だ？

その答えはこのサイトに書かれていました。

Bowz::Notebookさんのサイト

なるほど、トラックバックは意識的に相手のトラックバックURLを入力する必要があるけど、ピンバックは記事にリンクを張るだけで自動的に相手にPing送信される、と。

どうりで、こちらからトラックバック送信していないのに、記事に載せた参考サイトからリンクが張られていたわけだ。

なかなか便利な機能ですね。

今回参考にさせていただいたサイト

Bowz::Notebook：該当記事「トラックバックとピンバックの違い」

Google Maps Anywhere」を使用すると、WordPressの記事入力フォームから直接Googleマップの地図にピンマーク（所在地マーク）を付けることができます。（ただしGoogleマップAPIが必要）

ダウンロードサイト：「WordPress Plugins/JSeries」さんのサイト。

マイマップやストリートビューにも対応。ただ上記で紹介したダウンロードページにはマイマップのやり方が書かれていませんでした。マイマップのやり方についてはこちらのページで紹介されています。

「Odysseygate.com」さんのサイト

※注意点
「Odysseygate.com」さんのサイトで紹介されていたやり方では「/wp-content/uploads/hoge.kml」という風に、「ルートからのパスを記述する」方法で説明されていました。しかし自分がテストしたサーバ（ヘテムルサーバ）ではなぜかうまくいかず、「httpから始まるURLパス」を記述することで成功しました。サーバによって設定方法が変わる可能性があるのでご注意ください。

なお、ここでいう「マイマップを使用できる」というのは、あくまで「予め作成されたマイマップを読み込める」というものです。WordPressの入力フォームから設定したピンマークがマイマップにも反映されるわけではないのでご注意ください。

今回参考にさせていただいたサイト

• WordPress Plugins/JSeries：該当ページ「Google Maps Anywhere (地図表示)」
• Odysseygate.com：該当ページ「WordCamp 公式サイトに使った7個のプラグインとテーマ」

インストール方法はすべからく以下の手順で行います。

• プラグインをダウンロードした後解凍
• 解凍したフォルダごと「wp-content/plugins」フォルダにアップロード
• WordPressの管理画面にログインし、メニュー「プラグイン＞プラグイン」にて有効化する

ほぼ必須だと思われるプラグイン

• カテゴリーの並び替えを行う「My Category Order」
  MTもそうですが、なぜデフォルトで並び替えがないのかが不思議です。
  とりあえずこれをインストールすればメニューの「投稿」に「My Category Order」が増えますのでそこで並び替えを行ってください。
  ダウンロードサイト
• コメント・トラックバックを分けてくれる「Trackping Separator」
  WordPress独特の仕様のせいで、ごっちゃ混ぜになっているコメントとトラックバックを切り分けてくれます。
  ダウンロードサイト
  使用例はこちらのサイトをご参照ください。日々是好日さんのサイト

あったら便利なプラグイン

• あらかじめカスタムフィールドの設定を行える「Custom Field GUI Utility」
  アップロードの前に、解凍したフォルダの中に「conf.ini」というファイルがありますので、そちらでフィールドの設定をした後、アップロードしてください。（ダウンロードサイトにも設定方法が記述されていますのでそちらをご参照ください。）
  ダウンロードサイト
• ユーザのプロフィール画面でもフィールドを作れる「Cimy User Extra Fields」
  カスタムフィールドのように、プロフィール画面でも入力フィールドを追加できます。使用方法についてはこちらのページをご参照ください。 「WordPressの「ユーザ」管理画面にてフィールドを増やす方法」
  ダウンロードサイト
• 自動的にGoogleサイトマップを作ってくれる「Google Sitemap Generator」
  インストールすると、メニューの「設定」に「XML-Sitemap」が追加されますので、そちらから設定をします。なお設置直後は設定画面の上部にある書き出しリンクを押さないと、サイトマップが書き出されませんのでご注意ください。
  ダウンロードサイト
• 携帯版サイトを自動的に作ってくれる「Ktai Style」
  インストールするだけで、携帯サイトが自動的に作られます。
  ダウンロードサイト
• (追記)　記事やページ投稿でもPHP記述が使える「runPHP」
  ダウンロードサイト
  使用方法については、こちらをご参照ください。「power source：WP Plugin: 記事内でphpを使うrunPHP」。
• (追記)　キャッシュを生成する「WP Super Cache」
  あるのと無いのとでは表示速度が段違いです。ただ他のプラグインとの干渉で不具合が起こる場合がありますのでご注意ください。なお設置直後は設定画面にてステータスを「オン」または「ハーフオン」にしないと実行されません。あと注意点として「オン」または「ハーフオン」にした状態で「テーマ」を編集してもキャッシュが優先されて更新が反映されないので、テーマ編集時には必ずステータスを「オフ」にしてください。
  ダウンロードサイト
• （追記） 記事内の文字を一括置換できる「Search Regex」
  設置後、「メニュー」＞「ツール」に「Search Regex」が追加されますので、そこから置換を行ってください。
  ダウンロードサイト
• （追記）コメントスパム対策用プラグインその１「Akismet」
  信頼のナンバー１アンチスパム用プラグイン。ただし商用の場合は有料になります。ちなみにwordpressのバージョン2.0以上であれば始めから入っていますので、有効化し、「Akismet API key」を入力すれば使えるようになります。
  Akismet API keyは、WordPress.comでアカウントを作成すると使えるようになります。
  アカウント作成はこちら
  ※作成時、「ブログのアドレス」を入力するところがありますが、これは無視してユーザ名フィールドの下にある「ユーザアカウントのみ取得」を押してから登録してください。
  
• （追記）コメントスパム対策用プラグインその２「WP-SpamFree」
  スパム対策用プラグインその２です。ほかのブログ曰く「強力すぎる」とのことｗ
  商用のため、Akismetが利用できない場合などはこちらをご利用ください。
  ダウンロードサイト
• （追記）メールフォーム用プラグイン「Contact Form 7」
  おどろくほど簡単にメールフォームを設置できます。
  ダウンロードサイト
• （追記）WYSIWYGエディタ「TinyMCE Advanced」
  言わずもがなの超有名WYSIWYGエディタ「TinyMCE」が設置できるプラグインです。WordPressの場合、デフォルトでも使いやすいエディタが用意されてるんですけどね～。それでも物足りないという方はどうぞ。
  ダウンロードサイト

やたらと長いタイトルになりましたが、書いたとおりです。

wordpressでは半角で記述されたシングルクォート（'）、ダブルクォート(")が勝手に全角に変換されてしまいます。普通のブログを書く分には問題ありませんが、プログラムのソースを載せるときなどは非常に困ります。

というわけで、解決方法。いろいろなブログにも紹介されていますが、覚書ということで。

1. まず「wp-includes」フォルダの中にある「formatting.php」というファイルをダウンロードしてください。
2. テキストエディタで「formatting.php」を開き、wptexturize()関数の中のにある
   $curl = preg_replace($dynamic_characters, $dynamic_replacements, $curl);
   という記述をコメントアウトして保存してください。
3. 最後に「formatting.php」を元のフォルダにアップロードしてください。

これで半角クォートのまま出力されるようになります。なおあくまで表示の時サニタイズされているので、記事を書き直す必要はありません。

今回はこちらのサイトを参照させていただきました。You Look Too Coolさんのサイト

ウィジェットを使用せずに、カテゴリ一覧を表示させたい場合は

wp_list_categories()

が一番簡単な方法ですが、自動的にリスト形式で書き出されるため、デザインによっては不便なことがあります。MTのように<MTCategories>～</MTCategories>で囲んだ部分をループさせたりする関数があるといいのですが、残念ながらWordPressでは存在しません（プラグインならあるかもしれませんが）

そこで結局はデータベースから取り出してくる必要があります。
しかしわざわざ、$wpdb->get_resultsを使う必要はありません。

今回はget_terms()を利用します。（参考サイト：とりさんのソフト屋さんサイト）

<?php
    $cat_all = get_terms( "category", "fields=all&get=all" );
    foreach($cat_all as $value):
 ?>
<p><a href="<?php echo get_category_link($value->term_id); ?>"><?php echo $value->name;?></a></p>
<?php endforeach; ?>

get_termsで取得されるフィールドは

• term_id
• name
• slug
• term_group
• term_taxonomy_id
• taxonomy
• description
• count

となっていますので、foreachでループさせて「$value->term_id」という風に取得してください。

なおURLについては、get_terms()では取得できませんので、

get_category_link(カテゴリID)

で取得してください。（カテゴリIDはforeach中に「$value->term_id」で取得できます。）

なお、自分のやり方ではキャッシュが考慮されていませんので、考慮されたい方はこちらのサイトをご参照ください。とりさんのソフト屋さんサイト

<MTSetVar name="hoge" value="文字列">

<MTSerVarBlock name="hoge">

<$MTEntryTitle$>

</MTSerVarBlock>

<MTGetVar name="hoge">

<MTSerVarBlock name="hoge">

<$MTEntryTitle$>

</MTSerVarBlock>

 

<MTIf name="hoge" eq="ほげ">

この記事のタイトルは、「ほげ」です。

</MTIf>

<MTSerVarBlock name="hoge"><$MTEntryTitle$></MTSerVarBlock>

 

<MTIf name="hoge" eq="ほげ">

この記事のタイトルは、「ほげ」です。

</MTIf>

Cimy User Extra Fieldsプラグインを使用すると、ユーザの「プロフィール」編集画面にて、カスタムフィールドのように入力フィールドを増やすことができます。

ダウンロードサイト

インストール方法は例によって
プラグインをダウンロード後、解凍してフォルダごと「wp-content/plugins/」へアップロード。
wordpressの「プラグイン」設定で「有効化」すれば、このプラグインを使用できるようになります。

インストールが成功しましたら、左メニューの「設定」に「Cimy User Extra Fields」が追加されていますので、そこからフィールドの追加・編集を行ってください。

設定画面は英語なんでわかりづらいですが、基本的に画面下のほうにある「Add a new Field」と「Extra Fields」しか操作しません。

・Add a new Field：フィールドを追加する場合に使用します。
・Extra Fields：すでに作成したフィールドを編集します。

■Add a new Fieldsの設定例（画像をクリックすると拡大画像になります）

ここで注意点なのですが、サーバによってはフィールドタイプを「picture」や「avator」にすると画像がすんなりアップロードされない場合があります。

その場合は「wp-content」フォルダの中に「Cimy_User_Extra_Fields」というフォルダを作成し、書き込み権限を付けてください。
このプラグインでは、「wp-content/uploads」フォルダではなく、この「Cimy_User_Extra_Fields」フォルダにアップロードされるようです。

ちなみにテンプレートでの取り出し方は

get_cimyFieldValue(user_id, field_name);

です。

例）　get_cimyFieldValue(1, "USER_AVATAR");