COOSY BLOG
  • HOMEホーム

  • SERVICEサービス

    • サービスTOP
    • Web制作
    • ブランディング
    • デジタルマーケティング
    • 戦略企画
    • DX推進・システム開発
    • グローバル展開
  • WORK制作実績

    • 制作実績TOP
    • コーポレートサイト
    • 採用サイト
    • ECサイト
    • プロモーション
    • サービスサイト・SaaS
    • システム開発
  • ABOUTクーシーについて

    • クーシーについて
    • 会社情報
    • 私たちが大切にしていくこと
    • お知らせ
    • クーシーラボ岩手
    • ロンドン支社
    • ミャンマー支店
  • BLOGブログ

  • RECRUITリクルート

  • Contactお問い合わせ

BLOG MENU

  • BLOGトップ
  • 目的別

    • 目的別TOP
    • コーポレートサイト
    • ECサイト
    • オウンドメディア
    • 採用サイト
    • プロモーション
    • Webサービス
    • LP
    • ブランディング・CI
  • Web制作ハウツー

    • Web制作ハウツーTOP
    • UIUX・サイト設計
    • WebデザインTips
    • PM/ディレクション
    • フロントエンド(HTML/CSS)
    • 撮影・動画編集
    • ライティング
    • CMS
    • Web制作ツール
    • イラスト
  • システム開発

    • システム開発TOP
    • プログラミング
    • EC構築
    • CMS開発・構築
    • サーバ構築
    • データベース構築
    • セキュリティー
  • Webサイト運用のコツ

    • Webサイト運用のコツTOP
    • サイト運用・管理・保守
    • コンテンツ運用
    • CRM(顧客管理)
  • Webマーケティング

    • WebマーケティングTOP
    • SEO対策・トレンド
    • コンテンツ制作・SEOライティング
    • アクセス解析
    • Web広告
    • Web集客ハウツー
  • 特集

    • 特集TOP
    • Web最新トレンド
    • カルチャー
    • ガジェット

Share on

  • Xでシェアする
  • Facebookでシェアする
  • このエントリーをはてなブックマークに追加

WordPressでよく使用するアクションフックとフィルターフックの実例3選

  • Web制作ハウツー
  • システム開発
  • CMS
  • CMS開発・構築
WordPressでよく使用するアクションフックとフィルターフックの実例3選

ブログを作る、コーポレートサイトを作る、様々なWebコンテンツを作る際に利用されているWordPressですが、開発中に
「投稿が更新された時にこの処理をしたい」
「自動で出ているこの表示をカスタマイズしたい」
「デフォルトだとこの挙動だけど、ページの種類や個別毎に挙動を変えたい」
などとデフォルトの挙動をカスタマイズしたい箇所が出てきます。

以下のように実現するだけならばできます。

  • もちろん投稿が更新された時に処理をしたければcronでMySQLを監視して投稿テーブルが増えたら処理をするPHPを書く
  • 表示をカスタマイズしたければそのページ上で
    JavaScriptを使用して表示を変える
  • ページごとに挙動を変えたければページのテンプレートにPHPで処理を書く

しかし、開発者はCMSやフレームワークの想定されている処理以外はできれば使いたくないし、JavaScriptで無理やり表示を変えたら他への影響が怖いし、ページごとの処理はまとめておきたいものです。もちろん仕様と工数と期限の範囲内で。

そこで、WordPressにはアクションフックとフィルターフックというWordPress内の処理にフックした処理やデフォルトの挙動に処理を追加できる機能があります。

今回は、まずアクションフックとフィルターフックの基本的な使い方。次に、WordPress開発で経験してきたアクション・フィルターの使用例を実際のケースと共にご紹介いたします。
なお、この記事はWordPressのカスタマイズに関して、ある程度理解している方向けへの内容となります。ご了承ください。

アクションフック、フィルターフックの使い方

まず両者の基本的な使い方を見てみましょう。
記述するソースは使用しているテーマフォルダのfunctions.phpですが、私はよく実処理をfunctions というディレクトリを作って、その中でファイルごとに処理を記述し、functions.phpにはinclude onceのみを記述しています。

