Houn

2022.11.20 WordPress

【WordPress6.1】一部の文字色だけ変更(ブロックエディタ)

サンプルを兼ねた記事概要

WordPressのブロックエディタで、ブロック内のうち一部の文字だけ色を変更する方法の紹介です。文字色だけでなく背景も変更できます。

右メニュー「色」からは変更できない

おそらく通常、最初に試すのは、目的の文字をドラッグで選択状態にして右メニュー内「色」から変更する方法だと思いますが

右メニュー「色」で操作

この場合、選択状態の文字を含んだブロック全体の文字色が変わってしまいます。

ブロック全体の文字色が変わった

「ハイライト」を使用する

一部の文字色だけを変更は「ハイライト」という機能を使うことで可能になります。

目的の文字を選択した状態で

  1. 下向き矢印アイコンをクリック
  2. 「ハイライト」を選択
「ハイライト」を選択する

そして任意の色を選択します。

色を選択

できました!

選択した文字だけ色が変わっています。

文字の背景に色を付ける

次は、文字色を変えるのではなく背景色を付けてみます。

先ほど同様、目的の文字をドラッグで選択状態にして

  1. 下向き矢印
  2. 「ハイライト」
「ハイライト」を選択

出現した色選択窓にある「背景」をクリックします。最初は「テキスト」になっているのを切り替える形ですね。

あとは、その状態で色を選ぶだけです。

できました!

文字色はそのまま、背景色が付きました。

なおこの例だと、赤背景×黒文字で少々読みづらいですね。

そういう場合は再度ハイライト→「テキスト」を選択して、例えば白文字にしてあげます。

これで見やすくなりました。

見出し、リストなどにも使えます

「段落」ブロックだけでなく「見出しブロック」「リストブロック」などにも使えます。

見出し

見出しブロックでも一部文字色変更

リスト

実際に書いてみました。

  • 通常の項目
  • 通常の項目
  • 特に重要な項目
  • 一部だけ強調したい項目

WordPressに時間を取られすぎていませんか?

「ブログやるなら、HP持つならWordPress!と聞いて始めたけれど『これどうやるの?』のオンパレード。分からなくてググってみれば『下手なカスタマイズはサイトが真っ白になります』『ハッキングされるかも?』って、何それ?!なんかもういいや‥」

‥というあなたへ朗報です!

WordPressブログに関するトラブル解決の専門家「ブログサポーターがみたか」さんが提供されているサービス

が助けてくれます。

WordPressのトラブル対応やカスタマイズにお強く、これまでのべ1,000件以上の解決実績をもとに

  • 使い方が分からない
  • カスタマイズしたい
  • ブログ運用の仕方、WordPressの使い方が間違っていないか不安
  • ハッキングに遭ってしまった‥

などさまざまな要望・問題に、丁寧迅速に対応してくださいます(がみたかさんは10年近く前から存じ上げていますが、本当に丁寧で優しいです)

ブロガーさんなら記事を書くこと、事業者さんなら本来の業務が時間を割くべきことで、「WordPress、これどうやるの?」とググって悩んでいるのは時間の無駄です。

きちっと必要な部分には投資をして”餅は餅屋”に任せ、できた時間でしっかり本業に集中し、より大きな収益を生みましょう。

安心して、快適にサイトを運営するために、ぜひ活用してください。

お問い合わせ