米が好き

ちょっと気になって調べたら案外簡単に出来たので、備忘録として書いておこうと思います。
今回行ったのは、特定のクラス（CSS）を加えたイメージタグの抽出方法です。

私が記事を書く時は、必ず頭にイメージを入れています。
（今日のシリーズやニコニコ紹介などは別）

このイメージは以下のように記述しています。

<img src="http://kome-suki.net/・・・" class="entry_thumb" />

他にも画像を入れる時があり、先頭に持ってきた画像（class=”entry_thumb”）だけを抽出したい。
これが出来れば、検索画面や関連記事や最近の記事などでサムネ付きというのが表示できるようになります。
プラグインや他の方法もググったら出てきましたが私的にいまいち合わなく、それらを踏まえていった上でもの凄く簡単に出来ました。
リニューアル後の表示変更を考えていたので、これは覚えておかなくてはいけない方法です。

search.phpなどを開き、記事のループを行っている中に以下のコードを書きます。

<?php
  $cnt = get_the_content();
  if (substr($cnt, 0, 1) == "<") {
    preg_match("/<img(.*?)class=\"entry_thumb\" \/>/", $cnt, $thumb);
    echo $thumb[0];
  } else {
  }
?>

解説
2行目　$cnt に記事内容を代入するんですが、『the_content()』だと記事が全て表示されてしまうので、必ず『get_the_content()』にする。

3行目　記事の1文字目が『<』じゃないと何も無しを返します。
6行目の else を書かないと、『Array』と表示されてしまうので注意。

4行目　PHPの『preg_match』関数で該当するタグ・クラスを書いて、$thumb に代入する。
『”/～～～/”』とダブルクォーテーション・スラッシュで囲むのが一般的らしいので、それ以外のダブルクォーテーション・スラッシュの前には￥（Macはバックスラッシュ）を記述する。

5行目　代入された $thumb[0] を echo ではき出す。

6～7行目　上記の例だと何も書いてませんが、『no image』みたいな画像を書き足してもOK。

画像の大きさを変えたかったら、<div>～～～</div>で囲ってCSSで変えた方が早いかもしれません。


取り合えず私個人用なので、別の方法（a や他のタグ）では試していませんが、応用すれば色々いけると思います。
勿論WordPress以外にも使えると思います。

WordPress2.9.1を無視して、やっとこさ2.9から2.9.2にしました。
バージョンアップ自体は自動で出来て簡単なんですが、コアの部分を色々いじっているのでその変更が面倒でした。
こんな時の為にノートにも書いているんですが、やっぱり面倒なんですよね。

@yoidoreoさんも作っているように、私も備忘録作ろうかしら。

今回は備忘録前に、ちょっとまとめてみました。
プラグイン関係は今回は無しです。

私はDreamweaverで編集しているんですが、元ファイルは『Shift-JIS』になっているので『UTF-8』で保存しなければいけません。


サーバー上で自動アップロード後、ファイルをダウンロードします。

上記ファイルの上から設定していきます。

解説記事1、解説記事2
『wp-admin/includes/media.php』を開き、以下の2箇所を変更。

media.php　170行目（2.9）

exit;

　↓

#exit;

media.php　366行目～（2.9）

<a href="{$image_upload_iframe_src}&TB_iframe=true" id="add_image" class="thickbox" title='$image_title' onclick="return false;"><img src='images/media-button-image.gif' alt='$image_title' /></a>

　↓

<a href="{$image_upload_iframe_src}&TB_iframe=true" id="add_image" class="thickbox" title='$image_title (Flash)' onclick="return false;"><img src='images/media-button-image_f.gif' alt='$image_title (Flash)' /></a>
<a href="javascript:w=window.open('{$image_upload_iframe_src}&flash=0','','scrollbars=yes,Width=650,Height=720,top=0,left=0');w.focus();" id="add_image" title='$image_title (Popup)' onclick="return true;"><img src='images/media-button-image_p.gif' alt='$image_title (Popup)' /></a>

ちなみに表示画像も変更していますが、コア部（wp-admin/images/）にアップしてもバージョンアップ時に削除されないので、UPし直さなくて良いようです。


解説記事
『wp-includes/comment-template.php』を開き、以下の箇所を変更。

comment-template.php　145行目～（2.9）

if ( empty( $url ) || 'http://' == $url )
  $return = $author;
else
  $return = "<a href='$url' rel='external nofollow' class='url'>$author</a>";
return apply_filters('get_comment_author_link', $return);

　↓

if ( empty( $url ) || 'http://' == $url )
  $return = $author;
else
  if ( $url == "http://kome-suki.net/")
    $return = "<a href='$url' rel='external nofollow' class='url'>$author</a>";
  else
    $return = "<a href='$url' rel='external nofollow' class='url' target='_blank'>$author</a>";
return apply_filters('get_comment_author_link', $return);

『http://kome-suki.net/』を任意で変更。


自分で設定したCSSのクラスに予め設定しておく事が出来ます。（1つのみ）
『wp-includes/media.php』を開き、以下の箇所を変更。

media.php　226行目（2.9）

$html = '<img src="' . esc_attr($img_src) . '" alt="' . esc_attr($alt) . '" title="' . esc_attr($title).'" '.$hwstring.'class="'.$class.'" />';

　↓

$html = '<img src="' . esc_attr($img_src) . '" alt="' . esc_attr($alt) . '" title="' . esc_attr($title).'" '.$hwstring.'class="pict" />';

『pict』を任意で変更。


「続きを読む」をクリックした際、サイトの頭から表示させる方法。
『wp-includes/post-template.php』を開き、以下の箇所を変更。

post-template.php　219行目（2.9）

$output .= apply_filters( 'the_content_more_link', ' <a href="' . get_permalink() . "#more-$id\" class=\"more-link\">$more_link_text</a>", $more_link_text );

　↓

$output .= apply_filters( 'the_content_more_link', ' <a href="' . get_permalink() . "\" class=\"more-link\">$more_link_text</a>", $more_link_text );

上の『#more-$id』を削除。


解説記事（リンクターゲット）、解説記事（クイックタグ）
『wp-includes/js/quicktags.dev.js』を開き、以下の箇所を変更。

quicktags.dev.js　369行目（2.9）

edButtons[i].tagStart = '<a href="' + URL + '">';

　↓

edButtons[i].tagStart = '<a href="' + URL + '" target="_blank">';

『target=”_blank”』を追加。

quicktags.dev.js　33行目～（2.9）
クイックタグの追加は、自分でカスタマイズするのであればコチラを参考に。
プラグイン『AddQuicktag』もありますが、順番などは好きに出来ません。
が、複数行設定が出来るので、タグ（コード）によって使い分けると良い感じだと思います。

『quicktags.dev.js』は『quicktags.js』にリネームしてアップしなければ反映されません。