今まではwordpressにgooglemapを入れる場合apiキーが必要でしたが、
googlemap api が新しくなったことによりapiキーは必要なくなり、wordpressでapiキーを入力しなくてはいけないプラグインを入れた場合、apiのコード自体が古くなってしまうという場面に遭遇しました。

↑2010 年 5 月 19 日に正式にサポートが終了。

サイトオープン後のメンテナンスを考えた時に、やはり出来るだけ新しいもので対応しておいたほうがよいと思うので今後はV3に対応したものを使いたいと思います。

wordpressでのgooglemapは必須なのでメモしておきます。

■プラグインを入れる
今回は、ショートコードで入れられるプラグインを使用しました。
▼Google Maps v3 Shortcode
http://wordpress.org/extend/plugins/google-maps-v3-shortcode/

■ショートコードを記事内に入れる。
ショートコードについてNutspressさんがとっても詳しく載せてくださってます。
▼WordPress で Google Maps を表示させるプラグインGoogle Maps v3 Shortcode – Nutspress
http://www.nutspress.com/wordpress/google-maps-v3-shortcode-for-wordpress.html
▼本家サイトにも載っています下記（英語）
The Urban Nomad
http://gis.yohman.com/gmaps-plugin/

■上記のショートコードに出てくる場所指定を座標で表示する
▼座標を調べられるサイト
Google マップ 座標（取得｜入力）[Google maps API]
http://www5.ocn.ne.jp/~botan/map_g.html

■mapのiconを変える
mapのiconがたくさんあります。
▼map icon
http://mapicons.nicolasmollet.com/

今後のgooglemapを入れなくてはいけない場面に遭遇した時に、頭の片隅に入れておくと役に立つかも。

ではまた。

wordpressをカスタマイズし始めるときに必要なものの個人的なメモです。

head部分のwordpressバージョン表記をなくす。

functions.php に下記を追加。

remove_action('wp_head', 'wp_generator');

アップデート通知を管理者以外には非通知にする

functions.php に下記を追加。

if (!current_user_can( 'administrator')) {
    add_filter('pre_site_transient_update_core', create_function('$a', "return null;"));
}

プラグインやテーマのインストール時に接続情報を聞かれないようにする

wp-config.php に下記を追加。

define('FS_METHOD', 'direct');

カスタムメニュー対応にする

footer等のメニューを簡単に管理画面から追加したり削除したり変更したりできるので便利。

1.functions.php に下記を追加。

 register_nav_menus( array( 'primary' => __( 'Primary Navigation' ), ) ); 

2.外観のメニュー部分でメニューを作成してprimary Navigationにセットする

3.表示させたいテンプレート部分に下記を追加。

wp_nav_menu( array( 'container_class' => 'footer_menu', 'theme_location' => 'primary' ) );

footer_menuは囲まれるclass名です。
こんな感じで出力されますのでCSS調整も自由に。

<div class="footer_menu">
 <ul class="~~~">
  <li class="~~~">メニュー1</li>
  <li class="~~~">メニュー2</li>
  <li class="~~~">メニュー3</li>
 </ul>
</div>

管理画面のメニューをカスタマイズできるプラグイン

権限設定もできるので便利～。
Menu Editor
http://wordpress.org/extend/plugins/admin-menu-editor/

管理画面のメニューと色なども変更できる。
Ozh’ Admin Drop Down Menu
http://wordpress.org/extend/plugins/ozh-admin-drop-down-menu/

テンプレートやウィジェットでphpを使えるようにするプラグイン

Exec-PHP
http://bluesome.net/post/2005/08/18/50/

角丸にするCSS3

※IE６～８に対応させるにはhtcファイルを適用させる必要があります。

border-radius: 3px;        /* CSS3草案 */
-webkit-border-radius: 3px;    /* Safari,Google Chrome用 */
-moz-border-radius: 3px;   /* Firefox用 */

また思い出したら追加していきます～！

ソーシャルブックマークボタンを設置するという機会があったので、調べてみました。
facebook、mixi、グリーなどはリンクを押すと、画像やテキストなどの情報が出ます。

↓こんなの

これを追加するメモ！

これは、設定をしてあげる必要があって、何でもかんでも自動的に出ているわけではありません。
もちろん、ある程度のものは出ますが、意図しない画像やテキストが出てしまったりしてしまう場合もあります。
これを回避するためにプログラムで読ませる。というような感じです。

その設定はmetaでOGPというものを設定します。

フェイスブック、ミクシィ、グリーで使われている OGP (Open Graph Protocol) とは何か

