【Cocoon】スキン「メイドインヘブン」で関連記事や目次の設定を自由に変更する方法(作者様直伝!)

初心者のブログ設定
この記事は約4分で読めます。
記事内に広告が含まれています。

以前、このブログで「メイドインヘブン」の設定について記事を書いた際、2月のことですが、スキンの作成者様ご本人からお問い合わせフォームを通じて直接アドバイスをいただきました。

当時はすぐに設定ができなかったのですが、実際に試してみたところ、スキン側で固定されていた設定を驚くほど自由に操作できるようになりました。

前回の記事はこちら⇩

作者様の解説記事はこちらです

今回のカスタマイズのベースとなる考え方や詳細な仕組みについては、作者様のサイトで詳しく解説されています。

このサイトで紹介されているコードを、自分のサイトの「子テーマ」に追記することで、ロックされていた設定が再び操作できるようになります。

このカスタマイズで「できるようになること」

  • 関連記事の非表示化
    スキン側で固定されていた関連記事を消せます。
  • 目次の「開閉ボタン」を有効化
    長い目次を閉じたり、好みの状態で表示できます。
  • ページ送りナビの非表示化
    記事下の「前の記事」「次の記事」をスッキリ消せます。

作業前の「二重の保険」(バックアップ)

functions.php を編集するため、必ずバックアップを取りましょう。

  1. メモ帳へのバックアップ(必須)
    編集前のコードをすべてコピーして、パソコンのメモ帳に保存。
  2. ブラウザの「戻るボタン」(予備)
    エラー時に「戻る(←)」で戻れることがありますが、読み込みエラーで失敗することもあります。 必ず1のメモ帳保存を優先してください。

作者様のサイトでも、PHPの操作を誤るとサイトが表示されなくなるリスクがあります。試す際は必ずバックアップの上、自己責任でお願いいたします。と記載もありますので、ご注意ください。

私は一度経験していますが、本当に大変でした。

具体的な設定手順(作者様直伝コード)

作業はfunctions.phpstyle.cssの2箇所です。先ほどもお伝えしましたが、必ずバックアップを取ってから行いましょう。

① functions.phpへの追記

子テーマの functions.php の最後に、以下のコードを追記します。これで関連記事や目次の「開閉スイッチ」などのロックが外れます。

// スキンの管理用CSS制限を解除
add_action('admin_footer', function() {
    wp_dequeue_style('hvn-admin');
    wp_deregister_style('hvn-admin');
}, 9999);

// スキン制御の設定値を変更
add_action('init', function() {
    global $_THEME_OPTIONS;
    // 関連記事を非表示
    $_THEME_OPTIONS['related_entries_visible'] = 0;
    // 目次切り替えを有効
    $_THEME_OPTIONS['toc_toggle_switch_enable'] = 1;
    // ページ送りナビを非表示
    $_THEME_OPTIONS['post_navi_visible'] = 0;
});

② style.cssへの追記

次に子テーマの style.css に追加します。「目次のシンプルのデザインで閉じたときを考慮して罫線の定義を変更します」とのことです。

/* 目次のデザイン調整 */
.body .toc:has(.toc-checkbox) .toc-title {
    align-items: center;
    border: 0;
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.toc-checkbox:checked ~ .toc-content {
    border-top: 1px dotted var(--border-color);
    margin-top: var(--padding15);
    padding: var(--gap30) 0 0;
}

.toc-content {
    transition: unset;
}

まとめ

2月にいただいたアドバイスを、ようやく形にすることができました。素晴らしいスキンと、丁寧なサポートをくださった作者様に、改めてお礼申し上げます。


  あわせて読みたい

  最新の記事

タイトルとURLをコピーしました