Новая версия WordPress 5.0 «Bebo» и новый редактор Gutenberg

Скажи Привет новому редактору!

6 декабря 2018 г., несмотря на недовольство сообщества состоялся выпуск новой версии WordPress 5.0 «Bebo». Социальные сети и форумы наполнились негативными комментариями и откликами. Все дело в том, что новая дата релиза – это день, предшествующий конференции WordCamp US.

Также, есть еще одна причина недовольства: разработчики различных шаблонов и плагинов впопыхах подгоняют свои продукты под новые возможности WordPress и конечно же, не успевают.

Что нового в WordPress 5.0 и почему столько шума?

Вот уже несколько месяцев все активно обсуждают внедрение в движок нового визуального редактора Gutenberg. А многие крупные игроки на рынке WordPress уже заявили полную совместимость своих продуктов с новым редактором.

Итак, самым главным внедрением в новой версии движка, является интеграция в ядро блочного, визуального редактора Gutenberg. Этот, новый редактор полностью заменяет старый, добрый классический редактор и теперь является одним целым с WordPress.
После обновления до версии 5.0 вы больше не увидите на странице редактирования записи/страницы привычной для нас всех панели инструментов.

Теперь, каждый кусок текста/абзаца, каждое изображение, каждая кнопка вставляется с помощью блоков нового редактора.

Разработчики нового редактора считают, что Gutenberg придаст вашему сайту больше возможностей для создания/редактирования контента, а также более гибкие настройки:

Наш новый блочный редактор — первый шаг в захватывающее будущее с рациональным целостным опытом редактирования сайта. У вас станет больше гибкости по отображению содержимого, неважно, создаете ли вы первый свой сайт, освежаете блог или создаете код для жизни.

Почему новый редактор назвали Гутенберг?

Гутенберг — немецкий первопечатник, первый типограф Европы. В середине 1440-х годов создал способ книгопечатания подвижными литерами, оказавший огромное влияние не только на европейскую культуру, но и на всемирную историю

По задумке и представлениям разработчиков новый редактор также призван сделать революцию в среде WordPress и заложить новое основание в создании контента.

Создавайте контент из блоков

Новый, основанный на блоках, редактор не изменит вид отображения содержимого для посетителей. Gutenberg позволит вам, как редактору легко вставить любой тип блока и перейти к подаче основного содержимого. Каждый элемент содержимого будет в собственном блоке, что даст вам большую свободу для маневров. Если же вы любите использовать HTML и CSS, то блоки будут вам весьма кстати.

В новом редакторе я насчитал больше 60 разных блоков для вставки в контент. Это абзацы, заголовки, список, изображения, медиафайлы, код, теги HTML, таблицы, цитаты, шорткоды, кнопки, колонки, разделители, виджеты, вставки контента из социальных сетей и т.д.

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

Новый опыт редактирования представляет более целостное обращение с дизайном и содержимым. Если вы создаете сайты для клиентов, вы можете создавать многократно используемые блоки. Они позволят вашим клиентам легко добавлять новое содержимое, с сохранением целостности вида и восприятия сайта.

Новая версия WordPress 5.0 "Bebo" и новый редактор Gutenberg

Т.е. ваш клиент, при самостоятельном редактировании контента не нарушит его внешний вид и не спустит в унитаз вашу многочасовую работу.

Зачем изменили редактор?

Новый редактор призван улучшить визуализацию контента и сделать более удобное и понятное его представление на сайте.

Я думаю, что Gutenberg стал чем-то средним между старым классическим редактором и современными платными визуальными конструкторами (Visual Composer, Elementor и т.д.).

Вспомните те ситуации, когда перед вами стояла задача красиво оформить контент на странице используя возможности классического редактора. Это был микс, когда мы часть работы выполняли во вкладке визуального редактирования, потом часть работы делали во вкладке исходного кода, а потом подгоняли это все с помощью шорткодов (отзывы, цветные блоки, кнопки и т.д.). А потом, после просмотра страницы мы еще раз десять все снова подгоняли (заголовки, жирность текста, выравнивание изображений). И все равно, результат желал лучшего.

Я уверен, что новый редактор облегчит подобные задачи и сэкономит время и нервы.

Придется привыкать ;)

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

Какие сложности могут возникнуть после обновления WordPress?

1.Не все плагины проверялись на совместимость с новым редактором.

Это может привести к различным проблемам во время редактирования контента, могут появляться белые экраны смерти, ошибка 500 и т.д.

Перед обновлением WordPress создайте актуальную, полную резервную копию своего сайта и только потом запускайте процесс обновления. После обновления проверьте работу реадктора на страницах редактирования записей, страниц и произвольных типов записей.

