【DigiPressテーマ el plano 】リンク文字色はマウスだけで設定できます!

この記事で紹介しているテーマは、100%GPLではないテーマです。WordPressコミュニティは、100%GPLライセンスを推奨しています。私も、現在は100%GPLライセンスのテーマのみを推奨しています。100%GPLテーマの記事はこちらです。

この記事は2年以上前に公開された記事です。情報が古くなっています。現在は状況が異なる可能性があります。

WordPressにて、このブログ ”ものくろぼっくす”は作っています。そして、テーマ(外観)をel planoにしてもうすぐ1年になります。

リンク文字色などを見直して、設定を変更しました。これらの設定を調整するのに『el plano』ならマウスだけでOKです。管理画面のDigiPressメニューを開き『ビジュアル設定-基本テキスト設定』メニューから調整できます。CSSの難しい呪文は編集不要なんですよね。

太字って見にくいんじゃない?

いままではリンク文字には『太字』で表示されるようにしていました。目立つように!と考えていたのですが、どうも逆に「見にくいんじゃない?」と感じて、太字の設定を解除して、リンク文字色は”明るめの青色”に設定しました。

ぜひ、感想を下のfacebookコメントから教えてください!

リンク文字色はマウスだけで設定できる

変更したのはリンク文字色の設定

リンク文字色の設定を変更しました。通常ならスタイルシート(CSS)を編集することが必要なのですが、DigiPressさんのテーマはそれが不要です。マウス操作だけで変更できます。ありがたいわけです。

変更したのは下の3つ

  • リンク表示色
  • リンクにマウスカーソルを合わせた(hover)時の文字色
  • リンク文字の太字設定解除

リンク表示色は明るめに変更

リンク文字は青系統が良いと、ものくろは思っています。ものくろぼっくすは黒基調のデザインですし、リンクなんだよ!って一目瞭然のそうがいいですよね。

リンクは青色!って偉い人思いつきで決めたそうです。ここでもあそこでもあっちも青色で表示されていますし。

参考になる記事一覧はこちら↓

こちらの記事にある大手サイトのリンク色を参考にして、だいたい綺麗じゃない?という雰囲気で「#002aff」に決めました。いや、#0000ffで良いかな?って試したのですが、ちょっと気に入らなかったので、すこし落ち着いた方向へずらしています。管理画面からカラーピッカーの上で、マウスぐりぐり動かすだけで試せるので楽ちんです。

配色表とにらめっこせずに調整できるのが素晴らしいです。

リンク文字色を明るい色にしたことで、太字の設定はくどすぎる!ということで解除しました。これも管理画面にあるチェックボックスをoffにするだけ、ワンクリックで設定完了です。本来のCSSならfont-weightプロパティーを設定する必要があるので、ほんと楽ちんです。

digipressデザインカスタマイズは簡単

マウスを乗せた時、つまり、hover時にはアンダバーが表示されるので、『配色は同じにしておく?』って思ったのですが、貧乏性なのでせっかく設定できるしと、ちょっと暗めの配色(#0645ad)をチョイスしました。

もっともスマートフォンデバイスからだと、この動作って出来ないので、、あれなんですよね。スマホから見て頂いているから増えているし、、はい。

なので、設定するときにはPCでの表示だけでなく、iPhoneのブラウザーでの表示して雰囲気を確認して作業しました。これおすすめです。ぜひお試しください。

リンク文字色を変更した

簡単に変更できるメリットは大きい

あっそうだ、変更前はリンク色(#0000cd)、hover(#20b2aa)という、よくわからない設定でした。マウス操作だけで変更できて楽ちんですが、変更後はすっきりした雰囲気になったので『もっとはやく変更しておけば、、よかった、、』と思っています。

作業時間も短く済みますし、ブログ全体の表示を調整するので、記事からリンクを開きやすい雰囲気になるよう、どんどん調整できるメリットは大きいです。

柔軟なデザインカスタマイズ性

このように管理画面からフォント配色を調整できる一方で、CSSカスタマイズでのデザイン調整も両立して使えます。例えば、記事タイトルや見出しはCSSカスタマイズでデザインしていますし、ものくろぼっくすの段落余白はel planoオリジナルとは違う設定にCSSで調整しています。

管理画面から”簡単にデザインの調整ができること”とスタイルシート(CSS)設定で柔軟にデザインカスタマイズできるのが両立しているのが素晴らしく、ものくろが惚れているわけです。

ただ、テーマバージョンアップを行うと、カスタマイズが消えていないのに初期化されたように”びっくり”する状態(1クリックでカスタマイズは復活します)になるので、バージョンアップの時には注意してください。

講座 開催予定

この記事を書いた人