サポート » バグ報告と提案 » WordPress 5.0.2 Gutenbergでブロック間に改行が入る

  • 解決済 simplewasbest

    (@simplewasbest)


    Gutenbergエディタを使い始めたのですが、ブロック間にこちらの入力していない改行が以下のような感じで3つも入ってしまいます。これはブロック間にスペースをWordpress側で勝手に入れているような感じだと思うのですが、サイトの見た目が間延びしてしまうと共に、画像や見出しを1ブロックとして使う関係上、見た目が良くないんですが、Gutenbergの設定などでどうにかならないのでしょうかね?

    <p></p>
    <br>
    <br>
    <br>
    <h2></h2>
    <br>
    <br>
    <br>

11件の返信を表示中 - 1 - 11件目 (全11件中)
  • CG

    (@du-bist-der-lenz)

    <br>にスタイルがあたっていませんか。

    トピック投稿者 simplewasbest

    (@simplewasbest)

    返信ありがとうございます。

    Themeのmain.cssにも、追加のcssにも<br>にはスタイルは当てていません。念の為、ブロック内の改行<br>に関しては、想定通りに改行されています。

    CG

    (@du-bist-der-lenz)

    <br>はブロック間には入りませんね。ブロック内で改行すれば、当然ですね。だから、p要素のマージンの指定次第ですよ。

    トピック投稿者 simplewasbest

    (@simplewasbest)

    度々ありがとうございます。
    スタイルシートを確認したところ、p要素にmargin-bottom:1emが入っていたので、それを0にしたところ全体的に1行減った感じがします。しかしまだまだ画像のブロックや、見出しのブロックで隙間が目立ちします。

    Chrome developerで確認して気になったのは、user agent styleの以下と。
    p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    }

    Wordpress style.min.cssの以下の部分。試しにwp-block-image要素を上書きでmarginを減らしたら、行数がまた減りました。
    .wp-block-image {
    max-width: 100%;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    }

    これは、、、、、、block要素のスタイル全てにやはりmarginが乗っていて、かつp要素など個別にmarginが乗っているのもプラスして、行間が間延びしているような気がしてきました。

    トピック投稿者 simplewasbest

    (@simplewasbest)

    試しにfunction.phpに以下を入れて、blockスタイルを読み込ませなくしましたが、隙間という点ではあんまり改善しませんでした。

    wp_deregister_style( ‘wp-block-library’ );
    wp_register_style( ‘wp-block-library’, null, [], 1 );
    wp_deregister_style( ‘wp-block-library-theme’ );
    wp_register_style( ‘wp-block-library-theme’, null, [], 1 );

    つまり、今までの記事ではあまりp要素を使っていなかったので、新しいeditorだとデフォルトでp要素を多様されるから、こういう部分が急に目立ってきたということかもしれません。つまりテーマが悪さしているのかもしれないですね。。

    こんにちは

    根治療法ではありませんが、

    投稿本文のクラス(通常は、.entry-content)の直下のbr要素をdisplay:none;にしてみてはどうでしょう?

    
    .entry-content > br{
    display:none;
    }
    

    なんとなくですが、テーマ側で、nl2br()(改行をbrに置換する関数)等を使ったフィルターが使われているようなケースもあるかもしれないですね

    トピック投稿者 simplewasbest

    (@simplewasbest)

    nobitaさん

    コメントありがとうございます。
    コメントを元にCSSを設定したら、無事にbrの表示を消すことが出来ました!ありがとうございます!

    おそらくテーマ側のせいなんでしょうね。
    対症療法ではありますが、とりあえずテーマ側で修正されるまでこの方法で対応したいと思います。

    念の為、現在使用しているテーマをフォーラムの記録用に残しておきます。
    Hueman 3.4.11

    トピック投稿者 simplewasbest

    (@simplewasbest)

    続報。。。どうやら以下のプラグインが悪さをしていただけでした。
    プラグイン削除後、brスタイルを当てなくても、正常に見えるようになりました。

    brBrbr
    Line feed is converted to <br />.

    みなさま、ありがとうございました。

    CG

    (@du-bist-der-lenz)

    Hueman テーマを使用しているサイトで、再現を確認している最中でした。2日9時間前に確認を提案してますよ。

    トピック投稿者 simplewasbest

    (@simplewasbest)

    CGさん

    本プラグインを入れていたことを失念しており、大変失礼しました。
    ご確認ありがとうございました。

    CG

    (@du-bist-der-lenz)

    問題ありません。確認に失敬したサイトは、もとに戻しておきました。解決したこと、返信があって助かります。テーマを最初に示してあれば、確認は早くから出来ました。次のトラブルに悩んだ時は、使用中のプラグインも明確に記しておいてくださいね。

11件の返信を表示中 - 1 - 11件目 (全11件中)
  • トピック「WordPress 5.0.2 Gutenbergでブロック間に改行が入る」には新たに返信することはできません。