月別アーカイブで、mt:Entries内のカスタムフィールドの値を利用する

Movable Type5の月別アーカイブのmt:Entries内でカスタムフィールドとれないっていうのにはまった。

サイトの全ページに特定ブログの最新記事リストを出力 - MTQ | Movable Type 5 ユーザーコミュニティ

にちょっとヒントがあったのだけど、
ブログのコンテキストっていうのが影響するらしい。

というわけで、

<mt:Entries blog_ids="自ブログのID">

とmt:Entriesに自ブログのIDわたして、コンテキストをきちっと指定することでカスタムフィールドの値取得できた。

特定のカテゴリを親カテゴリにもつカテゴリーアーカイブ/エントリーの判定

ちょっと状況説明が難しいのだけど、
特定のカテゴリーを親カテゴリーにもつ「カテゴリーアーカイブ」と「エントリー」のみ表示を変えたいときの判定。

カテゴリーアーカイブの場合

<?php
//現ページのカテゴリーIDを取得 - get_query_var('cat')で現在表示しているカテゴリーアーカイブのIDが返ってくる。
$category_currentID = get_query_var('cat');

//カテゴリーIDからカテゴリー情報を取得 - get_categoryにカテゴリーIDを渡して該当カテゴリの情報を取得
$category_current = get_category($category_currentID);

//親カテゴリのIDを取得 - ->category_parentで親カテゴリの存在確認（親がなければ0が帰る）
$category_parentID = $category_current->category_parent; 

//もし親カテゴリがあれば
if ($category_parentID !== '0' ) {
	//get_categoryに親カテゴリのIDを渡して、親カテゴリの情報を取得
	$category_parent = get_category($category_parentID);
	if ($category_parent->slug === '親カテゴリー「〜」のスラッグ名') {
		echo '親カテゴリーが「〜」の場合の表示処理';
	} else {
		echo '通常処理';
	}
} else {
	echo '通常処理';
}
?>

エントリーの場合 （エントリーでの重複カテゴリーは考慮してないよ）

<?php

//現ページのカテゴリー情報を取得
$category_current = get_the_category();

//親カテゴリのIDを取得、エントリーの場合はget_the_categoryが多次元配列になっているので[0]つける
$category_parentID = $category_current[0]->category_parent;

//もし親カテゴリがあれば
if ($category_parentID !== '0' ) {
	//get_categoryに親カテゴリのIDを渡して、親カテゴリの情報を取得
	$category_parent = get_category($category_parentID);
	if ($category_parent->slug === '親カテゴリー「〜」のスラッグ名') {
		echo '親カテゴリーが「〜」の場合の表示処理';
	} else {
		echo '通常処理';
	}
} else {
	echo '通常処理';
}
?>

動画をiframeで埋め込んだ時のz-indexきかない問題（chrome)

iframeのコードでYouTube動画埋め込んだときに、z-indexきかないよ（動画の上になんか要素のるときなど）問題。
safariではcssの通りの挙動になるのだけど、chromeだとiframe（youtube)の内容が最前面にくる。

というのはiframeのsrcに「wmode=transparent」を加えてあげるとよい。

<iframe width="560" height="345" src="http://www.youtube.com/embed/t_htoSaQFf4?rel=0" frameborder="0" allowfullscreen></iframe>

を

<iframe width="560" height="345" src="http://www.youtube.com/embed/t_htoSaQFf4?rel=0&wmode=transparent" frameborder="0" allowfullscreen></iframe>

にする感じ。

一括で書き換えるなら、jQueryつかって

$(this).find('iframe').each(function() {
	var src = $(this).attr('src');
	$(this).attr('src',src + '&wmode=transparent');
});

とかするとよさそう。

パーマリンクのパスをルートからの/パスにする

mt:EntryPermalinkや、mt:AssetURLで出力されるのは、http://から始まる絶対パスだけど、
それちょっとヤダなって時に。

<!-- $WebsiteURLに、自ブログの親サイトのURLを格納 -->
<mt:BlogParentWebsite><mt:SetVarBlock name="WebsiteURL"><$mt:WebsiteURL$></mt:SetVarBlock>

<!-- replaceでEntryPermalink内から親サイトのURL部分を「/」に置換する -->
<mt:Entries>
<$mt:EntryPermalink replace="$WebsiteURL","/"$>
</mt:Entries>

「../」などいわゆる相対パスに指定したい場合は、出力されるURLにあわせてreplaceの「"/"」部分を書き換えればよいと思う。

各ブログのIDを調べる/取得する

別ブログの内容を読み込むときに、「mt:MultiBlog blog_ids=""」とかでID指定するとおもうんだけど、
本番とテストや復元つかってブログ追加したりとかで、IDがかわる場合があって、ちょっと不便。

