Выравнивание абзацев по ширине в редакторе Gutenberg

WordPress «осчастливил» новым редактором, и придётся к нему приспосабливаться, тем более, что поддержка классического редактора не будет вечной.

В принципе, пока у меня всего лишь две претензии к гутенбергу, и первая из них – это отсутствие выравнивания по ширине в блоке «абзац». Все предыдущие статьи у меня на сайте именно с таким выравниванием, и мне бы очень не хотелось менять этот стиль.

По умолчанию в блоке «абзац» гутенберга стоит выравнивание по левому краю.

Теоретически предусмотрена возможность для каждого блока дописывать свои стили на вкладке «Дополнительно-Дополнительный класс CSS»:

Однако, моя попытка добавить в это поле выравнивание по ширине, ни к каким изменениям не привела. На предварительном просмотре абзац по-прежнему был выровнен по левому краю.

В классическом блоке гутенберга по-прежнему можно выравнивать текст по ширине с помощью горячих клавиш Alt+Shift+J.

Однако, в классическом блоке  обозначилась другая проблема: с большим трудом можно добиться, чтобы сделанные ссылки открывались в новой вкладке окна браузера. Увы, очень часто это не срабатывает, сколько ни устанавливай нужный флажок.

Так что, придётся добиваться выравнивания по ширине в блоке «абзац».

Сделать это можно, дописав свой стиль css на вкладке консоли «Внешний вид-Настроить-Дополнительные стили»:

p {

text-align: justify;

}

Этот вариант у меня сработал, теперь текст во всех гутенберговских блоках «абзац» автоматически выравнивается по ширине. Однако, я не уверена, что при очередном обновлении темы это сохранится, поэтому в итоге решила прописать выравнивание по ширине для абзацев в файле style.css своей дочерней темы:

/*Выравнивание абзацев по ширине*/

p {

text-align: justify;

}

Ну вот, теперь можно жить и с гутенбергом 🙂 .

Поделиться:

Опубликовано

в

от

Метки:

Комментарии

8 комментариев на ««Выравнивание абзацев по ширине в редакторе Gutenberg»»

  1. Аватар пользователя Вячеслав
    Вячеслав

    Огромное спасибо! Ещё сидя на 4.9., без Гуттенберга, постоянно раздражался отсутствием функции в классическом редакторе… А с переходом на 5.3. — вновь обнаружил ту же фигню уже в Гуттенберге… Решил — Гугл мне в помощь, и вот: приведенный Вами способ — наконец-то сделал все мои абзацы ровными, а не такими, словно их справа собаки грызли)))
    Пока попробовал первый способ. Второй, в-принципе, понятен, кроме одного: есть ли какие-либо указания в части места размещения указанной записи (кода) в файле («до», «после», и.т.п.) Зы: я — чайник, если что)))

    1. Аватар пользователя Elena
      Elena

      Здравствуйте! Я тоже «чайник» 🙂 Просто пытаюсь решать проблемы по мере поступления 🙂
      Код для выравнивания абзацев по ширине в style.css может быть в любом месте файла. Главное, чтобы это было сделано в дочерней теме, иначе при следующем обновлении темы придётся прописывать это заново.
      На всякий случай, как сделать дочернюю тему, можно посмотреть в этой статье.

      1. Аватар пользователя Eris
        Eris

        Спасибо простое решение для чайников и подробное описание! Это даже я смогу реализовать)

  2. Аватар пользователя arti
    arti

    Спасибо! А я аддоны подыскивать думал. Еще раз спасибо, снял геморный вопрос

  3. Аватар пользователя МэриЭнн
    МэриЭнн

    Большое спасибо за совет. Решила начать осваивать гутенберг, ибо поддержка классического редактора не вечна. Ваш совет буквально спас неопытного админа.
    Правда, почему-то в редакторе выравнивания не видно, оно появляется только после публикации

    1. Аватар пользователя Elena
      Elena

      Да, в редакторе выравнивания не видно, потому что функции самого редактора мы не затрагиваем, мы добиваемся нужного эффекта на другом уровне. Выравнивание можно увидеть до публикации на предварительном просмотре.

      1. Аватар пользователя Олег
        Олег

        А у меня вместе с текстом по ширине выровнялась информация в шапке сайта. Можно ли это исключить как-то?

        1. Аватар пользователя Elena
          Elena

          Думаю, можно попробовать в style.css прописать отдельный стиль именно для шапки, и задать его приоритет.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *