Ajaxのフィルタカテゴリのwordpressのホスティング
前書き
プラグインの開発を目的としたこの記事では、プラグインにアヤックスを追加する方法について説明します。この記事を読む前に、次のように精通している必要があります。
- アヤックス - 技術の概要
- プラグインを書く - プラグインを作成する方法
- プラグインAPI - フィルターとアクション - 彼らは何とその使用方法
- 適切なWordPressのページ、ポスト、または画面にHTMLを追加する方法 - あなたが作成し管理画面へのAjaxを追加する場合、たとえば、あなたがWordPressへ管理メニューを追加する方法を理解する必要があります。あなたは、単一のポストの表示にアヤックスを追加したい場合は、見る人に面したブログ画面にその場所にHTMLを追加するために、右フィルタと処置を把握する必要があります。この記事では、これらのトピックをカバーしていません。
管理側でのアヤックス
Ajaxは、すでにコアWordPressの管理画面に組み込まれているので、あなたのプラグインにより行政側のAjax機能を追加することは非常に簡単です。
この短い例では、ページのフッターに私たちのJavaScriptを書くためにPHPを使用しています。このスクリプトは、ページが完全にロードされたAJAX要求をトリガ:
注:バージョン2.8以降。 JavaScriptのグローバル変数ajaxurlは、あなただけのファイルはJavaScriptにPHPファイルからJavaScriptコードを分離したい場合にも使用することができます。これは、行政側で真です。あなたは、フロントエンドでAJAXを使用している場合は、管理者-ajax.php URLのあなたのJavaScriptを認識させる必要があります。ベストプラクティスをwp_localize_script用いて以下、第四の実施例に記載されています()。
その後、AJAX要求を処理するためにPHPの機能を設定します。
上記の私たちのJavaScriptで定義された「アクション」キーの値「my_action」が、下記の当社AJAXハンドラでアクション「wp_ajax_my_action」の後半に一致する方法に注目してください。管理者-ajax.phpを介してサーバー側のPHPの関数を呼び出すために使用されているためです。アクションが指定されていない場合は、管理者-ajax.phpは終了し、その過程で0を返します。
あなたは、このようなエラーは、要求が適切な場所から来たことを確認し、検証することなど、いくつかの詳細、(check_ajax_refererを使用して())を追加する必要がありますが、うまくいけば、上記の例では、独自の行政側のAjaxのプラグインを始めるのに十分でしょう。
wp_dieの使用を注意してください()。代わりに、ダイ()または出口()。あなたはAjaxのコールバック関数でwp_die()を使用する必要がありますほとんどの時間。これは、ワードプレスとの統合を提供し、それが簡単にあなたのコードをテストすることができます。
別のJavaScriptファイル
我々はJS / my_query.jsと呼ぶことにします別の外部ファイルにJavaScriptを使用して除いて前の、同じ例。例として、プラグインフォルダを基準にしています。
)(外部JavaScriptファイルでは、我々は最初のwp_enqueue_scriptしなければならないので、それらがページに含まれています。さらに、我々はPHPが私達のJavaScriptファイルに直接ではなく、エコーの値ができるため、JavaScriptオブジェクトのプロパティに値を渡すために)(wp_localize_scriptを使用する必要があります。ハンドラ関数は、前の例と同じです。
ビューアに面する側上のAjax
ワードプレス2.8以来、wp_ajax_に似フック(アクション)があります。
だから、あなたがしたい場合、それは両方の訪問者のためのフロントエンドに発射すると、ログインしているユーザーは、この操作を行うことができます。
注:、管理者側とは異なり、グローバルが自動的に定義されませんジャバスクリプトajaxurlあなたはバディを持っているか、別のAjax-依存プラグインがインストールされていない限り。だからではなく、グローバルjavascriptの変数に依存するので、独自のプロパティ、ajaxurlでJavaScriptの名前空間のオブジェクトを宣言します。また、あなたのスクリプトへのURLが利用できるようにし、この式を使用して、それを生成するためにwp_localize_script()を使用することがあります:ADMIN_URL(「管理者-ajax.php」)
注2:フロントエンドとバックエンドのAjaxリクエストの両方が常にあなたのアクションは、コードの取り扱いにtrueを返します()is_adminので、管理者-ajax.phpを使用しています。選択的に、フロントエンドとバックエンドのためのあなたのAjaxスクリプトハンドラをロードし、そしてis_admin()関数を使用する場合は、あなたのwp_ajax_(アクション)とwp_ajax_nopriv_(アクション)フックはis_admin()===真部分の内側でなければなりません。
wp_ajax_またはwp_ajax_nopriv_いずれかのアクションにバインドされたAjaxリクエストは、WP管理コンテキストで実行されます。非特権ユーザーや訪問者が彼らが認可されない場合があり特権で要求をトリガすることができるようになりますので、慎重にあなたのコードで実行されるアクションを確認します。
ここではAjaxのアクションmy_frontend_actionは、すべてのユーザーのためのPHP関数my_frontend_action_callbackを()トリガーされます。 Ajaxのアクションmy_backend_actionは、ログインしたユーザーのためのPHP関数my_backend_action_callbackを()トリガーされます。
後負荷のJavaScriptイベント
コンテンツが挿入された後にAjaxを介してコンテンツを挿入するプラグインやテーマはdocument.bodyにポストloadイベントをトリガしなければなりません。このようAddToAnyやjQueryの石造スクリプトなどのコンテンツを挿入した後、JavaScriptの相互作用に依存する他のスクリプトは、自分の必要なJavaScriptを初期化するために、ポストloadイベントをリッスン。後負荷のイベントはJetpackのの無限スクロールから発射された場合。例えば、AddToAnyは、各ポストの共有ボタンを表示し、jQueryの石積みは、ページ上の要素を位置決めします。
コンテンツの後のポストloadイベントをトリガーするJavaScriptはAjaxを介して挿入されています:
JavaScriptは、ポストloadイベントを聞いて:
jQueryの上の注意:それが原因となりますので、コンテンツを挿入するようにセレクタ式でjQueryのloadメソッドを使用しての用心