内容

ショートコードを使用してWordPress上にデータを表示する

サードパーティの API を WordPress サイトに接続する必要があり、API からのデータを WordPress サイトに表示する必要があるという状況がよく発生します。 WordPress には、そのままでは外部 API に接続してフロントエンドにデータを動的に表示する機能がありません。しかし、待ってください。問題を解決する解決策があります。

Custom API for WordPress は、外部 API からデータを取得し、WordPress データベースに保存せずに WordPress サイトに直接表示することで、WordPress ウェブサイト上の API からの応答をリアルタイムで表示するタスクを容易にします。完全なセットアップガイドと使いやすいユーザーインターフェイスが付属しています。

CUSTOM API for WORDPRESS プラグインの助けを借りて、ショートコードを使用して外部 API からのデータを WordPress フロントエンドに表示する方法を見ていきます。データは外部のサードパーティサーバーから取得され、ショートコードを使用して動的に HTML テーブル要素に表示されます。時間を無駄にせずに、ユースケースを見てみましょう。

WordPress サイトがあり、WordPress フロントエンドに表示する必要があるデータを外部 API から取得しているとします。 CUSTOM API for WORDPRESS プラグインは、ショートコードを使用して WORDPRESS フロントエンドにデータを表示する機能を提供するため、使用できます。

また、カスタム HTML、CSS、JavaScript を追加して、Web サイトのスタイルと選択に従って受信データのスタイルを設定する機能も提供します。

WordPress 用のカスタム API

投稿者:miniOrange

Custom API for WordPress プラグインを使用すると、WordPress API/カスタムエンドポイント/REST API を作成できます。使いやすいグラフィカルインターフェイスを使用して、データを取得/変更/作成/削除できます。

詳細を知りたい

miniOrange Custom API for WordPress を使用して、WordPress フロントエンドに受信データを表示する方法を見てみましょう。

お客様からの問い合わせ:

受信したデータをフロントエンドに送信するにはどうすればよいですか?また、ユーザーがデータが表示されるページをロードするたびに API 呼び出しを実行することは可能ですか。

WordPress 用のカスタム API

By ミニオレンジ

(11)

このプラグインを入手

ダウンロードとインストール

Custom API for WordPress プラグインの Enterprise バージョンが必要です。
miniOrange のアカウントが必要です。
WordPress に管理者としてログインする必要もあります。

WordPress に管理者としてログインします。
Custom API for WordPress のエンタープライズバージョンをアップロードしてアクティブ化します。次のプラグインダッシュボードが表示されます。

に行く 外部APIに接続する タブ。必要な API の詳細を入力し、をクリックします。 Save ボタン。これにより、構成された外部 API が保存され、クリックして接続をテストできます。 実行する

接続が成功すると、API 応答を示す応答テーブルを含むポップアップが表示されます。 (ブラウザのポップアップが有効になっていることを確認してください)。

WordPress フロントエンドにデータを表示するには、ポップアップを閉じて、 保存された外部 API タブをクリックして編集

ソフトウェアの制限をクリック 事前設定

次の画面が表示され、独自の HTML、CSS、JavaScript を記述できます。

参照キー これは、ステップ 5 で確認できる API 応答内のデータがどこにあるかを意味します (ステップ 5 のスクリーンショットを確認してください)。「.」を置き換えるだけです。「->」を使用します。また、変数をで囲みます。 ## ステップ 8 でわかるように、 ループ データが繰り返される場合はオプション、そうでない場合は選択します 固定の データが反復的でない場合。
この手順を完了したら、構成を保存し、任意のページに移動して次のようなショートコードを入力できます。 [mo_custom_api_shortcode api="テスト"] コラボレー test 構成された API の名前です。プラグインで設定した内容に従って API 名を変更する必要があります
すべてが正しく行われた場合は、ページにアクセスして出力を確認できます。以下は私たちの出力です テストAPI.