スタイル変更の仕方

yamadanoa
(@yamadanoa)

2年、 2ヶ月前

ワードプレスでスタイルの細かい指定をする方法を教えていただけます出ようか。
HTML/CSSは使えますが、ワードプレスは初心者です。テーマファイルをDLして書き直すという方法はあると思うのですが、できれば管理画面上でで指定できると嬉しいです。
（今、具体的にやりたいことは、H2タグのバックグラウンドイメージとして画像を指定することと、左右の余白の大きさを調整すること（もしくは要素の横幅指定？）です。）

ワードプレスのバージョン：5.9
使用中のテーマ：tweny tweny-two(特にこだわりはありません)
Gutenbergのプラグインを有効化しています。

外観→エディターで出てくるブロックエディター内の、右側にあるツールバーの中に、
ブロック→高度な設定→追加CSSという枠があったので、CSSでスタイルを書き込んでみましたが、何を書いても反映されませんでした。

ビジュアルエディターからコードエディターに切り替えてみましたが、ＨＴＭＬコードが出てくるだけでＣＳＳをかけそうな場所は見当たりませんでした。

固定ページ→固定ページ一覧→編集の画面でも同様のことを試しましたが、反映されませんでした。

4件の返信を表示中 - 1 - 4件目 (全4件中)

Aki Hamano
(@wildworks)

2年、 2ヶ月前

@yamadanoa さん

こんにちは。

外観→エディターで出てくるブロックエディター内の、右側にあるツールバーの中に、
ブロック→高度な設定→追加CSSという枠があったので、CSSでスタイルを書き込んでみましたが、何を書いても反映されませんでした。

→ここは、選択中のブロックに任意のCSSクラス名を付与するためのものなので、直接スタイルを書き込むものではありません。

軽微なCSS調整であれば、「外観」>「カスタマイズ」>「追加CSS」に記述すればよいと思います。

ブロックエディター側のスタイル含め、細かくスタイルを調整したい場合は、子テーマを作成する必要があります。

トピック投稿者 yamadanoa
(@yamadanoa)

2年、 2ヶ月前

@wildworks　様
何度も失礼します。
今わかったのですが、普通は管理画面から「外観」>「カスタマイズ」>「追加CSS」とプルダウンで進めるようですね・・・。
私の管理画面ではプルダウンでその項目は出てこず（選んだテーマの影響？）、
「ツール」>「テーマファイルエディター」と進むと、PHPファイルやCSSファイルを直接編集する画面が出てきましたので、軽微なCSS編集はそこでできそうです。

Aki Hamano
(@wildworks)

2年、 2ヶ月前

@yamadanoa さん

失礼しました、TwentyTwentyTwoをお使いですと、外観メニューからは現状追加CSSにアクセス出来ません。
、TwentyTwentyTwoブロックテーマと呼ばれるもので、これまでのテーマの作りとは大きく異なっています。

また、「テーマファイルエディター」で編集してしまうと、テーマのアップデートがあった場合に追記した内容が消えてしまいますので、子テーマを作成される事をお勧めします。

もしくは、一つ前のTwentyTwentyOneなどのテーマ（クラシックテーマ）であれば、「外観」>「カスタマイズ」>「追加CSS」からスタイルを記述する事が出来ます。

トピック投稿者 yamadanoa
(@yamadanoa)

2年、 2ヶ月前

@wildworks 様　何度もありがとうございます。
ブロックエディタがメインになる前の、クラシックテーマであれば、テーマカスタマイズの延長でCSSを追加することができたということでしょうか。だんだん理解できて来た気がします。

子テーマの作成・有効化はすでにしてあるので、今、手を加えようとしているのは子テーマのほうです。

先ほど「テーマファイルエディター」でCSSを書いてみたのですが反映されなかったのですが、もしかして子テーマが有効になっていても親テーマのほうを書き換えてしまっている状態なのでしょうか・・・？

何にせよ、もうテーマを変えるか、ファイルを直接編集したほうがよさそうな気がしてきたので、そちらを試してみます。

4件の返信を表示中 - 1 - 4件目 (全4件中)

トピック「スタイル変更の仕方」には新たに返信することはできません。

トピックタグ

表示