BASEのAPIでWordPressに商品情報を表示する

BASEのAPIで商品情報を取得、WordPressで表示する方法の覚書です。2015年あたりにプラグインがあったようですが、現在は更新されておらず、自力で表示してみました。


【今回の手順】

  • BASE(ベイス)のAPI申請
  • JSONで商品情報の取得
  • JSONからデータ取得、WordPressへ表示

BASE(ベイス)のAPI申請

APIを利用するにはBASEさんへ申請を行う必要があります。2020年9月現在、申請して丸1週間かかりました。申請の方法はこちらのサイト「PythonでBASEのAPIを叩いて商品データを取得してみる -その1-」が参考になりました。BASE側の作業が図解で詳しく説明されています。
欲しいものは「client_id」と「client_secret」、後ほど作成するPHPファイルを格納する「コールバックURL」の記載が必要です。コールバックURLはどこでも構いませんが、WordPressからアクセス可能なサーバ内のURLを記入してください。

JSONで商品情報の取得

BASEの商品情報を取得します。こちらのサイト「BASE(ベイス)のAPIを使ってホームページ掲載用のデータを取得するPHPプログラム」を参考にしました。
「client_id」と「client_secret」、申請時に記載した「コールバックURL」を追記します。上記サイトのプログラムを記載してbaseapi.phpとし、「コールバックURL」へuploadします。webブラウザから「コールバックURL/baseapi.php」でアクセスすると、API利用を許可する画面に遷移します。BASEのログイン用メールアドレスとパスワードを入力、「アプリを承認する」ボタンをクリックします。「コールバックURL」に「itemdata.json」が生まれていれば成功です。

JSONからデータ取得、WordPressへ表示

JSONファイルを開くと直近から100アイテムの情報が取得されていると思います。数件で良い場合は、baseapi.phpプログラム内71行目、limit=100の部分を任意の数字に書き換えます。欲しい情報が直近の5件で良い場合はlimit=5です。

下記のコードをコピペしてphpファイルにします。お使いのテーマ内などにいれて、ショートコードで呼び出します。下記コードは 最新商品1つのタイトルと、画像1枚目に商品リンクを貼ったものです。

2行目:callback_urlを「コールバックURL」に置き換えてJSONファイルまでのパスを通します。
10、14行目:your_base_urlをご自身のBASEサイトURLに置き換え。

あとはお好きなCSSで加工してください。

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です