処理ごとにフォルダを分ける

基本的に両者の書き方は同じです。
上記の例はフィルターフックですが、コレがアクションフックだと「add_filter」が「add_action」に変わります。

両者の違いとして、アクションフックはWordPressの特定のタイミングで独自の関数で何らかの処理を行う、フィルターフックはWordPressの処理の途中で出力する内容をカスタマイズするというものがありますが、明確な違いは「値(データ)を受け渡しするかどうか」です。

アクションフック

アクションフックは基本的に値を受け渡しません。前述したとおり、WordPressの特定のタイミングで独自の処理を登録するためのものなので、処理は完結しており値を返す必要がありません。

例として下記の処理を御覧ください。

head内にカスタム用のコードを追加する

こちらはwp_head関数が呼び出された時にscriptタグを出力する処理です。
wp_headアクションフックにadd_head_custom_tags関数を登録しています。

wp_head関数は基本的に全ページのheadタグを出力する時に呼ばれますので、これで全ページのheadタグの中に「<script src="/js/xxxx.js"></script>」が出力されることになります。「is_home()」や「is_page()」などの標準関数も呼ぶことができるのでTOPページはコレ!個別ページはコレ!など出し分けることも可能です。

add_action関数の第三引数(上記では99)は同一フックに複数の関数が登録された時に呼び出される優先順位を表します。省略時の初期値は10で、数が小さい方が先に呼ばれます。

フィルターフック

フィルターフックは値を受け渡します。WordPressの処理の途中で出力するためのものであるため、引数でデフォルトの出力内容が入ってきており、カスタマイズして返り値とします。

例として処理を見てみましょう。

末尾の文字列の設定

WordPressが長文を省略する時に出力される文字列(デフォルトでは「…」)を修正する処理です。
excerpt_moreフィルターフックにnew_excerpt_more関数を登録しています。

例では引数を使用していませんが、カスタマイズした値がreturnされています。これで長文を省略した際に該当の投稿ページへの「続きを読む」リンクが出力されます。

アクションフックと同じく第三引数に整数を入れれば同フック内の優先順位を定義できます。

実装例

では、実際に使われたアクションフック・フィルターフックを、それぞれのケースと共にご紹介します。なお、一部分は修正しているのでご了承ください。

【ケース1】一覧ページのソート順を更新が新しい順にしたい

一覧ページの表示順を投稿の更新順にしたいそうです。デフォルトでは投稿順ですからね。では処理を見てみましょう。

アーカイブページの投稿ソート順を更新日の降順に変更


こちらはアクションフックです。
投稿を取得するget_posts関数の処理の前に呼ばれる「pre_get_posts」フックに処理を登録しています。引数でget_postsに与えられた条件が$queryに入っているのでそれを変更してあげれば良いです。

こちらのフックは管理画面でも呼ばれますので
is_admin()で管理画面かどうか、メインのクエリではない場合には影響がないようにしています。

【ケース2】記事抜粋を50文字表示にしたい

今度はデフォルトの記事抜粋が長いそうです。ちなみにWordPressのデフォルトは110文字です。

抜粋する文字数を設定

こんなのもラクラク修正できます。それぞれ記事の抜粋が表示されるテンプレートで文字列を切り取ることもできますが大変です。

もちろん標準関数を使えばページ毎に文字数を変えることもできますよ。

抜粋する文字数をページ毎に設定

【ケース3】タクソノミーの登録情報でリライトルールを作りたい

「タクソノミーで登録されている都道府県でリライトルール作りたいな…でも47行リライトルールを書くのは嫌だし…」

確かに47行のリライトルールを書くのはエンジニアとしては嫌ですよね。正規表現で記述したとしても結局47単語書かなければいけません。何よりタクソノミーとして既に登録されているのですからそれを使わない手はないです。
まず、タクソノミーとして都道府県名を登録しておきます。この時スラッグにはURLに使う英数字を入れておきます。

