外部ブログ画像をRSSで読み込む際の画像のトリミングについて

解決済 wtakop
(@wtakop)

6年、 11ヶ月前
こんにちは。初めて投稿させていただきます。
トップページに外部ブログ記事の最初の画像をRSSで取得させたく、
サイト検索より下記記述を見つけ、表示させることができました。

画像の大きさは300px300pxで正方形で表示させたいので各ブログ画像をトリミングをしたいのですがアイデアがありません。他トピックでアイキャッチ画像のトリミングを発見したのですが、この方法を下記記述に組み込むことは可能でしょうか。
https://ja.forums.wordpress.org/topic/22738

コードは理解できますが、phpは初心者です。
不勉強なのは承知していますが、どなたかご存知の方がいらっしゃればお教え頂けると助かります。
```
<?php
    include_once(ABSPATH . WPINC . '/feed.php');
    $rss_url = array(
      'rssのURL'
    );

    $rss = fetch_feed($rss_url);
    if (!is_wp_error($rss)){
      $maxitems = $rss->get_item_quantity(10);
      $rss_items = $rss->get_items(0, $maxitems);
    }

    foreach($rss_items as $key => $value){
      $first_img = '';
      if ( preg_match( '/<img.+?src=[\'"]([^\'"]+?)[\'"].*?>/msi', $value->get_content(), $matches ) ) {
        $first_img = $matches[1];
      }

      echo '
      <li>
        <a href="'.$value->get_permalink().'" target="_blank">
        <img src="'.esc_attr( $first_img ).'" width="300" height="300"></a>
        <a href="'.$value->get_permalink().'" target="_blank">'.$value->get_title().'</a>
      </li>
      ';
    }
?>
```

3件の返信を表示中 - 1 - 3件目 (全3件中)

KUCKLU
(@kuck1u)

6年、 11ヶ月前

こんにちは、wtakop さん。

WordPress 本体が、管理画面などでユーザーがアップロードした画像を、トリミング / リサイズしているので、その部分を応用することは技術的には可能ですが、その場合、外部ブログの画像を自サーバー内に保存することになるので、大人の事情とかで何か言われる可能性も・・・。

素直に CSS でトリミング／拡縮表示するのはいかがでしょうか？

천궁 메텔
(@digitmaetel)

6年、 11ヶ月前

KUCKLUさんの

素直に CSS でトリミング／拡縮表示するのはいかがでしょうか？

が良いと思います。
CSS で300px300pxで圧縮するか、300px300pxでくり抜くとか。
トピック投稿者 wtakop
(@wtakop)

6年、 11ヶ月前
KUCKLUさん、맹조さん
ご回答いただいてありがとうございます。
実は表示元にslick.jsを使用して画像一覧のスライダをレスポンシブ表示にしていたので、少し複雑にしてしまっていました。調整しつつなんとかやってみます。

同じお悩みの方へ下記CSSを見つけましたのでよければご参考ください。
```
方法1(元の画像が正方形でない場合は歪みます。)
li {
 width: 300px;
 height: 300px;
 overflow: hidden;
}
方法2
li {
position:relative;
width: 300px;
height: 300px;
overflow: hidden;
}
li > img{
position:absolute;
top:-10px;
left:-20px;
}
方法3
li {
position:relative;
height: 300px;
}
li > img{
position:absolute;
clip: rect(10px 100px 80px 10px);
}
```
背景表示やjQueryもあるようです。

この度はありがとうございました。

3件の返信を表示中 - 1 - 3件目 (全3件中)

トピック「外部ブログ画像をRSSで読み込む際の画像のトリミングについて」には新たに返信することはできません。

トピックタグ

表示