外部WordPressサイトの投稿を画像付きで読み込む

新着投稿一覧など、外部のWordPressサイトの投稿を画像付きで読み込みたい。
そんなときに必要な事はザックリこんな感じです。

  1. 外部のWordPressサイトの投稿の情報源があること
  2. その情報を読み込んで書き出すこと
ただし今回のやり方の場合、読み込みたい外部WordPressサイトのサーバーにファイルをアップできる状態である必要があります。
(画像読み込みの必要なければ大丈夫です)
目次

1.投稿の情報源

WordPressサイトはRSSフィードが書き出されるようになっています。
エムトラッドブログもこの通り。
https://mtrad-blog.com/feed/
カテゴリごとにもRSSがあるので、カテゴリ毎新着記事の表示に使えますね!
https://mtrad-blog.com/category/coding/feed/

ただし、デフォルトではサムネイルの画像情報は書き出されていません。
そこで書き出される内容を編集したいと思います。

  1. RSSフィードのテンプレートファイル『/wp-includes/feed-rss2.php』をコピー
  2. コピーした『feed-rss2.php』の内に下記のコードを追記する
  3. 編集した『feed-rss2.php』をテーマディレクトリ内にアップする
<?php if ( has_post_thumbnail() ) :
  $image_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'medium_large');
  $thumb_url = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'thumbnail');
?>
		<image><url><?php echo $image_url[0] ; ?></url></image>
		<thumb><url><?php echo $thumb_url[0] ; ?></url></thumb>
<?php endif; ?>

『feed-rss2.php』が準備できたら『functions.php』で読み込んで画像付きのRSSを有効化します。
下記のコードを『functions.php』に追記

remove_filter('do_feed_rss2', 'do_feed_rss2', 10);
function custom_feed_rss2(){
  $template_file = '/feed-rss2.php';
  load_template(get_template_directory() . $template_file);
}
add_action('do_feed_rss2', 'custom_feed_rss2', 10);
ちなみに子テーマの場合の記述はこうです
get_template_directory→get_stylesheet_directory

remove_filter('do_feed_rss2', 'do_feed_rss2', 10);
function custom_feed_rss2(){
  $template_file = '/feed-rss2.php';
  load_template(get_stylesheet_directory() . $template_file);
}
add_action('do_feed_rss2', 'custom_feed_rss2', 10);

これで読み込みたい記事の情報源の準備はOKです!

2.情報を読み込んで書き出す

2-1.情報を読み込む

RSSを読み込むためのライブラリを使用します。

  1. rss-phpをダウンロードします。
    https://github.com/dg/rss-php
  2. 『Feed.php』を読み込む側のテーマディレクトリ内にアップします

2-2.読み込んだ情報を書き出す

読み込みたいページのphpに下記を記述します。
※適宜編集してください

<?php
require_once TEMPLATEPATH. '/inc/Feed.php'; // 解凍したファイル『rss/Feed.php』をテーマディレクトリ内に格納する。
$feed = new Feed;
$url = 'https://www.example.com/feed'; // RSSのURL
$rss = $feed->loadRss($url);
$num = 4; //表示させたい件数
$i = 0;
$desW = 40; //概要(本文)の文字数
if ( $desW != 0 ){
  $desW = ($desW*2)+2;
}
foreach ( $rss->item as $item ){
  if($i>=$num){
  } else {
    $site_name = $rss->title; // サイト名
    $site_link = $rss->link; // サイトリンク
    $site_description = $rss->description; // サイトディスクリプション
    $title = $item->title; // 記事タイトル
    $link = $item->link; // 記事リンク
    $timestamp = strtotime( $item->pubDate ); // 更新日時
    $image = $item->image->url; // アイキャッチ
    $description = $item->description; // 概要(本文)
    $description = strip_tags($description);
    if ( $desW != 0 ){
      $description = mb_strimwidth($description, 0, $desW, "…",'utf-8'); // 概要(本文)の文字数が超えたら『…』が付く
    }
    $eyecatch = '/img/no-image.png'; // アイキャッチ画像がない場合の代替画像
    if ( $image ){
      $eyecatch = $image;
    }
    $days = 7; // 『New』を表示する日数
    $today = date('U'); // 今日って
    $sa = date('U',($today - $timestamp)) / 86400; // timestamp()の引数に86400を指定
?>
<div class="other_list">
  <div class="imgBox"><a href="<?php echo $link; ?>" target="_blank"><img src="<?php echo $eyecatch; ?>" alt="<?php echo $title; ?>"></a></div>
  <div class="textBox">
    <ul>
      <li class="date"><?php echo date( "Y.m.d", $timestamp ); if ( $days > $sa ) { echo '<span class="new">New</span>'; } ?></li>
      <li class="title"><a href="<?php echo $link; ?>" target="_blank"><?php echo $title; ?></a></li>
      <li class="description"><?php echo $site_description; ?></li>
      <li class="site_name"><a href="<?php echo $site_link; ?>" target="_blank"><?php echo $site_name; ?></a></li>
    </ul>
  </div>
</div>
<?php
    $i++;
  }
}
?>

以上で表示されるはず!です。

参考サイト:【WordPress】別サイトにアイキャッチ画像付きの新着記事を表示する(RSSフィードで簡単に)

  • URLをコピーしました!
目次