Room #402

ぐーたらな主婦が日々の生活をゆるく綴るウェブログ。

備忘録。

f:id:room_402:20171125204247j:plain
自分のブログで実験してみたことを備忘録として記事にしてみます。

 

 他の方のブログで、記事のタイトルやコメント欄の文字の色を変えることができたらいいな
と、書いていらっしゃったのを拝見しました。
スクリーンショットは私のブログですが、ちょっと実験してみました。

f:id:room_402:20171125204955j:plain
↑この「大根づくし」というタイトル(センスないタイトルで失礼)の部分の文字色は黒色(カラーコード#000000)です。

 

f:id:room_402:20171125205157j:plain
↑タイトル「大根づくし」の文字色をCSSで赤色(カラーコード#ff0000)に変更しました。

 

CSSのコードはこちらです。

/* 記事のタイトル部分の文字色を変える */
h1.entry-title a{
    color:#ff0000;
}

 

カラーコードの#ff0000の部分をお好きな色番号に変えてください。

 

【ダッシュボード】【デザイン】【カスタマイズ】【デザインCSS】と進んでコードを貼り付けます。

f:id:room_402:20171125210609j:plain

 

f:id:room_402:20171125210631j:plain

 

f:id:room_402:20171125210659j:plain

【変更を保存する】ボタンを押して完了してくださいね。

 

 

 

特定の記事のみ記事タイトルの文字色を変えたい場合(個別の記事ページのみ)は下記の方法で出来ました。
貼り付けするコードはこちらです。

<style type="text/css"><!--.page-entry h1.entry-title a{color:#ff0000;}--></style>

※コードの入力漏れがあったので修正しました・・・。申し訳ありません(|||゚Д゚)

 

 

【見たままモード】で記事を書いて、【HTML編集】にタブを切り替えて貼り付けします。

f:id:room_402:20171125212758j:plain
【ダッシュボード】【設定】【基本設定】で編集モードは変更できます。

 

f:id:room_402:20171126020834j:plain


【HTML編集】のタブに切り替えてコードを貼りつけてください。
記事の最初の部分でも末尾の部分でも、この枠内にコードを書いていれば反映されます。

試しに今書いているこの記事ページのみに適用してみています。
薄紅梅(カラーコード#e597b2という色にしています。和な色です(*´∇`*)

 

 

 

コメント欄の文面の文字色も変更が出来ました。
【デザインCSS】に貼るCSSのコードはこちらです。

/* コメントの文面の文字色を変える */
.comment-content p{
    color:#ff0000;
}

 

 

 

 

特定の記事のコメント欄の文面のみ文字色を変えたい場合(個別の記事ページのみ)【見たままモード】で記事を書き、
【HTML編集】の枠の中に下記のコードを張り付けて記事を書いてください。

<style type="text/css"><!--.page-entry .comment-content p{color:#ff0000;}--></style>

 ※コードの入力漏れがあったので修正しました・・・。申し訳ありません(|||゚Д゚)

 

 

カラーコードの#ff0000の部分をお好きな色番号に変えてください。
この記事ページのみ、コメント欄の文面の色が変わっている・・・はず、だと思う( ^ω^)

 

コメント欄の文面、自分と自分以外の方と色分けできたら楽しいのだけど
CSSでは難しそうです・・・。_| ̄|○
何せ素人に毛が生えただけくらいの知識しかないもので・・・。あくまで個人的な備忘録とさせてください。


上記の内容はこのブログで試してみてはいますが、お使いのブログスキンによっては
スマホ版に反映されないかもしれません。レスポンシブ対応のものなら大丈夫かとは思いますが・・・
上手くいかなかったらごめんなさい。間違い等ございましたらご指南頂けると嬉しいです。

 

 

 

でも、この記事がほんの少しでもどこかで誰かのお役に立てればいいな、と思います( ; ゚Д゚)