こんにちは、情報系大学生のハル(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などによろしくお願いします。
それでは。