Ако използвате WordPress от доста години, тогава си спомняте, когато хората от WordPress пуснаха редактора Gutenberg в ^(Gutenberg)WordPress 5.0 през 2018 г.

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

Някои собственици на уебсайтове го мразеха толкова много, че избягваха да надграждат до WordPress 5.0 и останаха с класическия редактор по подразбиране възможно най-дълго. Други собственици на уебсайтове приеха промяната заради нейната простота и лекота на използване.

Ако правите прехода и сте любопитни какво да очаквате, този урок за WordPress Gutenberg ще ви преведе през основните функции, които трябва да знаете и разберете. Това трябва да направи вашия преход възможно най-лесен.

Какво да очаквате в WordPress Gutenberg

Основното нещо, което трябва да знаете за редактора Gutenberg , е, че е базиран на блокове. Това означава, че всичко, което трябва да добавите, се управлява чрез блокове. Блоковете в Гутенберг^(Gutenberg) включват (но не се ограничават до):

• Параграф
• Заглавие
• Изображение
• Списък
• цитат
• код
• Предварително форматиран
• Издърпване на цитат
• Таблица

Има и няколко други усъвършенствани блока, които рядко се използват. Може да видите допълнителни блокове, ако инсталирате нови WordPress плъгини^{(new WordPress plugins)} в редактора.

Добавянето на блокове е толкова просто, колкото да изберете иконата + вдясно под последния блок, който сте добавили.

Избирането на някой от блоковете от изскачащия прозорец добавя този блок като следващата секция във вашата страница или публикация. 

Преди да стигнем до тези блокове, нека започнем отначало и да създадем нова публикация, използвайки Gutenberg в WordPress .

Създаване на публикации и добавяне на блокове

Добавянето на публикация остава непроменено от последната версия на WordPress . Просто^(Just) изберете Публикации^(Posts) от лявата лента за навигация и изберете Добавяне на ново^{(Add New)} под нея. 

Това ще отвори прозореца на редактора на публикации. Тук също всичко е различно. Ще видите редактора  на Gutenberg WordPress по подразбиране.^{(Gutenberg WordPress)}

Добавяне на блокови елементи^{(Block Items)} в редактора на Gutenberg^{(Gutenberg Editor)}

Можете да въведете заглавието на публикацията си в полето за заглавие. След това изберете иконата + вдясно, за да добавите първия блок.

Блокове на абзаци^{(Paragraph Blocks)}

Най-често срещаният първи блок, който хората добавят след заглавието, е блок на абзац. За да направите това, изберете параграф^(Paragraph) от изскачащия прозорец. 

Това ще вмъкне блоково поле, където можете да започнете да пишете първия абзац от публикацията си. Форматирането на блока абзац^(Paragraph) следва шрифта по подразбиране^{(the default font)} за блоковете абзаци на вашия сайт. 

Ето няколко съвета за добавяне на абзацни блокове в редактора на Gutenberg .

• Вашият параграф може да бъде толкова дълъг, колкото искате. Текстът автоматично ще се увие в следващия ред, точно както в класическия редактор.
• Ако натиснете Enter , редакторът на Gutenberg автоматично създава нов блок на абзаци, но той просто изглежда като втори абзац с прекъсване на абзаца.
• Маркирането на текст в абзаца ще покаже прозорец за форматиране, където можете да промените форматирането за този текст или да промените блока в списък или друг тип блок.
• Изберете трите точки и изберете Премахни блок,^{(Remove block)} за да изтриете абзац блок и да го замените с нещо друго.

Блокове с изображения^{(Image Blocks)}

Ако изберете блока Изображение^(Image) , ще видите поле Изображение^(Image) , където можете да изберете бутон Качване^(Upload) , за да качите изображение в публикацията си от вашия компютър. Изберете връзката Медийна библиотека^{(Media Library)} , за да използвате изображение от съществуващата си медийна библиотека, или Вмъкване от URL^{(Insert from URL)} за връзка към изображение от друг сайт.

Това ще вмъкне изображението в статията, където сте добавили новия блок за изображения . ^(Image)Ще забележите, че можете да въведете надписа за изображението директно под самото изображение.

Можете да използвате същите опции за форматиране на текста на надписа, както и на обикновения текст на абзаца.

Списък на блокове^{(List Blocks)}

Когато добавите нов блок и изберете Списък^(List) , той ще вмъкне списъчния блок в тази точка на статията.

Той ще покаже един куршум, но докато пишете и натиснете Enter , всеки нов куршум ще се появи, когато имате нужда от него.

Форматирането на списъка също следва стила и размера на шрифта, както са дефинирани от вашата тема^{(your theme)} , така че не се учудвайте, ако шрифтът в списъка ви изглежда различно от вашите блокове на абзаци.

