こんにちは、情報系大学生のハル(Blog_IT_haru)です。
今回は、コメント欄を大きく表示させる方法について解説します。
本当は上の方に表示させたりするのもやりたかったんですけど、なかなかうまく行きませんでした・・・。

やり方
参考にしたサイトにあるコードを、デザイン→カスタマイズ→デザインCSSに貼り付けるだけです!
※Font awesomeを導入していない人は導入しましょう。
設定→詳細設定→headに要素を追加に追加しても良いですし、
デザイン→タイトル下に追加しても大丈夫です。
<link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
私は、わかりやすく、コメントアウトでコメント欄を大きくする、と入れています。
また、枠の色を、私のブログのイメージカラーに変更し、マウスオーバー時も同様にし、文字の色を黒のままにするようにしました。
/***コメント欄を大きくする***/
.leave-comment-title {
display:inline-block;
width:100%;
text-align:center;
padding:1em 0;
border:thin solid #e0edff;//枠の色
border-radius:3px;
transition: 0.3s ;
font-size:16px;
}
.leave-comment-title:before {
font-family: "FontAwesome";
content: "\f0e5";
padding-right:0.2em;
}
.leave-comment-title:hover {
color:#000;//マウスオーバー時の文字色
background-color:#e0edff;//マウスオーバー時の色
}
参考にしたサイト
まとめ
いかがでしたか?
今回は、「コメントを書く」を大きく表示させる方法について解説しました。
コメントを書く、をもう少し上に表示させるのと同時に行いたかったのですが、ちょっと上手く行かず、断念してしまいました笑
この記事がいいな、と思ってくれたら、SNSなどで拡散したり、
ブックマークやコメントなどしてくれると励みになります!
下の方とサイドバーにある、サポートもお待ちしています!
更に、読者になってくれたら、お返しに私も読者になります!
また、この記事の内容についてなにかありましたら、
お問い合わせ、コメント、TwitterのDMなどによろしくお願いします。
それでは。



