Вы слышали о Gutenberg, новом визуальном редакторе для WordPress, который заменяет обычный редактор HTML?
В противном случае это произойдет в ближайшее время, потому что когда выйдет версия WordPress 5.0, Гутенберг заменит текущий редактор.
Гутенберг – это больше, чем просто эстетическое обновление дизайна.
В настоящее время вы можете сосредоточиться на создании контента, но конечная цель Гутенберга состоит в том, чтобы предложить полную настройку страницы и конкурировать с великими создателями страниц.
Со временем вы сможете построить весь сайт вместе с Гутенбергом.
Гутенберг с тобой в порядке?
Это действительно захватывающее время, чтобы стать блогером WordPress.
В этой статье вы найдете очень простое руководство Гутенберга, которое предоставит основы для начала работы и покажет, что хорошо, а что плохо в новом редакторе.
Если вы не можете дождаться, когда Гутенберг провалит тест-драйв, вы можете скачать его сейчас.
Как скачать Гутенберг
Перейдите на панель инструментов WordPress, а затем
- аксессуары
- Выберите «Добавить новый»
- Найти визуальный редактор Гутенберга
- Выберите «Скачать» и активируйте плагин.
Теперь, когда у вас есть Гутенберг
Итак, давайте подготовим статью из Руководства Гутенберга и покажем вам, что вы можете и не можете делать с Гутенбергом, и надеемся представить некоторые советы и рекомендации по пути.
Руководство по началу работы с Gutenberg – Блок Введение
У Гутенберга создается впечатление, что он создает страницу, когда это первый шаг к созданию контента.
Любой элемент, добавленный на страницу или сообщение, теперь называется «Блокировать».
Блоки Gutenberg позволяют создавать более сложные макеты, чем это разрешено в современной среде редактора WordPress.
Вы можете иметь блоки для:
Это то, что вы видите, когда начинаете новый пост или страницу.
Визуальный / HTML-редактор, который мы знаем сейчас, выглядит очень минималистично.
Итак, начнем с моего простого руководства Гутенберга
Я создал это полное руководство, которое вы прочитали вместе с Гутенбергом, и, как уже упоминалось выше, я впервые использую новую среду редактирования.
Тогда вы сразу узнаете, что мне нравится в блоках Гутенберга и что я ненавижу. Я также дам вам советы и рекомендации, которые вы узнаете по пути. Не забудьте следовать за ними.
Я также обновлю этот пост в закладки или свяжусь с нами, чтобы вы могли легко найти дорогу назад.
Давайте начнем
Поэтому, когда появится указанный выше заголовок, добавьте заголовок вашего сообщения,
Я намерен использовать временное название “Руководство для начинающих Гутенберга”
Затем добавьте свое первоначальное введение в статью в текстовом блоке, как показано на рисунке ниже.
Добавить фотографии в Гутенберг
После написания вступления мне нравится добавлять изображение на дисплей, в данном случае скриншот, показанный выше.
Есть три способа добавить изображение.
- Вы можете добавить изображение с помощью панели инструментов, к которой можно получить доступ, нажав кнопку «плюс +» и выбрав блок изображения.
- Вы также можете добавить изображения с помощью кнопки быстрого доступа под текстовым полем.
- И, конечно, вы можете добавить исходный код. Измените редактор блоков на код.
После добавления изображения вы можете нажать на него, чтобы отобразить параметры выравнивания.
Вы можете выровнять влево, переместить изображение вправо или вправо.
Существует также возможность редактировать изображение с помощью мультимедийной библиотеки, и с этого момента начинаются проблемы с Гутенбергом.
Я понимаю, что когда вы редактируете изображение с помощью библиотеки мультимедиа, вы редактируете изображение так, как оно отображается на прикрепленной странице или, другими словами, там, где оно хранится. (Поправьте меня если я ошибаюсь)
Страница вложения – это очень тонкая контентная страница, в основном это просто изображение и ничего более, и из-за SEO страницы вложения очень вредны для SEO, когда Google замечает их.
У Yoast SEO недавно была проблема прикрепленные файлы Для некоторых пользователей это оказалось серьезной проблемой SEO.
Работая над процессом создания статьи с Гутенбергом, я все еще не мог найти способ добавить атрибут alt text или title title, кроме как вернуться к исходному коду, чтобы добавить необходимый HTML, или вернуться к классическому редактору.
Наши друзья из WPBeginner объясняют разницу между текстом Alt на изображении и заголовком изображения, отличная статья под названием:
Добавление описаний и тегов alt было функцией редактирования изображений, доступной после нажатия кнопки в исходном визуальном редакторе.
Это не очень хорошая новость для оптимизации изображения SEO.
Там также нет простого способа прикрепить ссылку на изображение, чтобы вы могли щелкнуть по нему.
Например, если вы хотите добавить баннер, вы должны добавить его в виде блока изображения, как показано выше, а затем вернуться к исходному коду и добавить URL-адрес в виде HTML.
Добавить цитаты и ссылки
Как вы можете видеть выше, я подключился к ресурсу (WPBeginner) по назначению блока.
Блочные цитаты отлично подходят для разбивки больших блоков текста, которые облегчают чтение статьи.
Они являются отличным визуальным элементом статей.
Вот как я это сделал:
- Нажмите кнопку +, чтобы открыть область блокировки.
- Выберите бюджетный блок
- Добавить текст цитаты
- Добавьте ссылку, если необходимо
Если вы являетесь наблюдателем, вы заметите, что пример над скриншотом блочной цитаты отличается от фактической цитаты, показанной в этом посте.
Окончательная цитата содержит текст привязки с заголовком h3 по причинам SEO.
Чтобы добавить тег h3, вам нужно вернуться к исходному коду и применить тег h3 к тексту привязки в кавычках.
Как вы можете видеть на скриншоте выше, есть кнопка быстрого доступа H (заголовок), но нажатие на нее открывает новый блок, чтобы также применить заголовок.
В настоящее время заголовок не может быть применен к бюджетному блоку.
Если вы создаете текстовый блог, вы также не сможете добавить заголовок в середине текстового блока, вам придется создать новый текстовый блок, чтобы добавить заголовок в начале нового блока и продолжить написание статьи.
Все ссылки, добавленные по умолчанию, являются окончательными, и в настоящее время невозможно остановить их, не добавив атрибут «не следовать» в качестве кода.
У вас есть возможность открыть ссылку в новом окне, добавив ссылку.
Добавить встроенные блоки контента в Гутенберг
Чтобы добавить встроенный контент к вашему сообщению, щелкните в области блокировки и прокрутите вниз, чтобы встроить. Тогда вы увидите экран блокировки ниже
Выберите тип вставки, который вы хотите использовать. Поле ссылки предоставлено для добавления кода.
Я выбрал YouTube, потому что это в первую очередь то, что вы будете использовать при создании контента для демонстрации процесса добавления видео.
Просто добавьте URL к своему видео на YouTube, и в вашем посте будет функция видео.
Что мы думаем о WordPress Gutenberg?
Ну, Гутенберг будет пугать некоторых блоггеров день ото дня. Но чем больше я использую системные блоки, тем больше мне это нравится.
Недавно я использовал веб-сайт управления контентом Wakelet для создания очень простых статей в блогах для резервного копирования моего веб-сайта Infobunny, и когда я использую Wakelet, вы заметите, что можно создавать блоги очень похожим образом, как это было сделано с помощью блоков Гутенберга.
В Wakelet Вы можете добавлять текстовые, видео и авторитетные ссылки для классификации вашего контента, изображений и даже файлов PDF.
Просто добавьте все как отдельные сообщения в Wakelet и при необходимости измените порядок создания окончательной статьи, и в основном Guttenberg Lock работает.
Вот пример из одного из моих блогов Wakelet: Насколько важны последователи социальных сетей?
Если вы привыкли использовать инструменты для создания страниц При создании постов и страниц у вас не будет проблем с использованием Гутенберга.
Гутенберг на самом деле не становится инструментом для создания страниц, поскольку он не может просто перетаскивать блоки вместе с другими отсутствующими функциями, предоставляемыми профессиональными разработчиками страниц.
Если честно, я предпочитаю старый редактор HTML, но это потому, что я к нему привык.
Мы надеемся, что у нас будет возможность переключаться между Гутенбергом и текущим редактором HTML WYSIWYG, и доступ к обеим системам даст веб-мастерам лучшее из обоих миров.
Читая о Гутенберге, я понимаю, что традиционный редактор будет доступен в качестве дополнения.
Это руководство Гутенберга было создано, чтобы дать мне представление о том, как работает Гутенберг.
Я хотел быть готовым к неизбежному выпуску новой системы, которая выходит из строя, когда WordPress достигает 5.0.
Вы изучаете новую систему, просто прыгнув первым в любом случае.
Гутенберг был разработан, чтобы сделать создание контента простым.
И я уверен, что это будет для тех, кто создает простой контент. Но для тех, кто хочет заняться чем-то другим, обучение будет более продолжительным, и, конечно, найдутся обходные пути для тех, кто любит свой SEO.
Оптимизация изображения SEO в настоящее время является проблемой.
Мы надеемся, что когда Гутенберг начнет процесс оптимизации изображений, это будет намного проще.
И если команда разработчиков Gutenberg не предоставит лучшего решения, я уверен, что внешние разработчики не будут готовы предложить действительно классные блочные решения.
У меня большой вопрос: «Совместимы ли страницы и публикации Гутенберга? AMP: ускоренные мобильные сайты?
Или более сложный функционал будет добавлен в пользу скорости.
