WordPressの引用ボックスの色を変更する方法|ピンクからグレーにできない原因と対処法

ブログサービス

WordPressのビジュアルエディタで引用ボックスを利用する際、「選択するとピンク色の引用しか表示されない」「サンプルにあるグレーの引用ボックスが選べない」といった悩みを抱えることがあります。

実は、引用ボックスの色やデザインはWordPress本体ではなく、テーマやプラグインの設定によって決まっている場合が多くあります。この記事では、引用ボックスの色が変更できない原因と解決方法について解説します。

引用ボックスの色はテーマによって決まることが多い

WordPress標準の引用ブロックには色の固定設定がないことが一般的です。そのため、表示される色やデザインは利用しているテーマのスタイルシート(CSS)に依存します。

例えば同じ引用ブロックでも、あるテーマではピンク色、別のテーマではグレー色や青色で表示されることがあります。

見本画像と違う色になる場合は、テーマ独自の設定が影響している可能性があります。

ブロック設定からスタイル変更できる場合がある

Gutenbergエディタを利用している場合、引用ブロックを選択すると右側の設定パネルに「スタイル」や「デザイン」が表示されることがあります。

テーマによっては「標準」「シンプル」「吹き出し」「引用ボックス」など複数のスタイルを切り替えられます。

まずは引用ブロックをクリックし、サイドバー内にスタイル変更メニューがないか確認してみましょう。

テーマ独自の引用機能を確認する

人気テーマでは独自の装飾ブロックが用意されていることがあります。

確認項目 内容
テーマ設定 独自の引用デザインが選択可能
ブロック追加画面 専用の引用ボックスが存在する場合がある
ショートコード テーマ独自機能で色変更できることがある
プラグイン設定 引用デザインを管理している場合がある

特に有料テーマでは、標準の引用とは別に専用ブロックが用意されていることも珍しくありません。

CSSで色を変更する方法

テーマに色変更機能がない場合は、追加CSSでデザインを変更できます。

WordPress管理画面の「外観」→「カスタマイズ」→「追加CSS」から引用ボックスの背景色や枠線色を変更可能です。

ただしテーマごとにクラス名が異なるため、ブラウザの開発者ツールで対象のCSSを確認する必要があります。

画像と同じデザインにならない場合の原因

インターネット上の記事や解説動画では、別テーマや旧バージョンのWordPressを使用していることがあります。

そのため同じ操作をしても表示が異なるケースがあります。

またテーマアップデートによって引用ボックスのデザインが変更されることもあります。

まとめ

WordPressで引用ボックスがピンク色しか表示されない場合、テーマやプラグインの仕様が原因であることがほとんどです。

まずはブロック設定やテーマ独自機能を確認し、それでも変更できない場合は追加CSSによるカスタマイズを検討しましょう。利用中のテーマ名が分かれば、さらに具体的な変更方法を確認しやすくなります。

ツイッターのフォローはこちらから出来ます!

コメント

タイトルとURLをコピーしました