WordPressウィジェットプラグインの作成方法

公開: 2022-10-02

WordPress のファンなら、おそらくウィジェットに精通しているでしょう。 ウィジェットは、サイドバーやテーマのその他のウィジェット対応エリアに追加できる小さなボックスです。 通常、ブログの最近の投稿、Twitter フィード、カレンダーなどの情報が含まれています。 しかし、独自のウィジェットを作成できることをご存知ですか? 実際には非常に簡単です。 この記事では、WordPress ウィジェット プラグインの作成方法を紹介します。 まず、基本的なプラグイン ファイルを作成してから、ウィジェット クラスを追加します。 次に、ウィジェットを登録して、WordPress 管理画面に表示されるようにします。 最後に、サイトのフロントエンドにウィジェットを表示するコードを追加します。 始めましょう!

私は最近、Freelancer Widgets Bundle というプラグインを開発しました。 プラグインについて何を書くべきか尋ねられたとき、人々から問い合わせがあったので、この投稿を書く時が来たと思いました。 WordPress プラグインをインストールするときは、コードを追加する必要があります。 プラグインを開発するには、Coda (Mac) や Dreamweaver (PC) などのエディタが必要です。 コンストラクターは、ウィジェットの名前と主な引数を定義する関数です。 これはどのように見えるかの例です。 フォーム フィールドを変更する場合は、セキュリティ上の理由から esc_attr() を使用してください。 パラメータ「customize_selective_refresh」を使用すると、ウィジェットを編集するときだけでなく、外観の下でも更新できます。

つまり、ウィジェットへの変更は、リストに表示するために更新する必要はありません。 基本テキストを除くすべてのタグは、WP_strip_all_tags で削除されます。 WP_kses_post_string() は投稿内容文字列と同じ関数です。 この関数は、widget() 関数を使用して Web サイトのコンテンツを生成します。 この関数は、特定のタグまたはクラスを含めるようにカスタマイズできます。 GitHub は、コード全体を表示するのに理想的な場所です。

ウィジェットを Web サイトに追加する場合は、追加したいページに移動し、HTML の「/body」タグが閉じる前にコードを貼り付けます。 ウィジェットを表示するすべての Web ページにコードを含める必要があります。 ファイアウォールをチェックして、 Web Widget (クラシック) が有効になっているかどうかを確認します。

どちらも視覚的な生き物ですが、この 2 つは可視性や相互作用など、異なる特徴を持っています。 ページがバックグラウンドでスムーズかつ適切に実行されている場合、これはプラグインです。 ユーザーがページ上でそれを操作するには、ユーザーに表示されている必要があります。

WordPress 用のカスタム ウィジェット プラグインを作成するにはどうすればよいですか?