2.Не все шаблоны поддерживают новый редактор.

Если возникают ошибки во время редактирования, или на сайте, или контент начал некорректно отображаться — перейдите на классический редактор. Не пытайтесь использовать новый редактор с несовместимым кодом. Дождитесь обновления шаблона, которое решит проблему совместимости и только потом переходите на новый редактор.

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

3.Старые версии PHP (до 7.0) могут вызывать проблемы в работе сайта.

Если у вас возник вопрос, не стоит теряться в догадках. Задайте его в комментариях. Задать вопрос

Например, медленная загрузка и появление ошибок (устаревшие функции и т.д.).

В панели хостинга переключитесь на версию PHP 7.2.
Старые, необновленные шаблоны и плагины могут воспринять этот переход с протестом.

4.Старые версии визуальных конструкторов (Visual Composer, Divi, Beaver Builder) могут вызывать на сайте ошибки и проблемы.

Плагины конструкторов необходимо обновить до самой последней версии.

Следуя моим рекомендациям выше, вы можете снизить риск этого перехода и плавно перейти в 2019 год с помощью мощного нового редактора для WordPress.

Решили остаться на старом редакторе?

Предпочитаете остаться со старым, добрым классическим редактором? Без проблем!

Обновите WordPress и установите плагин Classic Editor.

Плагин Classic Editor оставляет старый вариант редактора WordPress. Он позволяет использовать расширяющие его плагины, добавлять поля метаданных в старом стиле или иные вещи, зависимые от старого редактора.

Для его установки перейдите в раздел Плагины — Добавить новый. В поиске введите «Classic Editor». Нажмите «Установить». После установки нажмите «Активировать». И все — вы в родной среде!

Новая версия WordPress 5.0 "Bebo" и новый редактор Gutenberg

Поддержка плагина Classic Editor будет осуществляться в WordPress до 2021 года включительно.

Личные ощущения от перехода на новый редактор

Решил обновиться и эту статью написать используя Gutenberg. 

Перешел в раздел Записи — Добавить новую и передо мной открылась унылая картинка. Я подумал: это одна большая ошибка.

Все так не привычно, да и к тому же интерфейс страницы редактирования частично русифицирован. «Сыровато» — подумал я.

Но, ради эксперимента начал писать статью в новом редакторе…

И… мне понравилось! 

Стало более удобно работать с контентом: вставлять ссылки, изображения, создавать абзацы и заголовки, передвигать блоки и т.д. Кто работал с визуальными конструкторами, у тех не должно возникнуть проблем в работе с Gutenberg.

Но, не обошлось и без казуса.

Когда уже почти статья была готова и я начал выбирать категорию, вдруг появилась ошибка:

Новая версия WordPress 5.0 "Bebo" и новый редактор Gutenberg
Ошибка на странице редактирования записи

Я нажал на кнопку Coppy Error, скопировал таким образом сообщение об ошибке и вставил в текстовый редактор для просмотра.

Вот текст ошибки:

Ошибка говорит о том, что Гутенберг конфликтует с плагином Yoast SEO Premium 8.1.2. Было принято решение установить плагин Classic Editor. Но, после активации этого плагина ошибка не пропала и запись было невозможно дальше редактировать.

Плагин Classic Editor был отключен, а плагин Yoast SEO Premium был обновлен до версии 9.1. Проблема решилась!

Еще заметил одну проблему: постоянная ссылка записи не создалась на латинице. На моем сайте стоит плагин Clearfy Pro, у которого есть функция генерации постоянных ссылок на латинице и до этого плагин исправно выполнял свои задачи в этом вопросе. Но, после обновления WordPress пришлось отключить в плагине Clearfy Pro эту функцию и установить плагин Cyr to Lat enhanced. Возможно, это из-за старой версии плагина Clearfy Pro.

Чувствую, еще не один сюрприз вылезет наружу после обновления WP. А когда клиенты начнут самостоятельно обновлять WordPress, вот тогда начнется реальная свистопляска и вебмастера будут в мыле: бегая от сайта к сайту и исправляя все эти ошибки и нюансы на клиентских сайтах :)

Скажите своим клиентам, чтобы не обновляли пока свои сайты — пожалейте себя!

При создании этой статьи использовались следующие материалы:

WordPress 5.0: How and When to Update

WordPress 5.0 «Bebo»

Рейтинг 5/5 (2 голоса)
Надежный и проверенный годами хостинг для вашего сайта. Регистрация доменов. Аренда VPS сервера. Стабильная работа хостинга. Цены больше, чем доступные.
  Kwork.ru - услуги фрилансеров от 500 руб.

