【お知らせ】このサイトではWordPressテーマ Cocoonを採用しています。THE THORのカスタマイズ状況についてはZMASAa.blogをご参照下さい。
WordPress関連THE THOR

【THE THOR】コメント送信ボタン ホバー時のカスタマイズ

アイキャッチ画像 THE THOR(ザ・トール)
この記事は約2分で読めます。
スポンサーリンク

WordPressテーマ THE THOR

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

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

WordPressテーマ THE THOR(ザ・トール)の「コメント送信ボタン ホバー時」に変化が有りません。

そこで、WordPressテーマ THE THOR(ザ・トール)の「コメント送信ボタン ホバー時」表示に関するカスタマイズについてまとめてみました。

WordPressテーマ THE THOR コメント送信ボタン ホバー時

ホバーされていない「コメント送信ボタン」は、このように表示されています。

【THE THOR】コメント送信ボタン ホバー時のカスタマイズ

次に「コメント送信ボタン ホバー時」の場合、特に変化はありません。

【THE THOR】コメント送信ボタン ホバー時のカスタマイズ

コメント送信ボタン ホバー時のカスタマイズ

「コメント送信ボタン ホバー時」の背景色についてカスタマイズを行います。

カスタマイズ内容

「コメント送信ボタン ホバー時」のカスタマイズは、下記の通りです。

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

/************************************
** ■コメント送信ボタンのホバー時カスタマイズ
************************************/
.comment-respond .submit:hover {
	opacity: 0.6; /*不透明度*/
	transition: all 0.8s ease; /*アニメーション*/
}

カスタマイズ後のSNSボタン ホバー時

今回のカスタマイズによって、WordPressテーマ THE THOR(ザ・トール)の「コメント送信ボタン ホバー時」は、次の様になりました。

【THE THOR】コメント送信ボタン ホバー時のカスタマイズ

最後に

今回のカスタマイズで「コメント送信ボタン ホバー時」の背景色を薄くして、滑らかに変化するようにしてみました。

これにより、ホバーされている状態かホバーされていない状態かの判断が分かりやすくなったと思います。

「コメント送信ボタン」は読者がコメントを書き込む際に押して貰うボタンなので、不安無く押して頂く環境を構築していきたいですね。

MASAa.netをご覧頂きありがとうございます!
もしMASAa.netの記事がお役に立てた場合、
下記【サポート】を頂くことで今後の記事制作に繋ぎます!

おすすめWordPressテーマ!
WordPressテーマ WING(AFFINGER6)
WordPressテーマ THE THOR(ザ・トール)
WordPressテーマ Diver

下記バナーからスマホゲームのインストールお願いします!
アルケミストガーデン
最強でんでん
れじぇくろ! ~レジェンド・クローバー~
イース6 オンライン〜ナピシュテムの匣〜
黒い砂漠 MOBILE
グランドサマナーズ
ロードモバイル
駅メモ!-ステーションメモリーズ!

オンラインくじ引き
オンラインくじ引き INAKUJI(いなくじ)INABA.TECH
MASAa.net

コメント