目次
  1. フックの概要と仕組み
    1. アクションフックでできること
      1. カスタマイズ例（１） ハンバーガーメニュー［左サイド］内に文字を出力
      2. カスタマイズ例（２） Emanonパーツのショートコードを出力
  2. Emanon Premiumのフック一覧
    1. ヘッダーの外側
    2. ヘッダーの内側
    3. ヘッダーロゴの左右
    4. 【固定ページ】コンテンツの上下
    5. 【投稿ページ】コンテンツの上下
    6. カスタム投稿［求人情報］ページコンテンツの上下
    7. カスタム投稿［ニュース］ページコンテンツの上下
    8. カスタム投稿［商品紹介］ページコンテンツの上下
    9. カスタム投稿［資料請求］ページコンテンツの上下
    10. カスタム投稿［セミナー］ページコンテンツの上下
    11. 404ページコンテンツの上下
    12. 検索結果ページコンテンツの上下
    13. フッターの外側
    14. フッターの内側
    15. サイドバーの内側
    16. サイドバー左の内側
    17. カスタム投稿［求人情報］サイドバーの内側
    18. カスタム投稿［ニュース］サイドバーの内側
    19. カスタム投稿［商品紹介］サイドバーの内側
    20. カスタム投稿［資料請求］サイドバーの内側
    21. カスタム投稿［セミナー］サイドバーの内側
    22. ドロワーメニューの内側
    23. ハンバーガーメニュー［左サイド］
    24. ハンバーガーメニュー［左サイド］の内側
    25. ハンバーガーメニュー［左サイド］のSNS内側
    26. 全幅［オーバーレイ］ 投稿ページ・固定ページ
    27. 全幅［オーバーレイ］ アーカイブページ
    28. 全幅［オーバーレイ］セミナー アーカイブページ
    29. 全幅［オーバーレイ］資料請求 アーカイブページ
    30. 全幅［オーバーレイ］求人情報 アーカイブページ
    31. 全幅［オーバーレイ］ニュースアーカイブページ
    32. 全幅［オーバーレイ］商品紹介アーカイブページ
    33. 全幅［オーバーレイ］求人情報 タームページ
    34. 全幅［オーバーレイ］ニュース タームページ
    35. 全幅［オーバーレイ］商品紹介 タームページ
    36. 全幅［オーバーレイ］資料請求 タームページ
    37. 全幅［オーバーレイ］セミナー タームページ
    38. フィルターフック

フックの概要と仕組み

WordPressがページの表示や内部的な処理を行う際に任意の処理（関数）を挿入できる仕組みをフックといいます。フックにはアクションフックとフィルターフックの2種類があります。

アクションフック処理追加を実行。特定のタイミングで独自の処理を行うフックです。
フィルターフックデータ加工を実行。WordPress が出力するテキストを変更するフックです。

アクションフックでできること

アクションフックを使うことで、Emanon Premiumのテーマファイル1を改変せずに任意のHTMLを追加できます。具体的には、Emanon Premiumのテーマファイル内にdo_action( 'emanon_xxx' );2 という記述がある箇所にHTMLを自由の追加できます。

  1. WordPressインストール先にあるwp-content＞themes＞emanon-premiumフォルダ ↩︎
  2. 例 do_action( 'emanon_before_header' )やdo_action( 'emanon_after_header' )など ↩︎

カスタマイズ例（１） ハンバーガーメニュー［左サイド］内に文字を出力

アクションフックを使ったカスタマイズ例
表示例

下記のカスタマイズが完了すると上記ように、ハンバーガーメニュー［左サイド］内にWordPress Theme Emanonの文字が縦書きで表示されます。

01
子テーマのfunctions.phpに追記

子テーマemanon-premium-childのfunctions.phpに次のコードを書き込むと、ハンバーガーメニュー［左サイド］にWordPress Theme Emanonの文字が出力されます。

/**
 * ハンバーガーメニュー［左サイド］
 */
function fixed_sidebar_menu_description() {
	?>
	<li class="fixed-sidebar-menu-description">WordPress Theme Emanon</li>
	<?php
}

add_action( 'emanon_fixed_sidebar_menu_sns', 'fixed_sidebar_menu_description' );
02
外環＞カスタマイズ＞追加CSSにCSSを追記

外環＞カスタマイズ＞追加CSSに、次のCSSを反映させて文字を縦書きにします。

.fixed-sidebar-menu-description {
    writing-mode: vertical-rl;
    margin-bottom: 32px;
    color: #93b5cd;
}

カスタマイズ例（２） Emanonパーツのショートコードを出力

表示例

プラグインEmanon Premium Blocksを有効化するとEmanonパーツが使えます。下記は、Emanon パーツで作成したブロックのショートコードを出力するカスタマイズ手順です。固定ページのアイキャッチ全幅［オーバーレイ］にテキストとボタンを２つ表示します。

01
Emanonパーツの作成

プラグインEmanon Premium Blocksを有効化し、Emanonパーツを作成します。下記の例では、スペーサーブロック＞段落ブロック＞スペーサーブロック＞ボタン：複数［Emanon］の順番で配置しています。