都道府県名

そして下記の様なアクションフックを登録します。

リライトルールの追加

get_terms関数で登録したタクソノミーを取得し、スラッグを使って正規表現用の文字列を作成
(hokkaido|aomori|…)。そしてadd_rewrite_ruleでリライトルールに追加しています。

この例だと、「http://[ドメイン]/hokkaido/」にアクセスした時に「pref_postというスラッグの固定ページ」に「キー:pref、値:hokkaidoのクエリパラメータ」を渡す様になっています。固定ページの作り方やカスタムクエリパラメータの追加方法は本筋とは逸れますので割愛させていただきます。

ちなみにinitアクションフックは通常プラグインの初期化時に処理が実行されるアクションフックです。

今後ありえるかはわかりませんが、もし都道府県が増えた時にもタクソノミーを追加するだけで自動でリライトルールに適用してくれますね。

最後に

今回はWordPressのカスタマイズ時に使用したことのあるアクションフック・フィルターフックをご紹介させていただきました。

この他にもWordPressには沢山のフックが標準実装されています。今回は割愛させていただきますが、更に独自でフックを作ることも可能です。標準実装されているフックについては公式のWordPressCodexに詳しいのでぜひご参照ください。

参考

アクションフック一覧

参考

フィルターフック一覧

WordPressは非常にメジャーなCMSで携わることになる開発者も多いかと思います。この記事が「こんな仕様を実現できないか…」「どう実装すればいいかわからない…」などの開発者の一助になることを願います。

クーシーブログ編集部

この記事を書いた人

クーシーブログ編集部

1999年に設立したweb制作会社。「ラクスル」「SUUMO」「スタディサプリ」など様々なサービスの立ち上げを支援。10,000ページ以上の大規模サイトの制作・運用や、年間約600件以上のプロジェクトに従事。クーシーブログ編集部では、数々のプロジェクトを成功に導いたメンバーが、Web制作・Webサービスに関するノウハウやハウツーを発信中。

お問い合わせはこちらから

Web制作デザイン、丸ごとお任せ

お問い合わせする

2020/12/17

星

Share on

  • Xでシェアする
  • Facebookでシェアする
  • このエントリーをはてなブックマークに追加
お問い合わせはこちら

CMS・CMS開発・構築の関連記事はこちら

  • 【提案事例】薬局店舗ページの制作を60%効率化! スプレッドシート活用によるページ自動生成テクニック

    薬局の店舗ページ制作を60%効率化! WordPressサイトで、スプレッドシートとGASを活用しHTMLを自動生成した提案事例をご紹介。Webサイト運用のコスト削減や効率化のヒントが満載です。

    • CMS開発・構築
  • 【オフショア】WEB制作会社クーシーがオフショア開発で成功した理由。成功のカギは人材育成にあり!?

    オフショアという名称は何となく聞いた事がある人が多いと思いますが、実際に「オフショア開発」って何?と聞かれたら意外と説明できないですよね。クーシーでどのようなオフショア開発をしているのか、詳しくご紹介します。

    • CMS開発・構築
  • 【おすすめ11選】CMSは4つの種類から5つのポイントで選べ!

    本記事では読むだけでCMSを簡単に選べるように情報をまとめました。この記事を読めば候補になるCMSの見当がつくはずです。

    • CMS
    • CMS開発・構築
  • ECサイトはShopifyかWordPressか?6つのポイントで比較します

    ECサイトはShopifyとWordPressどちらを選ぶべきか6つのポイントで比較しました。おすすめのケースもあります。

    • ECサイト
    • CMS
  • 【WordPress】翻訳して多言語化する方法と注意点

    外国の方にもWebサイトを見てほしい場合、サイトの多言語化が必要です。この記事ではWordPressでの多言語対応の方法とプラグインについて解説。

    • フロントエンド(HTML/CSS)
    • CMS
  • 【入門】Dockerで環境構築|WordPress環境をローカルPCに作ろう!

    Dockerとは、アプリケーションの実行環境の構築だけでなく配布もできる便利なソフトウェアです。

    • CMS開発・構築
    • サーバ構築
  • ヘッドレスCMSとは?従来型CMSとの違いやメリットをわかりやすく解説

    ヘッドレスCMSとは「フロントエンドがないCMS」とよく言われます。でも、この説明だけではよくわかりませんよね?

    • CMS
    • CMS開発・構築
  • 【WordPressセキュリティ強化】必須の6つの対策を解説!

    この記事ではWordPressのセキュリティ対策の方法についてお伝えします。攻撃されたらどんな被害を被るのか、自社でできる対策、Web制作会社でしてもらえる対策がわかります。

    • CMS
    • セキュリティー

