トップページのタイトルを非表示にする方法-賢威7のカスタマイズ

WordPressでトップページを固定ページにすると、固定ページのタイトルが表示されてしまいます。

仮にフロントページ用の固定ページの記事タイトルを「トップページ」とした場合、フロントページに「トップページ」と表示されます。

 

 

やはりフロントページは他のページとは異なり、記事タイトルは表示されないほうが見栄えがいいと思います。

そこで、トップページの記事タイトルを表示させないようにしました。

 

トップページの固定ページのタイトルを非表示にする

トップページに使用する固定ページの記事タイトルを非表示にするにはCSSと、PHPで指定する方法がありますが、今回はPHPをいじることにしました。

WordPress公式テーマのTwenty sixteenを例にすると、content-page.phpを子テーマを作って編集します。

 

<header class="entry-header">
		<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
	</header><!-- .entry-header -->

 

この部分で固定ページの記事タイトルを呼び出しているので条件分岐タグを使い、以下のように書き換えます。

 

<header class="entry-header">
	<?php if(is_front_page()) : ?>
        <?php else : ?>
           <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
	</header><!-- .entry-header -->

 

これでフロントページでは非表示で、他の固定ページには記事タイトルが表示されるようになります。

Twenty Seventeenではフロントページ用のPHPファイルがあるので、content-front-page.phpでタイトルを出力しているコードを削ります。

 

<header class="entry-header">
		<?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
		<?php twentyseventeen_edit_link( get_the_ID() ); ?>
		</header><!-- .entry-header -->

 

この部分から、

 

<?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>

 

この部分を消せばトップページから記事タイトルを消すことができます。

 

賢威7の場合

このブログは賢威7を使用していますが、賢威7の場合はpage.phpの子テーマを編集します。

 

	<header class="article-header">
<?php if (is_front_page()) { ?>
<h2 class="section-title"><?php echo esc_attr(get_the_title(get_the_ID())); ?></h2>
<?php } else { ?>
<h1 class="section-title"><?php h1_keni(); ?></h1>
<?php } ?>
			</header>

 

賢威7ではデフォルトで条件分岐タグを使い、フロントページではタイトルの見出しがh2。

それ以外の固定ページではh1で記事タイトルが表示されるように設定されています。

 

<h2 class="section-title"><?php echo esc_attr(get_the_title(get_the_ID())); ?></h2>

 

そこでフロントページで指定している上記コードを消せば、フロントページで固定ページの記事タイトルが表示されなくなります。

 

まとめ

サイトのトップページを固定ページで作る場合、表示がおかしくなるので記事タイトルは非表示にしたいと思います。

どのテーマでもだいたい同じような編集すればいいので難しくはないのですが、Twenty Seventeenでは予想外に苦戦しました。

この記事ではPHPでトップページの記事タイトルを非表示にする方法をかいていますが、CSSで非表示にする方法はこちらに書いています。

トップページのタイトルと日付をCSSで非表示に-Cooon(コクーン）テーマ

 

Twenty Seventeenで苦戦した理由

WordPressのテーマはダッシュボードの「テーマの編集」から編集することができます。

けれど、どのファイルを探しても「title」に関して指定しているコードが見当たりません。

「おかしい！」と思い、FTPソフトでTwenty Seventeenのテーマを見てみると、「template-parts」というフォルダを発見。

さらに「template-parts」フォルダの中に「pages」というフォルダ。

page＝固定ページなので「こいつやろ！！」と思いフォルダをみると、content-front-page.phpがありました。

ファイルを探すだけで約1時間。。。

まさかダッシュボードの「テーマ編集」に表示されないフェイントを食らうとは思いもしませんでした。（笑）

 

今日のたつじんへの一歩