Понравилась статья? Поделиться с друзьями:
Комментариев: 16
  1. Сергей Борисович

    Ребята, тут обнаружил другую проблему, и это не зависит новый редактор или старый. Версия вордпресса 5.0.1.

    Забиваю в редакторе текст, нажимаю просмотр страницы, и некоторые строчки из текста не отображаются!! И в предварительном просмотре и после публикации.

    Закономерности пропадания толком не понял, пропадания строк примерно после 1000 или 1500 символов. Текст и писал вручную и вставлял из нотпад++ и из ворда, но всё равно косяк проявляется после перехода на WP 5.0.

    Заметил ещё, что при добавлении/удалении текста выше пропадаемой строки — пропадание текста смешается ниже/выше по тексту..

    Ещё раз добавлю в редакторе весь текст — корректно написан, хоть в блоке, хоть в html — ошибка на странице проявляется всё равно.

    Вордпресс свежепоставленный, плагинов по минимуму, тем более, что их все полностью отключал и все равно ошибка с пропаданием части строки вылазит.

    Чтобы было окончательно понятно, два скриншота, один в редакторе, второй на странице предпросмотра или после публикации:
    https://yadi.sk/i/djxYtlwsImtbTA — текст в редакторе
    https://yadi.sk/i/xBeBsKE1ld5Pzw — текст на странице

    Проверьте у себя, может ещё у кого так же!! Чтоб проще проверить, текст с публикуемой страницы скопировать в Word и нажать F7 — это проверка текста в ворде.
    Отпишите кто выявит такую же проблему.

    1. Николай Пекарский (автор)

      Здравствуйте,
      У вас стоит WP 5, а редактор используете классический.
      Если использовать гутенберг, то что с текстом происходит?
      Возможно текст вставлен с тегами? Просмотрите текст как HTML.
      Возможно, действуют ограничения для сайта на сервере.
      Возможно, конфликты между плагинами, конструкторами и т.д. Нужно отключать плагины и смотреть — решается проблема или нет.

  2. Дмитрий

    Подскажите как в новом редакторе сделать поле редактирования шире? А то как то писать статью в узком столбце не совсем удобно.

    1. Николай Пекарский (автор)

      Работа в полноэкранном режиме.
      Вот скрин опций, которые необходимо выбрать: https://i.imgur.com/lavSzfU.png
      Левая панель будет спрятана.
      А чтобы спрятать еще и правую панель, нажимаете на иконку шестеренки, скрин: https://i.imgur.com/E03PFGA.png

      1. Дмитрий

        Спасибо, но это не помогает. Поле редактора почему то фиксированной ширины и никак его шире у меня сделать не получается. Не могу понять как у вас тут зацепить картинку. Хотел показать скриншот.

        1. Николай Пекарский (автор)

          Возьмите сделайте скрин и загрузите на облако, с сюда просто вставьте ссылку.

          1. Дмитрий

            https://yadi.sk/i/XiBJbuheUoEoUw
            Вот на яндекс диск выложил

          2. Николай Пекарский (автор)

            Штатными настройками это не решить. Нужно использовать дополнительный плагин, например этот https://wordpress.org/plugins/editor-full-width/

          3. Дмитрий

            Спасибо большое, попробую. Конечно, все это очень странно, тем более я вижу, что на ваших скринах вроде как нормальная ширина.

          4. Николай Пекарский (автор)

            Ширина у меня ограничена так же, как и у вас.

  3. Инна

    В новой версии Вордпресс в админпанели исчезла закладка РЕДАКТОР. Теперь не могу редактировать файлы движка на сайте. Куда спрятался РЕДАКТОР? Помогите найти!

    1. Николай Пекарский (автор)

      Редактор есть и в новой версии- на том же месте (Внешний вид — Редактор).
      А файлы лучше редактировать через FTP.

      1. Инна

        В том-то и дело, что Внешний вид делится на темы, настроить, виджеты,меню и фон. А редактора нет!!!! смотрите скриншот — https://cloud.mail.ru/public/9LcX/LmrVHbmtB

        1. Николай Пекарский (автор)

          Возможно, у вас на сайте стоит плагин безопасности или др. плагин, в котором включена опция выключения редактора. Или в файле wp-config.php прописана опция define( ‘DISALLOW_FILE_EDIT’, true );

          1. Инна

            До последнего обновления вордпресса все было на месте…

  4. Игорь

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

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

Используйте теги <code>Здесь ваш код</code>, чтобы вставить код в свой комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:

Задать вопрос