wordpressではOGPをプラグイン一撃で入れることが出来るのですが、画像が意図したものにならない様子。
でもチョーーーー簡単に設定ができるので、興味のある人は入れてみてください。
有効化するだけで、OGPが追加されます。
WP-OGP

画像が意図したものにならないのが気に入らない場合には、headのmeta部分に、下記を追加します。

<meta property="og:title" content="<?php the_title(); ?>">
<meta property="og:type" content="blog">
<meta property="og:description" content="サイト説明">
<meta property="og:url" content="<?php the_permalink() ?>">
<meta property="fb:admins" content="アプリID" />
<meta property="fb:appid" content="アプリID" />
<?php
$str = $post->post_content;
$searchPattern = '/<img.*?src=(["'])(.+?)1.*?>/i';
if ( preg_match( $searchPattern, $str, $imgurl ) ) {
	echo '<meta property="og:image" content="'.$imgurl[2].'"/>';
} else {
	echo '<meta property="og:image" content="DEFAULT_IMAGE"/>';
} ; ?>

<meta property="og:site_name" content="サイト名">

facebookではアプリIDを登録しておく必要がありますので、facebookにログインをして、アプリIDを取得して下さい。
※5～6行目のアプリIDを知る方法
１つめは
http://apps.facebook.com/what-is-my-user-id/　から登録したアプリIDを入力します。
２つめは
http://www.facebook.com/developers/createapp.php　から登録したアプリID

※7～14行目は画像の自動出力です。
一番最初にある画像を自動で読み込んでくれるようになります。

head部分のmeta登録が終わったら、アップ！
ソースを確認する。

OGPがうまいこと追加になったら次はソーシャルブックマークを自動でいれちゃうプラグイン。
WP Social Bookmarking Light

こんな感じで設定が出来ます。
ただ一つ問題は、設定のところで、TOPにブックマーク配置を持ってきてしまうと最初にある画像を読み込んでしまうので
普通に写真を読み込んでくれないのでbottomに設定する必要があります。

facebookにどういう感じで出るのかを確認できるところ。
http://developers.facebook.com/tools/lint/

チョーーー簡単に配置するのはこれが早いかと思います。
とりあえず、メモとして。

参考リンク：
http://www.hide10.com/archives/14684
http://www.ninxit.com/blog/2010/06/13/wp-social-bookmarking-light/

php_value session.use_trans_sid off

の1行を追加してあげる。

■先日からツイートボタンを設置、今日からfacebookのいいね！ボタンを設置した。
四角いｔのボタンは、tumblrです。

押してよ！ｗ

■記事の表示件数を30件から10件に。
ページバーを出すことにした。

■上へにゅるっと戻るプラグインWP To Topを使ってみる。
右下にフワっと現れるBack to topのボタンを設置しました。
上へにゅるっと戻れます。
色とかカスタマイズできますYO!

そんな感じです。

まずはfunctions.phpに下記を追加。

/*
* $type='thumbnail'|'medium'|'large'|'full';
* $num is the number of <a onclick="javascript:pageTracker._trackPageview('/outgoing/blog.knym.net/items/tag/image');" href="http://blog.knym.net/items/tag/image">image</a> order.
*/
function the_image($type='thumbnail',$num=0){
    global $post;
    $post_ID = $post->ID;
    $files = get_children("post_parent={$post_ID}&post_type=attachment&post_mime_type=image");
    if (!empty($files)){
        $keys = array_keys($files);
        $img_num=$keys[$num];
        echo wp_get_attachment_image($img_num,$type);
    }
}

archive.phpに

<?php the_image(); ?>

サムネイルサイズの変更で反映してくれる。
プラグイン使うより簡単～～！
ありがとうございますー！

参考サイト：WordPressの投稿記事で使われているサムネイル画像などを取得する関数 the_image

■レシピサイトを構築しています。
＜やりたいこと＆環境＞
・カスタムフィールドテンプレートプラグインを使用している。
・投稿する際、自動的にスニペットが入るようにしたい。
・レシピサイトなので、タイトル、写真、カロリー、所要時間等を表示させたい
■ここを参考にテンプレートにマークアップしていく。
・RDFaでやるとW3Cでエラーがでるのでmicroformatsでやる。RDFaでやっちゃったよー早く言ってよもー。
■wordpressの場合記事での画像投稿で投稿される画像にその都度タグを入れるわけにいかないので、自動でマークアップしなくてはなりません。
・functions.phpに書いちゃいます。画像の挿入時に自動でタグを挿入します。
参考サイト：WordPress のエディタに埋め込むメディア用タグを自動編集する

