WEBサイト作成時に発生するエラーやトラブル対応の備忘録を中心に、いろいろと書いております。


wp-block-group__inner-container を消したい。

wordpressのグーテンベルグでなるべくコンテンツ部分は作成しようとグループ化グループ化を繰り返していたら、意図したレイアウトにならず。

見てみると、グループ化するごとに「class = “wp-block-group__inner-container”」のついたdivが生成されている。

いらんねん。

と思って色々調べていたら、

Nishiki Pro:ワードプレス 6.2 リリースに伴う、テーマ側の対応について

という、縁はないテーマのサポートブログ内に

theme.json を導入したことにより「グループ」ブロックの html 構造が変更され「wp-block-group__inner-container」のクラスが付いた div 要素が削除されました。

Nishiki Pro:ワードプレス 6.2 リリースに伴う、テーマ側の対応について

と、あったので、試しに空のtheme.jsonいれてみたら消えたー!!

です。

※追記(2023/7/24)

空のtheme.jsonを入れると、エディターから余白がなくなります。

spacingを以下のように設定。

{
    "$schema": "https://schemas.wp.org/trunk/theme.json",
    "version": 2,
    "styles": {
        "spacing": {
            "padding": {
                "top": "1rem",
                "right": "3rem",
                "bottom": "1rem",
                "left": "3rem"
            }
        }
    }
}

そうすると、公開側のbodyにpaddingが入ってしまうので、

<style>
	body{padding: 0px;}
</style>

を入れて相殺。

テーマの方、ちゃんとブロックテーマを意識して作ってたらこんなことにはならないのですが……。

この後、オリジナルフォントカラーとか追加すると、うまくいかなかったので、フォントカラーはtheme.jsonを使わず、phpとstyle.cssにわざわざ書き足すという面倒なことをしてしまいました。けど、本当はtheme.jsonで管理したほうが絶対に楽です。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください