人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ワードプレスで質問です。

いつも記事投稿でメディアを追加から画像を追加してアップしています。
そして、 このように100×100で出力される画像があります。

<img class="alignnone size-full wp-image-4570" alt="" src="httpーーーー99-1.png" width="100" height="100" />

今回やりたいことはこの100×100の画像だけ、60×60で表示したいです。
それ以外の、240×80などはそのままの状態を保ちたいです。

そんな事が可能なのでしょうか。

アドバイスいただけると幸いです。

●質問者: ak
●カテゴリ:コンピュータ ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● rouge_2008
●100ポイント ベストアンサー

表示する時にHTMLコードを変更する場合は次の記述を

function change_view_imagesize($content) {
if(preg_match('#<img ([^>]+?)( (width|height)="100"){2}([^>]+)>#', $content)) {
$content = preg_replace('#<img ([^>]+?)(?: (width|height)="100"){2}([^>]+)>#', '<img $1 width="60" height="60"$3>', $content);
}
return $content;
}
add_filter( 'the_content', 'change_view_imagesize' );



データベースに保存してあるHTMLコード自体を変更する場合は次の記述を

function change_view_imagesize($content) {
$content = stripslashes($content);
if(preg_match('#<img ([^>]+?)( (width|height)="100"){2}([^>]+)>#', $content)) {
$content = preg_replace('#<img ([^>]+?)(?: (width|height)="100"){2}([^>]+)>#', '<img $1 width="60" height="60"$3>', $content);
}
$content = addslashes($content);
return $content;
}
add_filter( 'content_save_pre', 'change_view_imagesize' );



テーマの「funcitons.php」に追加します。
※HTMLコードの「width」と「height」の指定サイズを変更しているだけですので、呼び出される画像は変わりません。(100×100の大きさの画像です。)


・プラグイン API/フィルターフック一覧
http://wpdocs.sourceforge.jp/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3_API/%E3%83%95%E3%82%A3%E3%83%AB%E3%82%BF%E3%83%BC%E3%83%95%E3%83%83%E3%82%AF%E4%B8%80%E8%A6%A7


【追記】

表示時に変更する場合についてですが、「get_the_content()」や$postオブジェクトの「$post->post_content」など「the_content()」以外で記事本文を取得・表示している時は、自分で「the_content」フィルターを適用する必要があります。(※適用していない場合は、テンプレートの記事表示部分の変更が必要。)

<div>
<?php echo apply_filters('the_content', get_the_content()); ?>
</div>


・関数リファレンス/get the content
http://wpdocs.sourceforge.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/get_the_content


akさんのコメント
rouge_2008 様 非常に詳しくありがとうございます。 PHPの知識がまだまだ浅い私ですが、 記述の仕方や、やっとわかってきた正規表現などなど、 ”こう使い方があるんだ”と 大変勉強になりました。 また、捕捉ですが、rouge_2008様含め このはてなでたくさん勉強させていただいたおかけで、 多分今回の記述は数ヶ月前なら全く理解できなかったのですが、 今回はグーグルに頼りながらですがすぐに理解する事ができました。 その事も感謝です。 本当にありがとうございます。 早速実装してみたいと思います!
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