OnePressのカスタマイズ－2. セクションの追加

WordPressのテーマ「OnePress」のトップページには、あらかじめ10個のセクションが用意されています。ここに、新たなセクションを追加してみます。

まず、OnePressの子テーマをインストールして有効化します。

次に、WordPressの管理画面から「外観」→「テーマエディター」→（子テーマの）「functions.php」を開きます。

コードの中に、「about」セクションの後に新たなセクションを追加するアクションフックが準備されているので、コメントアウトの「/*」「*/」（赤字部分）を削除して有効化します。

/*
function add_my_custom_section(){
?>
<section id=”my_section” class=”my_section section-padding onepage-section”>
<div class=”container”>
<div class=”section-title-area”>
<h5 class=”section-subtitle”> My section subtitle</h5>
<h2 class=”section-title”> My section title</h2>
</div>
<div class=”row”>
<!– Your section content here, you can use bootstrap 4 elements 🙂 –>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec odio. Quisque volutpat mattis eros. Nullam malesuada erat ut turpis. Suspendisse urna nibh, viverra non, semper suscipit, posuere a, pede.</p>

</div>
</div>
</section>
<?php
}
add_action( ‘onepress_after_section_about’, ‘add_my_custom_section’ );
*/

これを保存します。サイトにアクセスしてみると、「about」セクションの次に「My section title」というセクションが追加されているはずです。青字部分はあらかじめ用意されている記事内容ですので、この部分を自由に書き換えて好みの内容にすればOKです。

フック名「onepress_after_section_about」を「onepress_after_section_hero」に変えてやれば「hero」セクション（トップ画像）のすぐ下にセクションが追加されます。

上記コードを複製して、関数名「add_my_custom_section」を「add_my_custom_section_2」のようにしてやれば、複数のセクションについてセクション追加が可能になります。その場合、section id=”my_section_2”などとして、異なるセクションIDを付与しておくとよいのではないかと思います。