ブログ記事本文中の最初のimgのURLを取得する

Movable Type のブログ記事の本文中で、最初に出てくる画像の URL(つまり img タグの src 属性)を、regex_replace モディファイアを使って取得する方法です。

regex_replace モディファイアは、MT タグが出力する結果に対して、実際に出力する前に正規表現での置換を行うことができるモディファイアです。どの MT タグにも利用できるグローバルモディファイアですね。

このモディファイアを利用して次のように書けばOKです。

<mt:EntryBody regex_replace="/<[^i].*?>|<i[^m]*?>|<iframe.*?>|<input.*?>|<ins.*?>|<isindex.*?>|\s/g","" regex_replace='/(.*?src=")(.*?)(".*)/g','$2' regex_replace="/^[^\.\/].*/g","">

簡単に説明(2011-03-31 01:24 修正)

最初の regex_replace="/<[^i].*?>|<i[^m]*?>|<iframe.*?>|<input.*?>|<ins.*?>|<isindex.*?>|\s/g","" は、img タグ以外の HTML タグと、スペース、タブ、改行を取り除いています。どうも環境によって必要だったりするようです。

2つめの regex_replace='/(.*?src=")(.*?)(".*)/g','$2' でブログ記事本文に出てくる1つめの img タグの src 属性の値を取得して、それ以外を削除しています。

この2つめの regex_replace では、「 " 」ではなく「 ' 」で値を設定している点に注意してください。これは、正規表現の中に「 " 」が出てくるので、「 " 」で正規表現をくくると正常に動作しないためです。

「 " 」をエスケープすれば済むのですが、僕はエスケープするよりも「 ' 」にしちゃったほうが簡単だし正規表現も読みにくくならないので、いつもこうしています。

3つめの regex_replace="/^[^\.\/].*/g","" で、ブログ記事本文に img タグが一つもなかったとき値を空にするための処理です。ここでは、ブログ記事本文中の画像が相対パスであることを想定していますが、普通に http から始まる URL で画像を指定している場合は、/^[^\.\/h].*/g みたいに h を入れるといいのかも知れません。

以上です。

Recent Entries

Pickup Categories

Movable Type

CMSとして国内5万サイト以上に導入されている Movable Type に関する記事です。

Craft CMS

CMS 業界で注目の Craft CMS に関する記事です。Craft CMS はチーム全体をハッピーにしてくれる素晴らしい CMS です。