COOSYの
制作実績

UIUXと美しさを両立させた、クーシーが誇る成功事例一覧。
課題解決のアイデア満載です。

制作実績を見る

Web制作の課題はクーシーが解決します

  • CMS開発

    SEOに強いWordPress等のCMSを構築・改修。誰でも簡単に使え、効率的なコンテンツマーケティングを実現します。

  • DX推進・システム開発

  • Web制作

    コーポレートサイト、採用サイト、ECサイトまで。最新AI技術を掛け合わせ、各サイトの特性に合わせたUIUX設計を実現します。

CATEGORY LIST

  • すべての記事一覧

  • 目的別

    • 目的別TOP
    • コーポレートサイト
    • ECサイト
    • オウンドメディア
    • 採用サイト
    • プロモーション
    • Webサービス
    • LP
    • ブランディング・CI
  • Web制作ハウツー

    • Web制作ハウツーTOP
    • UIUX・サイト設計
    • WebデザインTips
    • PM/ディレクション
    • フロントエンド(HTML/CSS)
    • 撮影・動画編集
    • ライティング
    • CMS
    • Web制作ツール
    • イラスト
  • システム開発

    • システム開発TOP
    • プログラミング
    • EC構築
    • CMS開発・構築
    • サーバ構築
    • データベース構築
    • セキュリティー
  • Webサイト運用のコツ

    • Webサイト運用のコツTOP
    • サイト運用・管理・保守
    • コンテンツ運用
    • CRM(顧客管理)
  • Webマーケティング

    • WebマーケティングTOP
    • SEO対策・トレンド
    • コンテンツ制作・SEOライティング
    • アクセス解析
    • Web広告
    • Web集客ハウツー
  • 特集

    • 特集TOP
    • Web最新トレンド
    • カルチャー
    • ガジェット
  • WORKS

    Webサイト・アプリなどの
    様々な実例・制作実績のご紹介

    WORKS
  • CONTACT CONTACT

    Webサイトのご相談、お見積もりはこちらから

    Webサイトのご相談、お見積もりなど
    お気軽にお問い合わせください

ホーム

  • TOP
  • COOSY BLOG
  • WordPressでよく使用するアクションフックとフィルターフックの実例3選
ページトップへ
  • TOP
  • SERVICE

    • ブランディング
    • デジタルマーケティング
    • 戦略企画
    • DX推進・システム開発
    • グローバル展開
    • Web制作
  • WORKS

    • コーポレートサイト
    • 採用サイト
    • ECサイト
    • プロモーションサイト
    • サービスサイト
    • システム開発
  • ABOUT

    • 会社情報
    • 私たちが大切にしていくこと
    • お知らせ
    • クーシーラボ 岩手
    • ロンドン支社
    • ミャンマー支店
  • RECRUIT

    • ディレクション部
    • デザイン部
    • システム開発部
    • アカウント・プランニング部
    • Webマーケティング事業部
    • 人事・総務部
    • オフショア
    • グローバル事業部
  • BLOG

    • 目的別
    • Web制作ハウツー
    • システム開発
    • Webサイト運用のコツ
    • Webマーケティング
    • 特集

COOSY SNS

  • facebook
  • X
  • お問い合わせ
  • Privacy policy
  • Site Policy
  • Security Policy
© COOSY All Rights Reserved.