コーディングはよく分からないけど、コピペはできる!という人にはおすすめです!
どうやってやるの?
今回はWebAPIを呼び出し、「ショートコード」を作成し投稿欄に張り付けます。
サンプルソースをテーマのfunction.php内にコピペして修正をします。
ショートコードは、function.phpに記入したプログラムを投稿欄などで呼び出す機能です。セキュリティ上難しい機能をカスタマイズすることができます。
今回WebAPIを採用していますが、シンプルにDBへ接続して表示することも可能です。
サンプルソース
WebAPIアドレスや実際にTABLEタグのクラス・構成は適時読み替えて下さい。
コード上半分ではWebAPIを呼び出し、JSON形式で読み取ったデータを下半分でTABLEタグに置換する処理を記述しています。
※コード上半分をデータベース接続に変更すれば、任意のデータベーステーブルを表示できます。
function call_api() {
$base_url = '*******'; //WebAPIアドレス
//WebAPI呼び出し
$curl = curl_init();
$option = [
CURLOPT_URL => $base_url,
CURLOPT_CUSTOMREQUEST => 'GET', //GETメソッド
CURLOPT_SSL_VERIFYPEER => false,
CURLOPT_RETURNTRANSFER => true,
];
curl_setopt_array($curl, $option);
$response = curl_exec($curl);
$result = json_decode($response, true);
$wapi='<table class="*****"><thead><tr>'.
//テーブル構造ヘッダー
'</tr></thead><tbody>';
foreach ($result as $value){
$wapi.='<tr><td>'.'*******'.'</td></tr>';//テーブル内容
}
$wapi.='</tbody></table>';
curl_close($curl);
return $wapi;
}
add_shortcode("wapi", "call_api");
使用方法
投稿記事の任意の場所にショートコードを記入します。
[wapi]
※[]は半角で使ってください
デモ
デモとして、技術記事で紹介しているD3.jsサンプルで呼び出している愛知県市町村データWebAPI(自作)を呼び出し表示します。

WebAPI仕様
WebAPIは下記仕様で作成する。
Dbに登録してある市役所の住所・電話番号・公式サイトURLが取得できる。
※現在は、豊田市・岡崎市・豊橋市のみ(2019.1.28現在)
- Request URL:https://ssit.jp/api/holls
- Method:GET
- Header:name=”H-API-KEY”/value=”AUTH_API_KEY_20181203″
実行結果
市町村名 | ホームページURL |
---|---|
【豊田市】 | http://www.city.toyota.aichi.jp/ |
【岡崎市】 | http://www.city.okazaki.lg.jp/ |
【豊橋市】 | http://www.city.toyohashi.lg.jp/ |
※aタグを組み合わせれば表からリンクをすることもできます。
ソース
function call_api() {
$base_url = 'https://ssit.jp';
$header = [
'H-API-KEY: AUTH_API_KEY_20181203',
];
//WebAPI呼び出し
$curl = curl_init();
$option = [
CURLOPT_URL => $base_url.'/api/holls',
CURLOPT_CUSTOMREQUEST => 'GET',
CURLOPT_SSL_VERIFYPEER => false,
CURLOPT_HTTPHEADER => $header,
CURLOPT_RETURNTRANSFER => true,
];
curl_setopt_array($curl, $option);
$response = curl_exec($curl);
$result = json_decode($response, true);
//TABLE ヘッダー部生成
$wapi='<table class="demo03"><thead><tr>'.
'<th width="50%">市町村名</th><th width="50%">ホームページURL</th>'.
'</tr></thead><tbody>';
//TABLE データ行生成
foreach ($result as $value){
$wapi.='<tr><td>【'.$value["cityName"].'】</td><td align="right">'.$value["link"].
'</td></tr>';
}
$wapi.='</tbody></table>';
curl_close($curl);
return $wapi;
}
add_shortcode("wapi", "call_api");
まとめ
WordPressは使い勝手が良いですが、セキュリティの関係上プログラミングなどの要素はカプセル化されています。
ショートカットは一番簡単で実装しやすい方法です。
プラグインやテーマそのものはハードルが高いなという人にもおすすめです。
WebAPIは敷居が高いという方には、データベースへ直接接続する方法もあります。