Emanonパーツの作成が終わりましたらショートコード（例

)をコピーし、アクションフックのコードに貼り付けます。

02
子テーマのfunctions.phpに追記

子テーマemanon-premium-childのfunctions.phpに次のコードを書き込むと、固定ページ全幅［オーバーレイ］にショートコード（例

)が出力されます。

/**
 * 固定ページ 全幅［オーバーレイ］にショートコードを出力
 */
function header_full_width_overy_inner() {
    // 固定ページの場合のみ出力
    if ( is_page() ) {
        ?>
        <div class="l-content">
            <?php
            echo do_shortcode('
');
            ?>
        </div>
        <?php
    }
}
add_action('emanon_after_article_header_full_width_overy_inner', 'header_full_width_overy_inner');

特定の固定ページだけショートコードを出力したい場合、if ( is_page() )に固定ページのIDを入力してください。例えば、固定ページIDが2場合、if ( is_page('2') )となります。

固定ページIDの調べ方
  • WordPress管理画面の固定ページ一覧ページを開きます。
  • 調べたい固定ページタイトルにマウスカーソルをあてます。
  • 画面下部にURLが表示される→「post=」の後の数字が、固定ページIDです。
　この場合、固定ページIDは 2 です。

子テーマemanon-premium-childのfunctions.phpに次のコードを書き込むと、固定ページID2の場合だけ、ショートコードが出力されます。

/**
 * 固定ページ 全幅［オーバーレイ］にショートコードを出力
 */
function header_full_width_overy_inner() {
    // 固定ページID2の場合のみ出力
    if ( is_page('2') ) {
        ?>
        <div class="l-content">
            <?php
            echo do_shortcode('
');
            ?>
        </div>
        <?php
    }
}
add_action('emanon_after_article_header_full_width_overy_inner', 'header_full_width_overy_inner');

Emanon Premiumのフック一覧

Emanon Premiumのテーマファイル内に配置されたdo_action( 'emanon_xxx' );の場所とフック名の一覧です。カスタマイズにご利用ください。

ヘッダーの外側

フック名説明
emanon_before_headerヘッダー要素外側の前で実行
emanon_after_headerヘッダー要素外側の後で実行

対象phpファイル

header.php

ヘッダーの内側

フック名説明
emanon_before_header_innerヘッダー要素内側の前で実行
emanon_after_header_innerヘッダー要素内側の後で実行

対象phpファイル

template-parts/layout/header/header_center_top_menu.php
template-parts/layout/header/header_center.php
template-parts/layout/header/header_default_menu_right.php
template-parts/layout/header/header_default.php
template-parts/layout/header/header_row.php

ヘッダーロゴの左右

フック名説明
emanon_before_header_site_brandingロゴ要素の左側で実行
emanon_after_header_site_brandingロゴ要素の右側で実行

対象phpファイル

template-parts/layout/header/header_center_top_menu.php
template-parts/layout/header/header_center.php
template-parts/layout/header/header_default_menu_right.php
template-parts/layout/header/header_default.php
template-parts/layout/header/header_row.php

【固定ページ】コンテンツの上下

フック名説明
emanon_before_page_content_innerコンテンツ要素の上
emanon_after_page_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/page/page-layout.php

【投稿ページ】コンテンツの上下

フック名説明
emanon_before_post_content_innerコンテンツ要素の上
emanon_after_post_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-layout.php

カスタム投稿［求人情報］ページコンテンツの上下

フック名説明
emanon_before_job_content_innerコンテンツ要素の上
emanon_after_job_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-job-layout.php

カスタム投稿［ニュース］ページコンテンツの上下

フック名説明
emanon_before_news_content_innerコンテンツ要素の上
emanon_after_news_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-news-layout

カスタム投稿［商品紹介］ページコンテンツの上下

フック名説明
emanon_before_product_content_innerコンテンツ要素の上
emanon_after_product_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-product-layout.php

カスタム投稿［資料請求］ページコンテンツの上下

フック名説明
emanon_before_request_content_innerコンテンツ要素の上
emanon_after_request_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-request-layout.php

カスタム投稿［セミナー］ページコンテンツの上下

フック名説明
emanon_before_seminar_content_innerコンテンツ要素の上
emanon_after_seminar_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/post/post-seminar-layout.php

404ページコンテンツの上下

フック名説明
emanon_before_404_content_innerコンテンツ要素の上
emanon_after_404_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/404/404-layout.php

検索結果ページコンテンツの上下

フック名説明
emanon_before_search_content_innerコンテンツ要素の上
emanon_after_search_content_innerコンテンツ要素の下

対象phpファイル

template-parts/layout/search/search-layout.php

フッターの外側

フック名説明
emanon_before_footer<footer>タグの直上
emanon_after_footer</footer>タグの直下

対象phpファイル

footer.php

フッターの内側

フック名説明
emanon_before_footer_inner<footer>タグの直下
emanon_after_footer_inner</footer>タグの直上

対象phpファイル

footer.php

サイドバーの内側

フック名説明
emanon_before_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar.php

サイドバー左の内側

フック名説明
emanon_before_sidebar_left_inner<aside class="sidebar">タグの直下
emanon_after_sidebar_left_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sideba-left.php

カスタム投稿［求人情報］サイドバーの内側

フック名説明
emanon_before_job_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_job_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar-job.php

カスタム投稿［ニュース］サイドバーの内側

フック名説明
emanon_before_news_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_news_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar-news.php

カスタム投稿［商品紹介］サイドバーの内側

フック名説明
emanon_before_product_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_product_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar-product.php

カスタム投稿［資料請求］サイドバーの内側

フック名説明
emanon_before_request_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_request_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar-request.php

カスタム投稿［セミナー］サイドバーの内側

フック名説明
emanon_before_seminar_sidebar_inner<aside class="sidebar">タグの直下
emanon_after_seminar_sidebar_inner<aside class="sidebar">の閉じタグ</aside>の直上

対象phpファイル

sidebar-seminar.php

ドロワーメニューの内側

フック名説明
emanon_before_drawer_menu_inner<div class="drawer-menu">タグの直下
emanon_after_drawer_menu_inner<div class="drawer-menu">の閉じタグ</div>の直上

対象phpファイル

template-parts/parts/footer/drawer-menu.php

ハンバーガーメニュー［左サイド］

フック名説明
emanon_before_fixed_sidebar_menu<div class="js-hamburger-menu">タグの直下
emanon_after_fixed_sidebar_menu<div class="js-hamburger-menu">の閉じタグ</div>の直上

対象phpファイル

template-parts/parts/footer/fixed-sidebar-menu.php

ハンバーガーメニュー［左サイド］の内側

フック名説明
emanon_fixed_sidebar_menu_inner<div class="fixed-sidebar-menu__inner">タグ内の<button class="hamburger-menu"＞の直下

対象phpファイル

template-parts/parts/footer/fixed-sidebar-menu.php

ハンバーガーメニュー［左サイド］のSNS内側

フック名説明
emanon_fixed_sidebar_menu_sns<div class="fixed-sidebar-menu__inner">タグ内の<button class="fixed-sidebar-menu-sns"><ul>の直下

ulの子要素は、liしか使用できませんのでご注意ください。

対象phpファイル

template-parts/parts/footer/fixed-sidebar-menu.php

全幅［オーバーレイ］ 投稿ページ・固定ページ

フック名説明
emanon_before_article_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_article_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/singular/header-full-width-overlay.php

全幅［オーバーレイ］ アーカイブページ

フック名説明
emanon_before_archive_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/archive-header-full-width-overlay.php

全幅［オーバーレイ］セミナー アーカイブページ

フック名説明
emanon_before_archive_seminar_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_seminar_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/seminar/seminar-header-full-width-overlay.php

全幅［オーバーレイ］資料請求 アーカイブページ

フック名説明
emanon_before_archive_request_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_request_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/request/request-header-full-width-overlay.php

全幅［オーバーレイ］求人情報 アーカイブページ

フック名説明
emanon_before_archive_job_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_job_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/job/job-header-full-width-overlay.php

全幅［オーバーレイ］ニュースアーカイブページ

フック名説明
emanon_before_archive_news_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_news_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/news/news-header-full-width-overlay.php

全幅［オーバーレイ］商品紹介アーカイブページ

フック名説明
emanon_before_archive_product_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_archive_product_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/archive/product/product-header-full-width-overlay.php

全幅［オーバーレイ］求人情報 タームページ

フック名説明
emanon_before_term_job_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_term_job_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/taxonomy-term/job/job-term-header-full-width-overlay.php

全幅［オーバーレイ］ニュース タームページ

フック名説明
emanon_before_term_news_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_term_news_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/taxonomy-term/news/news-term-header-full-width-overlay.php

全幅［オーバーレイ］商品紹介 タームページ

フック名説明
emanon_before_term_product_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_term_product_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/taxonomy-term/product/product-term-header-full-width-overlay.php

全幅［オーバーレイ］資料請求 タームページ

フック名説明
emanon_before_term_request_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_term_request_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/taxonomy-term/request/request-term-header-full-width-overlay.php

全幅［オーバーレイ］セミナー タームページ

フック名説明
emanon_before_term_seminar_header_full_width_overy_inner<div class="article-header-full-width__inner">タグの直下
emanon_after_term_seminar_header_full_width_overy_inner<div class="article-header-full-width__inner">の閉じタグ</div>の直下

対象phpファイル

template-parts/parts/featured-image/taxonomy-term/seminar/seminar-term-header-full-width-overlay.php

フィルターフック

Emanon Premiumには、ヘッダーのサイト名・ロゴのURLを変更するフィルターフックが用意されています。子テーマemanon-premium-childのfunctions.phpに次のコードを書き込むことで、ヘッダーのサイト名・ロゴのURLが指定したURLに置き換わります。

/**
 * ヘッダーのサイト名・ロゴのURLを変更する
 */
 function stie_logo_link() {
   $link = '指定URL';
   return $link;
 }
 add_filter( 'emanon_stie_logo_link', 'stie_logo_link' );