この記事には広告を含む場合があります。
記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。
ビジネスサイトのトップページのヘッダー直下の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;
}
32ARTS