で、ブログ名からIDを取得してblog_idなどを指定する形にしておく。
（これならテストと本番でblog_idの指定かえなくていいよね）

<!-- mt:Blogsでブログ一覧を取得、include_blogs="site"、include_with_website="1"で自分が所属するサイトのみを対象にする -->
<mt:Blogs include_blogs="site" include_with_website="1">
<mt:If tag="BlogName" eq="ブログ名A"><mt:SetVarBlock name="blogA_id"><$mt:BlogID$></mt:SetVarBlock></mt:If><!-- ブログ名AのIDを$blogA_idに格納 -->
<mt:If tag="BlogName" eq="ブログ名B"><mt:SetVarBlock name="blogB_id"><$mt:BlogID$></mt:SetVarBlock></mt:If>
<mt:If tag="BlogName" eq="ブログ名C"><mt:SetVarBlock name="blogC_id"><$mt:BlogID$></mt:SetVarBlock></mt:If>
</mt:Blogs>

あとは、

<mt:MultiBlog blog_ids="$blogA_id">
<mt:Entries>
〜
</mt:Entries>
</mt:MultiBlog>

など、blog_idsに設定したMT変数指定すればよいと思う。
ちなみに、同一サイト内に、同名のブログがない事前提。

history.pushStateをつかってみる。

pushState、実際にサンプルつくってみた。

http://dl.dropbox.com/u/131731/sample/pushstate/index.html

リンク遷移時にページ内で必要な部分のみ表示が代わり、かつ、
ページのtitle、ページのURLも読み込んだ内容に適応したものにかわるよう。

HTMLは事前にこんな感じになっている事想定。

HTML

//トリガーとなるaタグ、classがpjaxのものを対象としてる
//<a href="リンク先" class="pjax" title="遷移先のページのタイトル">〜</a>
<a href="index.html" class="pjax current" title="index">index</a></li>

<div id="main">
//この内容がページごとに置き換わる
</div>

JavaScript

jquery使うこと前提にしてる。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {

	//init
	var _target = "#main"; //おきかえるコンテンツのID
	var _href; //同一ページのpushState二重投稿防止

	//初期ページのタイトルとHTMLを定義
	var _default = { 
		title : document.title,
		content : $(_target).html()
	};
	
	//debug
	$('nav').after($("<ol/>").addClass("debug"));

	$('a.pjax').click(function() {
		var title = $(this).attr('title'), href = $(this).attr('href');
		//console.log('location : ' + location.pathname);
		if ( _href !== href ) { //同一URLの時はpushしない(環境に応じて要調整）
			$('a.pjax').removeClass('current');
			$(this).addClass('current');
			if ( window.history.pushState ) { //pushStateが使えるブラウザなら
				window.history.pushState(title, null, href); 
					//pushState(event.state, 'title', 'url'), 先では、第1引数にタイトル渡して、第2のtitleはnullにしてるけど、
					//1には数字わたして、2には素直にページタイトルわたしたほうが、戻る/進む時の現在の位置管理ができてよさそう。
					//replaceStateは "現在のエントリを入れ替える、つまり新規のエントリは追加したくない場合に使用するAPI" だそう。
				changeContent(title,href);
				_href = href;
				
				$('.debug').append('<li>' + title + '<span>' + href + '</span></li>');
			} else { //pushState対応してないなら、普通に開く
				window.location = href;
			}
		}
		return false;
	});
	
	window.onpopstate = function(event){ //戻る/進むでイベント発動
		//console.log(event);
		$('a.pjax').removeClass('current');
		$('a[title ="' + event.state + '"]').addClass('current');
		if (event.state) {
			changeContent(event.state, location.pathname);
		} else {
			changeContent(_default.title, location.pathname);
		}
	}
	
	function changeContent(t,u) { 
		$(_target).slideUp(500,function() {
			$(_target).after('<em>loading...</em>').load(u + ' ' + _target, function() {
				$(this).slideDown(500, function() {
					document.title = t;
				}).next().remove();
			});
		});

	}
});
</script>

Google Mapsで住所から緯度経度 / マーカーから緯度経度&住所を求める

タイトル通りの内容。

地図を登録させるフォームつくる機会があったんだけど、
住所検索だけだと同一番地内などで微妙に位置ずれする。

なので、マーカーで緯度／経度を修正して、
投稿時には
・入力した住所
・マーカーの緯度/経度
をもらってGoogle Mapsを表示させればいいんじゃないかなという話。

こんな感じ。

http://dl.dropbox.com/u/131731/sample/googlemaps-address_marker.html

2011/11/24：ちょっと改良して、ドラッグ時にパーマリンク表示するようにした。