【ECCUBE4】WordPress連携して記事を埋め込む方法feed編

2020.10.14

ECオープンプラットフォームEC-CUBE

※この記事は上級者向きの記事です。
※この記事のカスタマイズはECCUBE4.0.2で実装確認したものです。

EC-CUBE4とWordpressが同ドメイン内、同サーバ内にない場合に、
feedを使ってWordpressの投稿をEC-CUBE側で表示させる方法をご紹介します。

前回は同じドメイン内でEC-CUBE4とWordpressを連携して構築するカスタマイズ方法をご紹介しましたが、
その場合は”wp-load.php”を読み込む方法が早くて確実ですので、以下を参考にしてください。

【ECCUBE4】WordPress連携して記事を埋め込む方法

※カスタマイズになるのでバックアップを取りながら進めましょう。

feedを読み込む
投稿内容を条件により取得する
WordPressアイキャッチやNEWマークも可能
テンプレート側(twig)で設置

feedを読み込む

WordPressの投稿を読み込みたいPHPファイル（XXXXController.php）で以下を設置します。

PHP

$url = "https://sample.com/wordpress/feed";
$xml = file_get_contents($url);
$obj = simplexml_load_string($xml)

“https://sample.com”と”wordpress”は
あなたの環境のWordpressインストールフォルダと置き換えてください。
ここではWordpressのfeedから読み込みxmlファイルに展開しオブジェクトにします。

もしpost_typeをhogehogeのみに限定したい場合は以下のようにすればＯＫ！
“https://sample.com/wordpress/hogehoge/feed”

投稿内容を条件により取得する

以下は投稿を最新から5件取得し”SampleList”に格納してテンプレート（twig）に渡すサンプルです。

PHP


    $i = 0;
    foreach ($obj->channel->item as $val) {
        if ($i < 5){
            $samples[$i]['title'] = $val->title;
            $samples[$i]['link'] = $val->link;
            $samples[$i]['date'] = $val->pubDate;
            $samples[$i]['description'] = $val->description;
        }
        $i++;
    }

    return [
        'SampleList' => $samples,
    ];

“sample”や”5″はあなたの環境にあわせて置き換えてください。

WordPressアイキャッチやNEWマークも可能

必要に応じて、foreach文の中に追加しましょう。

アイキャッチ画像

アイキャッチ画像は以下で取得可能です。

PHP

$samples[$i]['image'] = $val->thumb->url;

NEWマーク判断

NEWマークは以下で取得可能です。
投稿日から5日間はtrue,それ以外はfalseを返す処理となっています。

PHP

// 5日前取得
$last_date = date('Ymd', strtotime('-5 day', time()));
if (date('Ymd', strtotime($val->pubDate)) >= $last_date){
    $samples[$i]['newmark'] = true;
}else{
    $samples[$i]['newmark'] = false;
}

テンプレート側(twig)で設置

テンプレートでは取得したデータをfor文で以下のようにして値を設置できます。HTMLは適当ですので、自由に調整してくださいね。

HTML

    {% for Sample in SampleList%}
      <a href="{{ Sample.link }}">

          <!-- アイキャッチ画像(なければ/common/default.png） -->
          <img src="{% if Sample.image %}{{ Sample.image }}{% else %}/common/default.png{% endif %}" alt="{{ Sample.title }}">

          <!-- タイトル -->
          <h3>{{ Sample.title }}</h3>

          <!-- 投稿日'Y.m.d'とNEWマーク -->
          {{ Sample.date|date('Y.m.d') }}{% if Sample.newmark %}NEW!!{% endif %}

          <!-- description -->
          <p>{{ Sample.description }}</p>

      </a>
    {% endfor %}

Wordpress連携して記事を埋め込む方法feed編のまとめ