賢威7でカテゴリーページのタイトルをスタイル設定しても、固定ページのタイトルとはclass指定が違うため、当然ですがスタイルは別になります。

今回は固定ページのタイトルをカテゴリーページやタグページのタイトルと同じようにスタイルする方法をご紹介します。

CSSの修正

当サイトの場合は賢威の子テーマで運用しているので、子テーマディレクトリの「base.css」と「rwd.css」を修正しています。

「base.css」の修正

/*--------------------------------------------------------
カテゴリー、タグ、固定ページ
--------------------------------------------------------*/
h1.archive-title,
.type-page h1.section-title{
	background-color: #FFF;
	background: rgba(0, 0, 0, 0) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEElEQVQImWO4evXqfwZkAAA19AN/FhPClgAAAABJRU5ErkJggg==") repeat scroll 0 0;
	border-left-width: 4px;
	border-left-style: solid;
	border-left-color: #000;
	font-weight: bold;
	color: #333;
	text-shadow: 
		-1px -1px #fff,
		1px -1px #fff,
		-1px 1px #fff,
		1px 1px #fff;
	line-height: 1.25em !important;
	padding: 14px 18px;
}
.type-page h1.section-title{
	font-size: 1.75em !important;
	margin-bottom:30px !important;
}

賢威7では、「.archive-title」でカテゴリーとタグページのタイトルを制御しています。

.type-page h1.section-title」で固定ページのタイトルを制御しています。

「rwd.css」の修正

/*--------------------------------------------------------
解像度1200px以下
--------------------------------------------------------*/
@media
only screen and (max-width : 1200px){

/*--------------------------------------------------------
カテゴリー、タグ、固定ページ
--------------------------------------------------------*/
h1.archive-title{
	margin-left:12px !important;
	margin-right:12px !important;
}
.type-page h1.section-title{
	margin-top:-15px !important;
	margin-bottom:30px !important;
	margin-left:0px !important;
	margin-right:0px !important;
	padding: 14px 18px !important;
	font-size: 1.5em !important;
}

}

こちらはスマホ用のスタイルです。各種スタイルがPCと違うためスマホに最適化されるように調整しています。

/*--------------------------------------------------------
解像度1200px以下
--------------------------------------------------------*/
@media
only screen and (max-width : 1200px){

.section-title{
	padding-bottom:0px !important;
	margin-top:-30px !important;
}

}

なお、タイトル上下の空きが変わったため、こちらのスタイル調整もしています。

これで、カテゴリーとタグページのタイトル、固定ページのタイトルのスタイルが同じになります。