Можете да маркирате текст в списъчния блок и ще видите опции за форматиране за този текст, ако искате да го промените. Тук не можете да промените стила на шрифта, но можете да удебелявате, да наклоните, да добавите хипервръзка или да промените изцяло типа на блока.

Други блокове^{(Other Blocks)}

Ако искате да видите всички налични блокове, изберете + , за да добавите блок, след това изберете Преглед на всички^{(Browse all)} , за да видите целия списък.

Този списък всъщност е доста дълъг. Всичко, което помните, че е налично в класическия редактор чрез неговата система от менюта, ще бъде включено тук. Те включват други често използвани блокове като:

• таблици
• Файлове и медии
• видеоклипове
• Етикетът „Още“.
• Прекъсвания на страници и разделители
• Уиджети като социални икони, облаци за етикети, календар^(calendar) и джаджи за приставки за WordPress
• Вграждане^(Embed) на код за социални сайтове, медийни сайтове като YouTube и Spotify и др

Други характеристики на Гутенберг

Не е нужно да се придържате към блоковете, които сте добавили, където и да сте ги добавили. Можете да превъртите назад в публикацията си и да изберете иконата + между всеки от съществуващите блокове. Това ще ви позволи да вмъквате нови блокове между съществуващите.

Вие също не сте заседнали с разположението на вашите блокове. В класическия редактор на WordPress не винаги е било лесно да премествате неща като изображения в други раздели на публикацията си, без понякога да объркате фоновото кодиране.

В Gutenberg движещите се елементи като изображения са толкова лесни, колкото да изберете блока и след това да изберете стрелките нагоре или надолу в лентата с изскачащо меню, за да преместите блока нагоре или надолу в публикацията.

Всеки път, когато изберете стрелката, тя ще плъзга този блок на една позиция в посоката, която сте избрали.

Използване на редактора на Glutenberg^{(Glutenberg Editor)} в WordPress

Зоната за публикации не е единственото място за добавяне на нови блокове. Ще забележите, че има много просто меню с икони в горната част на редактора, където можете да използвате иконата + , за да добавяте и блокове.

Другите икони в това меню ви дават бърз достъп до други функции на Gutenberg .

• Иконата за редактиране^(Edit) на писалка ви позволява да превключите към режим на избор, за да избирате по-лесно блокове. Щракнете двукратно върху^{(Double-click)} блок, за да се върнете в режим на редактиране^(Edit) .
• Иконите^(Undo) за отмяна или повторение^(Redo) (извити стрелки наляво и надясно) ще отменят или повторят последната ви редакция.
• Иконата i (Подробности) ви показва броя на знаците, думите, заглавията, абзаците и блоковете във вашата публикация.
• Иконата Outline ви позволява бързо да навигирате до блокове във вашата публикация въз основа на реда им в контура на публикацията.

За много хора редакторът на Gutenberg в ^(Gutenberg)WordPress изисква известно време да свикнат. Но след като изпитате колко лесно е да създавате, редактирате и манипулирате блокове от елементи във вашите публикации, ще откриете, че вашият процес на създаване на публикации и страници е по-бърз и по-продуктивен.

WordPress Gutenberg Tutorial: How to Use the New Editor

If you’ve beеn using WordPress for quite a few years, thеn you remember when the fоlks at WordРress rolled out the Gυtenberg editor in WordPress 5.0 back in 2018.

This new default editor was a major overhaul for editing both posts and pages on your site. It transformed the large text box that website owners were accustomed to into a very different block-based editing platform.

Some website owners hated it so much that they avoided upgrading to WordPress 5.0 and stayed with the classic default editor as long as possible. Other website owners embraced the change for its simplicity and ease-of-use.

If you’re making the transition and are curious what to expect, this WordPress Gutenberg tutorial will walk you through the main features you need to know and understand. This should make your transition as easy as possible.

What to Expect in WordPress Gutenberg

The main thing to know about the Gutenberg editor is that it’s block based. This means anything you need to add is managed via blocks. Blocks in Gutenberg include (but are not limited to):

• Paragraph
• Header
• Image
• List
• Quote
• Code
• Preformatted
• Pullquote
• Table

There are also a few other advanced blocks that are rarely used. You may see additional blocks if you install new WordPress plugins to the editor.

Adding blocks is as simple as selecting the + icon to the right under the most recent block you’ve added.

Selecting any of the blocks from the pop-up window adds that block as the next section in your page or post. 

Before we get to these blocks, let’s start from the beginning and create a new post using Gutenberg in WordPress.

Creating Posts and Adding Blocks

Adding a post remains unchanged from the last version of WordPress. Just select Posts from the left navigation bar, and select Add New underneath it. 

This will open the post editor window. This is also where everything is different. You’ll see the default Gutenberg WordPress editor. 

Adding Block Items in the Gutenberg Editor

You can type the title for your post in the title field. Then select the + icon on the right to add the first block.

Paragraph Blocks

