【WordPress(ワードプレス)】テーマhueman抜粋文字色カスタマイズする方法

このブログは、WordPress(以下ワードプレス)で運用していますが、デザインとしては無料テーマの「hueman」を利用しています。

おすすめされたので利用してますが、なかなかイイです。

 

そもそもワードプレスは、テンプレートのことを「テーマ」と呼ぶため、最初は馴染めませんでした(汗)
もう慣れましたけどね。

 

初期状態で使っても問題無い仕様ですけど、気になった点がいくつかありまして、トップペードの抜粋部分の文字色を濃くしたい問題が、やっと解決したのでシェアしたいと思います。

抜粋の文字色を濃くした結果

ブログ記事の抜粋、すなわち概要とか導入とか、その文章の文字色が初期状態だと薄いため、カスタマイズを実行して、このように変化しました。

hueman 抜粋 文字色 初期設定

↓↓↓ 抜粋の文字色が濃くした ↓↓↓

hueman 抜粋 文字色 カスタマイズ

抜粋の文字色を濃くするカスタマイズ方法

本題です。

結論から言えば、CSSを追加するだけです。
huemanの良いところは、ちょっとしたカスタマイズなら、CSSを追加するだけで実行できてしまうところです。

テーマエディターから直接、ソースをいじる必要が無いので、最悪、ワードプレスのデザインが壊れてしまうというリスクがありません。

 

では、抜粋部分の文字色を変更するやり方です。

  1. 【左サイドバー】 > 【外観】 > 【カスタマイズ】
    hueman カスタマイズ
  2. 【詳細設定】
    カスタマイズ 詳細設定
  3. 【追加CSS】
    カスタマイズ 追加CSS
  4. ソースコードを追加
    カスタマイズ ソースコード追加

以上です。

ソースコードはコチラをコピーしてお使いください。

.entry.excerpt p {
color:#000;
}

カラーコードは「#000」としていますが、好みに合わせてご自由に指定してください。
私はストレートにブラックとしました。

なぜか、Huemanの抜粋の文字色のカスタマイズに言及しているサイトが見つからなくて、自力でなんとかしました・・・。
冷静に考えたら、めちゃくちゃ簡単でしたけどね(汗)

抜粋の文字色をカスタマイズした理由

ようやく理想的な抜粋部分の文字色を実現できました。
先ほども書きましたけど、参考になるサイトを見つけられなかったんですよね・・。
検索能力が低いと言えば、弁解の余地はありません。

もしかすると抜粋の文字色、あまり気にする必要はないのかなとも思ったりもしました。

 

しかし、訪問者の立場で考えると、薄い文字は読みたくないから、記事タイトルだけに目が向きます。
で、記事タイトルだけを見てクリックして、中身を読んで(´・ω・`)な感じだったら、時間を奪われてしまうではありませんか。

タイトル詐欺の記事って、未だに多いですから。

「〇〇とは?□□って誰?△△に恋人はいるの?徹底調査!!」

みたいなタイトルで、よくよく読んでみると

「調べたけどわかりませんでした」
「鋭意調査中です!!」

みたいな締めだと、ホント後悔するんですよ。

後悔する人がいる記事を公開しちゃダメですよね。
時間を返せって感じです。

 

そういう思いがあるので、記事ごとに、

  • こんなこと書いてます
  • 書き出しや冒頭部分はこんな感じですよ

と抜粋で案内して、訪問者さんの時間をムダに奪わないようにと思って、読まれるように色濃くしました。

抜粋を読んで満足したらそれで良いですし、もっと読みたいなと思ったら、読んで頂けるとうれしいですし。
ともかく訪問してくれた人に、読んで損したと思われないよう努力することのひとつが、抜粋の文字色カスタマイズだったということです。

まとめ

些細なカスタマイズでしたが、同じように悩まれている人がいたら、参考にして欲しいと思います。

huemanは外国製のテーマですから、記事が英文だと薄い色の抜粋は馴染むんですよね。
公式サイトのデモとか見ると、そう感じました。

Hueman – WordPress theme | WordPress.org

 

これが日本語だと、あら不思議。

なんとなく見づらい・・。

というのは個人的な意見です。

良かったらシェアお願いします(^-^)
error: 右クリックはコピーガードのため禁止しています !!