トップページのh1タイトルを削除する方法(ビジネスサイト編)

この記事には広告を含む場合があります。

記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。

ビジネスサイトのトップページのヘッダー直下のh1のタイトルを消す(非表示にする)方法
content.php を以下のように挿入&編集します。

【 変更前 】

		<header class="entry-header">
			<?php the_post_thumbnail(); ?>
			<?php if ( is_single() ) : ?>
			<h1 class="entry-title"><?php the_title(); ?></h1>
			<?php else : ?>
			<h1 class="entry-title">
				<a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a>
			</h1>
			<?php endif; // is_single() ?>

【 変更後 】

		<header class="entry-header">
			<?php the_post_thumbnail(); ?>
			<?php if ( is_front_page() ) : ?>
			<?php elseif ( is_single() ) : ?>
			<h1 class="entry-title"><?php the_title(); ?></h1>
			<?php else : ?>
			<h1 class="entry-title">
				<a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a>
			</h1>
			<?php endif; // is_single() ?>

以上で表示はされなくなります。

ヘッダー部の空白が広くて気になる方はこちらを変更!

スタイルシート(style.css)

【 メニュー直下の空白を縮小 】

/* Page structure */
531 532 行あたり

.site-content {
	margin: 6px 0 0;/*24px 0 0;*/
	margin: 0.4285714285rem 0 0;/*1.714285714rem 0 0*/
}


/* =Main content and comment content
685 686 行あたり

.entry-header {
	margin-bottom: 6px;/*24px*/
	margin-bottom: 0.4285714285rem;/*1.714285714rem*/
}


【 ヘッダー上下部の空白を縮小 】

/* Header */
541 542 行あたり

.site-header {
	padding: 6px 0;/*zono 24px 0*/
	padding: 0.4285714285rem 0;/*zono 1.714285714rem 0*/
}


【 ヘッダー上部(画像上)の空白を縮小 】

573 574 

.header-image {
	margin-top: 6px;/*zono 24px*/
	margin-top: 0.4285714285rem;/*zono 1.714285714rem*/
}

/* Navigation Menu */
579 580

.main-navigation {
	margin-top: 6px;/*zono 24px*/
	margin-top: 0.4285714285rem;/*zono 1.714285714rem*/
	text-align: center;
}