The most common first block people add after the title is a paragraph block. To do this, select Paragraph from the pop-up window. 

This will insert a block field where you can start typing the first paragraph of your post. Formatting for the Paragraph block follows the default font for your site’s paragraph blocks. 

Here are some tips for adding paragraph blocks in the Gutenberg editor.

• Your paragraph can be as long as you like. The text will automatically wrap into the next line, just like in the classic editor.
• If you press Enter, the Gutenberg editor automatically creates a new paragraph block, however it just looks like a second paragraph with a paragraph break.
• Highlighting any text in the paragraph will show a formatting window where you can alter the formatting for that text, or modify the block into a list or some other block type.
• Select the three dots and select Remove block to delete a paragraph block and replace it with something else.

Image Blocks

If you select the Image block, you’ll see an Image box where you can select an Upload button to upload an image into your post from your computer. Select the Media Library link to use an image from your existing media library, or Insert from URL to link to an image from another site.

This will insert the image into the article where you added the new Image block. You’ll notice that you can type the caption for the image directly under the image itself.

You can use the same formatting options on the caption text as you can on the regular paragraph text.

List Blocks

When you add a new block and select List, it’ll insert the list block at that point in the article.

It’ll show one bullet, but as you type and press Enter, each new bullet will appear as you need them.

List formatting also follows the font style and size as defined by your theme, so don’t be surprised if the font in your list looks different than your paragraph blocks.

You can highlight text in the list block and you’ll see formatting options for this text if you want to change it. You can’t change the font style here, but you can bold, italics, add a hyperlink, or change the block type entirely.

Other Blocks

If you want to see all the blocks that are available, select + to add a block, then select Browse all to see the entire list.

This list is actually quite long. Anything you remember being available in the classic editor via its menu system will be included here. These include other commonly used blocks like:

• Tables
• Files and media
• Videos
• The “More” tag
• Page breaks and separators
• Widgets like social icons, tag clouds, calendar, and WordPress plugin widgets
• Embed code for social sites, media sites like YouTube and Spotify, and more

Other Gutenberg Features

You don’t have to stick with the blocks you’ve added wherever you added them. You can scroll back up in your post and select the + icon between any of the existing blocks. This will let you insert new blocks between existing ones.

You also aren’t stuck with the placement of your blocks either. In the classic WordPress editor, it wasn’t always easy moving things like images to other sections of your post without sometimes messing up the background coding.

In Gutenberg, moving elements like images is as simple as selecting the block and then selecting the up or down arrows in the pop-up menu bar to move the block up or down in the post.

Each time you select the arrow it’ll slide that block one position in whatever direction you’ve selected.

Using the Glutenberg Editor in WordPress

The post area isn’t the only place to add new blocks. You’ll notice there’s a very simple icon menu at the top of the editor where you can use the + icon to add blocks as well.

The other icons in this menu give you quick access to other Gutenberg features.

• The pen Edit icon lets you switch to select mode to more easily select blocks. Double-click a block to go back to Edit mode.
• Undo or Redo icons (left and right curved arrows) will undo or redo your last edit.
• The i (Details) icon shows you the number of characters, words, headings, paragraphs, and blocks in your post.
• The Outline icon lets you quickly navigate to blocks in your post based on their order in your post outline.

For many people, the Gutenberg editor in WordPress does take some getting used to. But after experiencing how easy it is to create, edit, and manipulate blocks of elements in your posts, you’ll find that your process of creating posts and pages is faster and more productive.

Related posts

• 9 задължителни плъгини за нови инсталирания на WordPress

• Как да преминете от класическия редактор на WordPress към Гутенберг

• Как да скриете бързи връзки на страница с нов раздел в Edge с помощта на редактора на системния регистър

• Как да преместите WordPress сайт от един хост на друг

• Как да инсталирате и настроите WordPress на Microsoft Azure

• Как да намерите своя вход за администратор на WordPress

• Как да инсталирате тестов сайт на WordPress на вашия компютър

• WordPress Jetpack: Какво е това и заслужава ли си да инсталирате?

• Squarespace срещу WordPress: Коя е по-добрата платформа за сайт?

• Как да ускорите всеки WordPress сайт с помощта на .HTACCESS

• Как да дублирате страница в WordPress

• Пренасочване на потребителите от 404 страница в WordPress

• Защитете и защитете уебсайта на WordPress от хакери

• 11 най-добри WordPress подкаст плъгини

• Wix срещу WordPress: Кое е най-доброто за създаване на вашия уебсайт?

• Как да настроите свой собствен уебсайт, подобен на Twitter, като използвате тема P2 на WordPress

• Как да използвате Lumen5, за да превърнете публикацията си в блог във видео

• Как да промените URL адреса си за вход в WordPress за по-добра сигурност

• Какво е AMP за WordPress и как да го инсталирам

• Как да ускорите WordPress сайт в 11 стъпки