【PHP】既存のHPに外部のWordPressの記事を埋め込むコード

PHP
とりとん
とりとん

外部のWordPressも取得できる?

前回は、ドメイン直下のルートディレクトリにWordPressをインストールした場合の取得・表示方法を紹介しました。

今回は別のドメイン下にある、外部のWordPressの記事情報を取得する方法を紹介していきたいと思います!

ただ、外部のWordPressの場合は「【WordPressのURL】/feed/」⇦このfeedから情報を取得するので、サムネイルの情報は取得できず、本文中にある画像を取得のみ可能です。

※この記事で紹介するのは、外部サーバーにインストールしてあるWordPressから記事情報を取得・表示する方法です。

ドメイン直下のルートディレクトリにWordPressをインストールできる場合はこちらを参考にしてください⬇️

サンプルとして、

新着記事3件の表示&記事一覧ページへのリンクボタン

投稿日・カテゴリー・タイトル・の3項目を表示

という感じのスタイルで表示させてみました⬇️

とりとん
とりとん

早速コードを確認してみよう!

コード

PHP
<?php
    include_once(ABSPATH . WPINC . '/feed.php');
    $rss = fetch_feed('https://toriton.link/feed'); 

    if (!is_wp_error( $rss ) ) {
    	$maxitems = $rss->get_item_quantity(3); //3件表示の場合
    	$rss_items = $rss->get_items(0, $maxitems); 
    }
?>

<ul>
    <?php
        $cnt = 0;
        if ($maxitems == 0){
            echo '<li>nothing..</li>';
        } else {
            date_default_timezone_set('Asia/Tokyo');
        foreach ( $rss_items as $item ) { 
            $cnt++;
    ?>
    <a href=<?php echo $item->get_link(); ?>>
        <li class="news_list">
            <div class="whatsnews">
                <p class="date"><?php echo $item->get_date('Y.n.j'); ?></p>
                <p class="categories"><?php echo $item->get_category()->get_label(); ?></p>
            </div>
            <div class="title">
                <?php echo $item->get_title(); ?>
            </div>
        </li>
    </a>
    <?php }} ?>
</ul>

<div class="button">
    <a href="#">記事一覧</a>
</div>
CSS
.news_list {
    list-style: none;
    margin: 10px 0;
    box-shadow: 0 0px 0.6vw rgba(0, 0, 0, 0.1);
}

a{
    text-decoration: none;
}

.whatsnews {
    display: flex;
}

.date{
    color: #808080;
    padding: 5px 10px;
}

.categories {
    color: #fff;
    background: pink;
    border-radius: 10px;
    padding: 0 10px;
    margin: 5px 0;
}

.title {
    color: #000;
    padding: 5px 10px;
}

.button {
  overflow: hidden;
  border-radius: 10px;
}
  
.button a {
  display: block;
  position: relative;
  text-align: center;
  color: #808080;
  background: #fff3b8;
  padding: 2.5px 0;
}
  
.button a::before {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  right: 5px;
  width: 0;
  height: 0;
  margin-top: -6px;
  border: 6px solid transparent;
  border-left: 8px solid #fff;
}

取得できる情報まとめ

WordPressの関数を使えないので、feedから取得できる情報のまとめです。

出力するときに記述方法もWordPressの関数とは異なるのでご注意ください!

取得情報出力記述
投稿日<?php echo $item->get_date(‘Y.n.j’); ?>
タイトル<?php echo $item->get_title(); ?>
本文<?php echo $item->get_content(); ?>
リンク<?php echo $item->get_link(); ?>
カテゴリー<?php echo $item->get_category()->get_label(); ?>
抜粋文<?php echo $item->get_description(); ?>
投稿ID<?php echo $item->get_ID(); ?>

今回紹介したコードを参考に、任意で取得する内容を記述してみてください!

外部のWordPressでもアイキャッチ画像以外は簡単に取得することができるよ!

最後まで読んでいただきありがとうございました!

タイトルとURLをコピーしました