【THE THOR】見出しのアーカイブ内記事タイトル ホバー時のカスタマイズ

WordPressテーマ THE THOR

別ブログのZMASAa.blogは、WordPressテーマ THE THOR（ザ・トール）を使って構築しています。

ZMASAa.blog│ガジェット好きのmasaaが情報発信する2nd WordPressブログサイト

wp.masaa.net

これまでのWordPressテーマ THE THOR（ザ・トール）のカスタマイズや設定によって、「見出しのアーカイブ内記事タイトル ホバー時」表示が納得できなくなりました。

そこで、WordPressテーマ THE THOR（ザ・トール）の「見出しのアーカイブ内記事タイトル ホバー時」表示に関するカスタマイズについてまとめてみました。

WordPressテーマ THE THOR 見出しのアーカイブ内記事タイトル ホバー時

通常のホバーされていない「見出しのアーカイブ内記事タイトル」は、このように問題無く表示されています。

次に「見出しのアーカイブ内記事タイトル ホバー時」の場合、文字色とフォント太さが変わってしまいます。

見出しのアーカイブ内記事タイトル ホバー時のカスタマイズ

「見出しのアーカイブ内記事タイトル ホバー時」の文字色、フォント太さについてカスタマイズを行います。

カスタマイズ内容

「見出しのアーカイブ内記事タイトル ホバー時」のカスタマイズは、下記の通りです。

このカスタマイズ内容を「スタイルシート(style-user.css)」に追記します。

/************************************
** ■見出し：アーカイブ内の記事タイトル設定
************************************/
.heading.heading-secondary a:hover{
	font-weight:bold; /*フォント太さ*/
	color: #C03; /*文字色*/
}

カスタマイズ後の見出しのアーカイブ内記事タイトル ホバー時

今回のカスタマイズによって、WordPressテーマ THE THOR（ザ・トール）の「見出しのアーカイブ内記事タイトル ホバー時」は次の様に表示されるようになりました。

最後に

「見出しのアーカイブ内記事タイトル ホバー時」のフォントサイズは、ホバーされていないときの「見出しのアーカイブ内記事タイトル」と同じにしたことで、ホバーしても違和感がなくなりました。

また、カスタマイズ前はホバーすると文字色が濃い文字から薄い文字になっていたのですが、今回文字色を濃いくしたことで、ホバーされていないときの「見出しのアーカイブ内記事タイトル」の黒色と比べても違和感がなくなりました。

アンダーラインは消しても良かったのですが、今回そのままアンダーラインを表示させています。