cocoonフック調査~singular_eye_catch_after、singular_entry_content_before、singular_entry_content_afterの使い方と活用例

cocoonフック調査~singular_eye_catch_after
タナビーの高梨です。
WordPressのテーマ「cocoon」では、豊富なアクションフックとフィルターフックが提供されています。
分かる範囲で内容を調査したのでブログにまとめていこうと思います。
今回は投稿ページのキャッチ画像の直後に発火するアクションフック
singular_eye_catch_after
と
本文前後に発火するアクションフック
singular_entry_content_before、singular_entry_content_after
です。
フックの概要
フック名 | 発火タイミング |
---|---|
singular_eye_catch_after | アイキャッチ画像の直後 |
singular_entry_content_before | 本文ブロックの直前(<div class=”entry-content”> の前) |
singular_entry_content_after | 本文ブロックの直後(</div> の後) |
使いどころ
singular_eye_catch_afterはアイキャッチの直後に発火します。
この位置です。
ここに表示させたいって何でしょう。
あまり思いつきません。

singular_entry_content_beforeとsingular_entry_content_afterは本文の前後に発火します。
beforeは<head>の直後、afterは<footer>のちょっと前の微妙な箇所です。
この位置です。

do_action呼び出し元のソースコード
/tmp/content.php
<?php //アイキャッチ挿入
cocoon_template_part('tmp/eye-catch');
do_action('singular_eye_catch_after');
?>
</header>
<?php //投稿・固定ページ本文前のアクションフック
do_action('singular_entry_content_before'); ?>
<div class="entry-content cf<?php echo get_additional_entry_content_classes(); ?>" itemprop="mainEntityOfPage">
~~省略
<?php ////投稿・固定ページ本文後のアクションフック
do_action('singular_entry_content_after'); ?>
<?php //マルチページ用のページャーリンク
cocoon_template_part('tmp/pager-page-links'); ?>
<footer class="article-footer entry-footer">
引数
なし
カスタマイズコード例
上記画像での出力例です。
function customize_singular_eye_catch_after() {
echo '<div style="background:red;color:white">singular_eye_catch_afterはここに表示できる</div>';
}
add_action('singular_eye_catch_after', 'customize_singular_eye_catch_after' );
function customize_singular_entry_content_before() {
echo '<div style="background:red;color:white">singular_entry_content_beforeはここに表示できる</div>';
}
add_action('singular_entry_content_before', 'customize_singular_entry_content_before' );
function customize_singular_entry_content_after() {
echo '<div style="background:red;color:white">singular_entry_content_afterはここに表示できる</div>';
}
add_action('singular_entry_content_after', 'customize_singular_entry_content_after' );
まとめ
singular_eye_catch_after・singular_entry_content_before・singular_entry_content_after は、Cocoonテーマで投稿/固定ページを柔軟にカスタマイズするのに役立つフックです。
表示タイミングが明確でわかりやすいため、「目立たせたい情報を自然に挿入する」場面で重宝しそうです。
テーマファイルを直接編集せずに、バナーや案内、CTAなどを設置したい方は、ぜひ活用してみてください。