完了したら表示されるかどうかテストしてみます。
■スニペットがみられるかどうかテスト
■OKそうだったらサイトに申請する。

<?php
function the_breadcrumb() {
	if (!is_home()) {
		echo '<a href="';
		echo get_option('home');
		echo '">';
		bloginfo('name');
		echo "</a> » ";
		if (is_category() || is_single()) {
			the_category(',');
			if (is_single()) {
				echo " » ";
				the_title();
			}
		} elseif (is_page()) {
			echo the_title();
		}
	}
}
?>

パンくずを載せたいところ（single.phpとか）に下記を追加。

<?php the_breadcrumb(); ?>

簡単ー！

参考サイト：How To: Breadcrumb Function For WordPress

まずは、タクソノミーを使えるようにします。

<?php
add_action( 'init', 'create_my_taxonomies', 0 );

function create_my_taxonomies() {
	register_taxonomy( 'dog', 'post', array( 'hierarchical' => true, 'label' => '犬', 'query_var' => true, 'rewrite' => true ) );
}

?>

増やしたいときは5行目を増やせばOK。
‘dog’はスラッグ、任意でどうぞ。
‘post’は投稿で使う
‘hierarchical’ => trueは投稿画面でチェックボックス式にする
‘label’は日本語OK（管理画面にでる名前です）

ダッシュボードを開くと、左側に名前が表示されます。
また、投稿画面では、右側にタグの入力欄が表示され、分類しながらタグを入れていくことができます。

次に、一覧に表示をさせます。
archive.php等をコピーしてあらたなtaxonomy.phpなどで保存して、テンプレート化します。

<?php /*
Template Name: taxonomy
*/ ?>

テンプレート化したtaxonomy.phpの表示させたいところに下記を追加する。
タグクラウド表示させた例。

<?php wp_tag_cloud( array( 'taxonomy' => 'dog', 'number' => 45 ) ); ?>

ページのを新規追加にして、テンプレートのtaxonomyを選ぶとOK。

ざっくりと書きすぎました・・・
詳しい説明は下記に詳しく書かれています！とっても助かりました！ありがとうございます！
他の表示の仕方は、下記サイトに書かれています！
参考サイト：
WordPressのカスタムタクソノミーを使えるようにするまでのメモ 1/2
WP カスタムタクソノミーの表示方法や条件分岐などのメモ 2/2
WordPress Codex 日本語版 – カスタム分類
Custom taxonomies in WordPress 2.8

今回は実験的にCSS3を使っています。
使ってみた感想。

とりあえず、IEはクソ。
CSS3が使えないという時点で問題外。IE8にもなって。最新版のくせに。
高校生にもなって！的な。

どれだけ違うか上のchromeさんと比べてみるとよくわかると思います。

だいぶIEユーザーは減りましたが、シェアはまだまだ多いIEなだけにユーザーが多いXPで使えるブラウザを出していただきたいところです。

色々ブラウザ各種で見てみたところ、動くCSSと動かないCSSがあった。
全部ブラウザチェックして対応させればいいんだろうけどとりあえずそのままにｗ

参考にしたサイトはこちら↓
CSS3 Click Chart by Impressive Webs

他のサイトでもだいぶCSS3が使われ始めてきています。
古いブラウザは危険が伴ない、サイトを見ただけでウイルスに感染し、他のサイトにまき散らして歩く、というウイルスも出ていますので、とりあえず色々マメにアップデートすることをおすすめします。

例えるなら・・服というものが発明されたのに、今までの裸体の慣れと楽さから離れられず、裸で歩きまわって風邪を引いちゃう。みたいな感じ？
いや、余計なこと書いた。すいません。

せっかくデザイナーさんたちが作った素敵なデザインが見られないのも残念ですし。

とりあえずリッチな感じでサイトがみたい人は

google chrome＞safari＞firefox＞Opera>>>>>>>>>>>>>>>>>>>>>>>>>>>IE（リンクしませんｗ）
各ダウンロードサイトにリンクしてあります。

なぜsafariが2番目なのかというと、地味に表示がキレイ。
結構嫌いじゃないです。常日頃使うのは不便かどうか使ったことがないのでわかりませんけど。
お仕事ではメインでgoogle chrome 、firefox を使ってます。
上記２つは、エクステやアドオンなど充実してるので、オススメ。

という感じで参考になりましたら幸いです。
よろしくお願いします。