import { useSelect } from '@wordpress/data'; const useCurrentPostCategories = () => { const categoryIds = wp.data.select('core/editor').getEditedPostAttribute('categories') return useSelect((select) => { const {getEntityRecords} = select('core') const taxonomies = getEntityRecords('taxonomy', 'category') if (!taxonomies) return [] const currentCategories = taxonomies.filter(taxonomy => { return ca

【2021年4月14日まで】20%オフセール実施中！→終了しました WP Rocket ウェブサイトを運用していてアクセスが多くなってくると、気になってくるのがウェブサイトの表示速度。WordPressでサイトを運用していると、多くのプラグインを有効にすることで関連ファイルの読込が増えたり、記事数増加に伴いデータベースが大きくなったり、オリジナルテーマやテーマをカスタマイズして制作した場合によくある表示速度を考えて作られていないなど、色々な問題が出てきます。 表示速度が遅いサイトは直帰率やコンバージョン、SEOに悪影響があるため、パフォーマンス改善は非常に重要な項目です。そこで、改善のためのWordPressプラグインであるWP Rocketのメリットや導入方法などをご紹介します。 表示速度の重要性 デザインや見た目はいいウェブサイトなのに、読み込むまで時間がかかったりページが重い等では、

この記事のショートリンクを取得 <a href='https://wp-doctor.jp/blog/?p=5628' target='_blank'>ワードプレスで最も先に実行されるアクションにフック(Action、Hook)するには？</a> ワードプレスにはアクションと呼ばれる、処理の実行時に、自分のプログラムを加えて実行できる仕組みがあります。今回はこのアクションで最も先に実施される物につきまして解説したいと思います。 ワードプレスで最も初期に実行されるアクションは？ 結論から言いますと、一番初期に実行されるアクションはmuplugins_loadedです。ただ、このフックはあなたのプラグインがmupluginsフォルダ(必ず利用するプラグイン用の特殊フォルダ)に配置されている必要があります。 そうでない場合は、ワードプレスで最も初期に実行されるアクションはplugins_load

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

WordPressのカスタマイズにおいて欠かせないのが、アクションフックとフィルターフック。 今回はこの「アクションフック」の方について知識をつけていこう！ ということで、WordPressの主要なアクションフックの実行順序について検証してきたので、メモしておきます。 どのアクションが早くてどのアクションが遅いのかを、フロント側で実行される20種のアクションフックについて調べてみました。（全部のアクションフックを検証するのはきつすぎた...。笑） 全アクションフックはここで確認できます：Codex日本語版：プラグイン API/アクションフック一覧 検証結果：主要なアクションフックの実行順序一覧 先に結果を。 今回の検証で確認できた実行順序は次の通りでした。 after_setup_themeset_current_userregistered_post_type（複数回実行）registe

複数の Web サイトを運用していて、WordPress で投稿したブログの内容（タイトルやアイキャッチ、公開日など）を別の Web サイトにも表示させたいと思ったことはありませんか？ 同じサーバー上でしたら読み込むのは簡単ですが、別のサーバー上にある WordPress の投稿を参照するのはハードルが高めです。 そこで今回は、WordPress に標準搭載されている『 WP REST API 』を使ってブログの内容を他の Web サイトに表示させる方法を紹介します。 PHP を使わず JavaScript と HTML だけで実装できるので、表示させたい側の Web サイトのサーバーが PHP に対応していない場合も安心です。 目次 WordPress の『 WP REST API 』について 『 WP REST API 』で最新のブログ一覧を取得する方法 他のWebサイトに最新のブログ

#この記事は？ Wordpressの新エディタGutenbergをいじってて よく使いそうだと思ったコンポーネントをまとめていきます 追記編集していきます TextControl と TextareaControl テキスト編集のコンポーネント。 onChangeでイベントオブジェクトじゃなく中身の文字列だけが渡されるようになってるので、値の取り出しとかしなくていいので普通にtextareaとか書いちゃうより楽です。 const {TextControl, TextareaControl} = wp.components; registerBlockType('myPlugin/myBlock',{ edit({attributes,className,setAttributes}){ return [ <TextControl onChange={(newText1)=>setAttri

WordPress で WP REST API を使って検索するときに、 http://example.org/wp-json/wp/v2/posts/?search=タイトル ですると、本文内に含まれているものまで検索されてがっかりするあなたにこんな事してみてはいかがでしょうか。 add_filter( 'rest_post_query', 'my_rest_post_query', 10, 2 ); // rest_{post_type}_query 今回は post なので rest_post_query function my_rest_post_query( $args, $request ) { if ( isset( $request['title'] ) ) { $args['title'] = esc_attr( $request['title'] ); } return

やりたかったこと カスタムフィールドの値を用いて取得結果をソートしたかった。 結論 rest_[post_type]_query フィルターフックに処理を適用することでREST APIで検索条件の設定が行えます。 例えば以下のようにフィルターフックに処理を追加することで、特定の投稿タイプ(今回はpost)の投稿一覧を取得する際に指定のカスタムフィールドの降順でソートされた結果が返ります。 add_filter('rest_post_query', function ($args, $query) { $args['orderby'] = 'meta_value_num'; // meta_value_numは数値として扱う、meta_valueだと文字列扱い $args['meta_key'] = '[カスタムフィールド名]'; return $args; }, 10, 2); 詳細 re

ポートフォリオを引き続きアップデートしており 今はWordPressのREST APIを使用してブログ機能を追加しています。 TL;DR WordPressのREST APIだと最大でも100件までしか記事が取得できなかったから functions.phpに全記事を書き出すJSONを追加してみた。 WordPressのREST APIの取得について まずドキュメントへのリンクを。 WordPressの公開URL末尾に「/wp-json/wp/v2/」することで取得可能で ここにパラメーターなどを渡して、カテゴリー一覧などを取得します。 公式サイトのURLだとこんなイメージ https://wordpress.org/wp-json/wp/v2/ デフォルトで最大件数で取得する場合のパラメーターでよくあるのはこれみたいです（検索調べ） /wp-json/wp/v2/posts?per_pag

wordpress apiを取得 wordpress rest api と言う仕組みでデータを取得する サイトのurl/wp-json/wp/v2/posts でデータを見られる ajaxとjson jsのajaxを使用し、データを取得し、リンク付きのタイトルを表示する $.ajax({ type: "GET", url: "サイトのurl/wp-json/wp/v2/posts", dataType: "json" }).then( function(json){ for(var i in json){ $("ul").append( "<a href='" + json[i].link + "'>" + json[i].title.rendered + "</a>" ); if(i >= 数値を指定){ //指定した数値以降にループを抜ける処理 break; } } }, functi

WP REST APIを利用すると、PHP以外の言語でWordPressのデータが扱えるようになり、とても便利ですよね。（ちなみにREST APIの”REST“は”REpresentational State Transfer”の略。画像のような休憩のRESTじゃないです…） 大体のモダンな言語ではHTTPの送信とJSONデータが扱えるのではないかと思います。（知らんけど） 予め用意されている基本のJSONデータ 投稿データを取得 最新の投稿10件を取得されます。 http://example.com/wp-json/wp/v2/posts ちなみに当サイトのデータ https://illustswitch.com/wp-json/wp/v2/posts データが見辛いわっ！…という場合 Chromeを使用されている場合は”JSON Viewer“というアドオンがおススメです。綺麗に整形し

WordPressサイトで、記事系コンテンツの詳細ページから一覧ページへ戻るボタンのリンク先は、直前のページ送りやカテゴリー選択が維持されたページにしたり、フロントページや外部サイトからのアクセスの場合には一覧のトップへ戻るというように、リンク先を変える実装をしたい時があります。 今回は下図のようなケースで考えてみました。 アーカイブページのトップへ戻るアーカイブページのトップへ戻るアーカイブページのトップへ戻るnページ目のアーカイブページに戻るカテゴリーアーカイブに戻るこの場合の戻るボタンのソースコードが以下になります。 <?php //リファラを取得 $referer = wp_get_referer(); //リファラのURLから記事IDを取得 $referer_post_id = url_to_postid($referer); //条件によって、戻り先のリンクを変更する if($

WordPressのサイト内検索は記事のどこを探しているのか？ 以前、WordPressのサイト内検索では濁音や半濁音といった日本語の細かい違いの区別が付いていないことと、その解決方法を解説した。 このとき、「Query Monitor」というプラグインを使用してWordPressがサイト内をどのように調べているのか、つまり検索に使われているクエリを閲覧する方法を紹介した。 その方法を使って、もう一度検索結果ページ上で動いているWordPressの検索クエリを覗いてみよう。 上の画像の赤枠で囲った部分が、投稿された記事のどの場所から検索ワードを拾っているのかを表記している部分となる。 「wp_posts.post_title」 記事タイトルを捜索している部分。 「wp_posts.post_excerpt」 抜粋オプションを捜索している部分。こちらはあまり関係ない。 「wp_posts.p

COVID-19によってWordCamp Asia 2020が中止された頃は「ちょっと大げさだったんじゃないの？」と思ったものだが、まさかWHOによってパンデミックと宣言されるまでになるとは思いもよらず、自宅勤務を余儀なくされる毎日である。 さて、今回は「アイキャッチ画像の設定パネルに説明文を追加する」という非常によくありそうなTipsを紹介する。 WordPressに慣れ親しんでいると忘れがちだが、「アイキャッチ画像」というのはあまり一般的な用語ではない。「外連味けれんみのない記事」というぐらい一般的ではない。また、テーマ次第では必ずしも投稿のシングルページに表示されるとは限らないので、次のような要望はよく上がるだろう。 「アイキャッチ画像」を「ヘッダー画像」や「カバー画像」に変えたい。どこに表示されるかについての説明文を追加したい（例・この画像は記事一覧ページと個別記事ページに表示され

複合検索（絞り込み検索）の実装後編ではループ表示とページング機能を作るとともに、JavaScriptとAjax（jQuery）を使用してより使いやすい複合検索（絞り込み検索）フォームにしてみたいと思います。ワードプレスではAjax用のリクエストルートも用意されていますので確認していきます。 2019年3月5日 検索結果のループ表示と固定ページでのページング 検索結果を標準ループで表示 前回『複合検索（絞り込み検索）をPHPとJavaScriptで実装（前編）』までの内容でWP_Queryに与える引数$argsができましたので、あとはループを回すだけになります。記述は以下のようになります。 <?php $the_query = new WP_Query($args); ?> <ul> <?php if ($the_query->have_posts()) : ?> <?php while (

複合検索（絞り込み検索）と言いますと「エリアで探す」「間取りで探す」「家賃で探す」などの不動産物件情報サイトが思い浮かびます。もちろんワードプレスでもこうした機能は可能です。基本的な機能だけならPHPだけで可能ですがJavaScriptも併用すればより使いやすい検索機能になります。 2019年3月7日 複合検索（絞り込み検索）の完成イメージ Indeed（インディード）やGoogle for Jobsのような無料の求人サービスが出てきたことで、自社ホームページ内に求人情報を掲載する企業が増えてきています。特に恒常的に人材不足である飲食業などは、そうしたサービスを活用することで採用コストがある程度下げられると考えられています。 こうした背景もあって、ワードプレスでホームページを作りつつそのなかに求人コンテンツを作成するわけですが（ホームページ全体をワードプレスで作り直すか、既にワードプレスで

WordPressのバージョンが5.3になりPHP7.4に対応しました。また、PHPの最小バージョンも上がり（5.6.20）、WordPressのPHP動作環境が変わっています。 WordPress公式ガイドの全内容を和訳して解説します。