WordPress 用のカスタム ウィジェット プラグインを作成するには、次のコードを含む PHP ファイルを作成する必要があります。 /* Plugin Name: [プラグインの名前] Description: [プラグインの説明] */ // ウィジェットの登録とロードfunction [name_of_plugin]_load_widget() { register_widget( '[name_of_plugin]' ); } add_action( 'widgets_init', '[name_of_plugin]_load_widget' ); // ウィジェット クラスの作成 [name_of_plugin] extends WP_Widget { function __construct() { parent::__construct( // ウィジェットのベース ID '[name_of_plugin]', // ウィジェット名が UI に表示されます __('[プラグイン名] ]', '[name_of_plugin]'), // ウィジェットの説明 array( 'description' => __( '[プラグインの説明]', '[name_of_plugin]' ), ) ); } // ウィジェット フロントエンドの作成 // ここでアクションが発生します public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); // ウィジェットの引数の前後はテーマによって定義されます echo $args['before_widget']; if ( ! empty( $title ) ) echo $args['before_title'] . $タイトル。 $args['after_title']; // ここでコードを実行し、出力を表示します echo __( '[プラグイン名]', '[プラグイン名]' ); echo $args['after_widget']; } // ウィジェット バックエンド public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) { $title = $instance[ 'title' ]; } else { $title = __( '[プラグイン名]', '[プラグイン名]' ); } // ウィジェット管理フォーム ? > WordPress ユーザーがウィジェット領域を作成するとき、その領域に小さなコンテンツを追加します。 インストールされているウィジェット エリアによって、ウィジェットはすべてのページにさまざまな種類の情報を表示する場合もあれば、特定の情報のみを表示する場合もあります。 デフォルトで利用できるウィジェットもあれば、プラグインやテーマを利用して利用できるウィジェットもあります。 基本的なカスタム ウィジェットを作成するには、上記の 4 つのメソッドをクラスに追加する必要があります。 ウィジェットをダッシュ​​ボード内で使用するには、register_widget() 関数を使用してウィジェットを登録する必要があります。 この記事で紹介した例を検討する前に、コードの各セクションの目的について簡単に説明します。 Custom_Widget クラスで使用するメソッドの 1 つに、文字を割り当てるメソッドがあります。custom_widget を ID とするウィジェットを、__construct() メソッドを使用したコンストラクター メソッドで作成しました。 register_widget() メソッドを使用すると、既存のウィジェットが登録された後に新しいウィジェットが作成されます。 各パーツを if…* ステートメントでラップして、ウィジェット オプションに含まれている場合にそれらのパーツのみが表示されるようにしています。 widget() メソッドには nl2br() 関数が含まれており、すべての複数段落テキストが適切に表示されるようになっています。 sanitize_text_field() は、引数から不要な空白、タブ、および改行を削除します。 さらに、select フィールド内のデフォルト値として Yes 値が設定されています。これは、前の 2 つのケースでリンク ターゲットが _blank に設定されていることを示しています。 タイトル、テキスト、タイトルの下のリンク、およびリンクを新しいタブで開くかどうかをすべて指定する必要があります。すぐに [保存] ボタンをクリックして、選択したオプションを保存してください。 デフォルトのテーマを選択すると、ウィジェットは別の出力を生成します。 この場合、Lekker WordPress テーマを使用すると、ウィジェットは次のようになります。WordPress でカスタム画像ウィジェットを作成するには?WordPress サイドバーに画像を追加するには、[画像] ウィジェットを選択します。 外観に移動して、外観を変更できます。 ウィジェットを含むページがある場合は、「画像」ウィジェットをサイドバーに追加します。 カスタム ウィジェット プラグインクレジット: octobercms.com カスタム ウィジェット プラグインは、独自のカスタム ウィジェットを作成できるプラグインです。 このプラグインは、ウェブサイトやブログ用のカスタム ウィジェットを作成したい人に最適です。 このプラグインを使用すると、自分でコーディングしなくてもカスタム ウィジェットを簡単に作成できます。Qt Designer で使用できるカスタム ウィジェットを提供するには、自己完結型の実装とプラグイン インターフェイスを提供する必要があります。 この例のカスタム ウィジェットは、対応するアナログ クロックと同様に、カスタム シグナルまたはスロットを持ちません。 Q_PLUGIN_METADATA() マクロを使用して、ウィジェットからデータをエクスポートすることにより、ウィジェットがプラグインとして正しく識別されるようにする必要があります。 AnalogClock クラスは、ウィジェット ボックス内のカスタム ウィジェットとして使用でき、自己完結型クラスの例です。 Qt Designer には、AnalogClock クラスのプラグイン クラスが含まれています。 QObject クラスのコンストラクターは、初期化された変数を false に設定する QObject 基本クラス コンストラクターを呼び出すだけです。 isInitialized() 関数は、Qt Designer がプラグインを識別できるようにすることで、プラグインを使用する準備ができているかどうかをチェックします。 createWidget() 関数は、カスタム ウィジェットのインスタンスを生成できます。 ウィジェット プラグインは、Qt Designer のウィジェット プラグイン セクションのグループ名に表示されます。 ツール ヒントとこれは何ですか? ウィジェット ボックスでは、カスタム ウィジェットのヘルプを提供できます。 isContainer() 関数は、ウィジェットを他のウィジェット イメージのコンテナーとして使用する必要があるかどうかを確認します。 これにより、ユーザーはウィジェットを作成できなくなります。カスタム ウィジェット WordPress コードクレジット: www.hostpapa.inカスタム ウィジェットは、WordPress サイトに機能を追加する優れた方法です。 サイトにカスタム ウィジェット コードを追加する際には、いくつかの注意事項があります。 まず、テーマのディレクトリに「widget.php」というファイルを作成する必要があります。 次に、widget.php ファイルに次のコードを追加する必要があります。 ( 'description' => __( 'WordPress サイトのカスタム ウィジェット', ' text_domain' ), ) ); } public function widget( $args, $instance ) { $title = apply_filters( 'widget_title', $instance['title'] ); echo $args['before_widget']; if ( ! empty( $title ) ) echo $args['before_title'] . $タイトル。 $args['after_title']; echo __( 'Hello, World!', ' text_domain' ); echo $args['after_widget']; } public function form( $instance ) { if ( isset( $instance[ 'title' ] ) ) { $title = $instance[ 'title' ]; } else { $title = __( '新しいタイトル', 'text_domain' ); } ? > } public function update( $new_instance, $old_instance ) { $instance = array(); $instance['title'] = ( ! empty( $new_instance['title']Wordpress テンプレートにウィジェットを追加WordPress テンプレートにウィジェットを追加するプロセスは簡単です。ホスティング アカウントから WordPress ファイルにアクセスし、適切なファイル. ほとんどの場合, これは header.php ファイルになります. ウィジェットを追加したい領域を制御するコードを探します. 次に, 追加したいウィジェットのコードをコピーして、適切な場所に貼り付けます.ファイルにスポット. ファイルを保存し、サーバーにアップロードします. それだけです! これで、ウィジェットが WordPress サイトに表示されます.WordPress には、the_widget() というテンプレート タグがあり、ウィジェットを直接テンプレート ファイル. ウィジェットは、使用したいウィジェットのクラス名と表示したい場所を含むファイルに配置できます. つまり、最近のコメントを一覧表示したい場合は、次のように記述できます:各ウィジェットの $instance 組み込み関数を使用して、多くの定義を追加できますWordPress ウィジェットを使用するのではなく、テンプレート ファイルに追加します。 カスタム ウィジェットは、the_widget() メソッドを使用してテンプレート全体に挿入できます。 サイドバーとは異なるプラットフォームで使用できるカスタム ウィジェットは、多くのプラグインで利用できます。WordPress テーマにウィジェットを追加するにはどうすればよいですか?WordPress 管理画面にアクセスして、外観ページを表示します。 ウィジェットを特定のサイドバーにドラッグするか、[ウィジェットを追加] リンクをクリックして、ウィジェットを選択します (テーマに複数のサイドバーがある場合は、目的のサイドバーを選択します)。WordPress ページ テンプレートからウィジェットを呼び出す方法は?ウィジェットが表示される場所にファイルを挿入します。 2 番目のステップは、使用するウィジェットを決定することです。 このセクションでは、デフォルトの WordPress ウィジェットのクラス名について説明します: WP_Widget_Archives.WordPress でカスタム画像ウィジェットを作成する方法 WordPress でカスタム画像ウィジェットを作成するには、まずカスタム プラグインまたは子テーマを作成する必要があります。 これが完了したら、プラグインまたは子テーマ内に「image-widget.php」という新しいファイルを作成できます。 このファイル内に、次のコードを含める必要があります: class WP_Widget_Custom_Image extends WP_Widget { function __construct() { $widget_ops = array( 'classname' => 'widget_custom_image', 'description' => __(カスタム イメージをアップロードします。', ' text_domain' ), ); parent::__construct( 'custom_image', __( 'Custom Image', 'text_domain' ), $widget_ops ); } function widget( $args, $instance ) { echo $args['before_widget']; if ( ! empty( $instance['title'] ) ) { echo $args['before_title'] . apply_filters( 'widget_title', $instance['title'] ). $args['after_title']; } if ( ! empty( $instance['image'] ) ) { エコー ”; } echo $args['after_widget']; } function update( $new_instance, $old_instance ) { $instance = $old_instance; $instance['title'] = sanitize_text_field( $new_instance['title'] ); $instance['image'] = esc_url_raw( $new_instance['image'] ); $ インスタンスを返します。 } 関数形式( $instance ) { $title = ! 空 ( $インスタンス['タイトル'] ) ? $instance['title'] : __( 'カスタム イメージ', 'text_domain' ); $イメージ = ! 空 ( $インスタンス['画像'] ) ? $インスタンス['画像']: ”; ?画像ウィジェット プラグインは、WordPress メディア マネージャーを使用してサイトに画像ウィジェットを追加するために使用できるシンプルなプラグインです。 ウィジェットの出力テンプレートにデフォルトのテンプレートを含めるのが一般的ですが、これはテンプレート内のファイルによって変更できます。 3.2 では、sh_template_image_widget_php フィルターも追加され、デフォルトのテンプレートの動作をオーバーライドできるようになりました。 特定のウィジェット インスタンスについて詳しく知るには、2 つの引数 $args と $instance も追加する必要があります。 これをオーバーライドすると、レスポンシブ デザインで使用できます。 ランダムな画像のスライダーを追加するにはどうすればよいですか? はい、そうするオプションがあります。通常、これは Image Widget プラグインのサイドバー表示から直接処理されます。 サイドバーの表示は特定のページに設定する必要があります。 このページに関するご質問やご意見がありましたら、お知らせください。 Image Widget は、オープン ソース ソフトウェア プロジェクトです。 このプラグインは、さまざまな貢献者によって公開されています。 画像を含めたい場合はフィールドを 1 つ追加でき、リンクを含めたい場合はクラスを追加できます。 約 15 分かかるので、投資する価値があります。WordPress で新しいウィジェットを作成するにはどうすればよいですか?ウィジェットを関連するウィジェット領域にドラッグするか、ページの左側から左側にドラッグします. 追加したいウィジェットをクリックすると、その方法のリストが表示されます。 新しいウィジェットを既存のエリアに追加するには、[ウィジェットの追加] ボタンをクリックします。