Най-добрите оригинални блокове за WordPress [Бърз преглед]

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

Когато WordPress обяви новия редактор Gutenberg през 2018 г., ние бяхме развълнувани от него. Сега, няколко години по-късно, виждаме огромно подобрение. Редакторът Gutenberg на WordPress е чудесен инструмент за създаване на уебсайт.

С AitThemes CitadelaWP плъгини, можете да създадете специфично съдържание за представяне на уебсайт на компания, бизнес, блог или сайт с нестопанска цел. Или дори да започнете нов онлайн бизнес. Скоростта на уебсайта и лекотата на редактиране на уебсайта са най-важните фактори.

Какво е блок?

Блоковете на Gutenberg в WordPress са градивни единици на уебсайта. Всеки от тях има свое специално място и предназначение. Много е важно да използвате правилния блок на WordPress за определен тип съдържание.

Но как да откриете най-подходящия блок, който да отговаря на намеренията ви?

За да ви помогнем да разберете по-добре блоковете на WordPress, подготвихме този преглед на най-популярните от тях.

Блокове за текстово съдържание

Има няколко блока, които можете да използвате за вмъкване на текстово съдържание в уебсайта си. Можете да използвате няколко блока. От WordPress 5.4 има нова настройка, с която можете да променяте цвета на текста.

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

Освен това използвате блок Classic, който може да е по-удобен за дълъг параграф.

Блок с бутони

Създаването на завладяващ CTA бутон в WordPress става изключително лесно с блока Button. Не е необходимо да въвеждате потребителски CSS или да разбирате HTML. Можете - но не е задължително - да въведете шестнадесетичния код на любимия си цвят, за да направите бутона да изглежда красив и привличащ вниманието.

Къде да използваме блок с бутони?

След като посетителят на уебсайта ви стигне до него, трябва да го насърчите да предприеме действия. Именно за това служат бутоните CTA.

Като цяло има 3 места, където трябва да използвате блока с бутони на WordPress:

• Начална страница - за извършване на действие, което ще доведе до изпълнение на целта ви, като например да се абонирате за бюлетин, да откриете специална оферта или да се регистрирате за безплатна пробна версия.
• Продуктова страница - в зависимост от начина на водене на продуктовата страница може да има 1 CTA бутон (КУПИ) или повече бутони, например подробности за продукта, купи, добави в списъка с желания и т.н.
• Блог - бутоните CTA могат да препращат към друга полезна статия или покупка на ваш продукт/услуга.

Настройки на блока с бутони

В Инспектора, от дясната страна, можете лесно да управлявате настройките на бутона:

• Стил
• Фонов цвят
• Цвят на шрифта
• Граница

Текстът, написан в бутона CTA, трябва да бъде кратък и ясен, като насърчава действието, което искате да предприемат посетителите на уебсайта.

Новини, които ще се появят в следващата версия на WordPress 5.4 (версия 31 март 2020 г.)

Блокът Button ще бъде заменен с нов Buttons блок.
От новото име може да се предположи, че ще можете да създавате повече бутони един до друг в един блоков контейнер. Често се налага да се създават по два CTA едновременно, например: Купете сега и Прочетете повече. Освен това ще се появят някои нови настройки на стила и цвета. Изберете стила Fill (Запълване) или Outline (Контур) и след това цвета на фона. Можете да изберете Solid (Плътен) или Gradient (Градиент) фон. Ще бъдат налични някои предварителни настройки като отправна точка за по-безпроблемна фина настройка. Добрата новина е, че всички съществуващи блокове с бутони ще работят и няма да е необходимо да ги мигрирате.

Блок Колони

Блокът Columns е невероятен блок на WordPress, който отваря врати за нови оформления. Той ви дава повече възможности за подреждане на елементите на страницата, което води до повече алтернативи за дизайн.

Работата с блока Columns е лесна:

• Няма допълнителна инсталация на плъгини.
• Не се изисква кодиране.
• Нужен е само малко усет за изчистен дизайн.

В сравнение с предишните трудности, през които трябваше да преминете преди пускането на блоковия редактор на WordPress, използването на блока Columns WordPress е изключително лесно.

Как да използвате блока Columns?

Както е посочено по-горе, блокът Columns може да се използва по два начина:

• Организиране на потока от текстове (в публикация в блога или в обикновена страница).
• Подреждане на други блокове в колони.

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

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

Настройки на блоковете за колони

След като вмъкнете блок "Колони" в страницата, изберете колко колони искате. Те могат да бъдат от 2 до 6 колони. След това можете да започнете да въвеждате текста си или да добавяте блокове във всяка колона.

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

Покривен блок

Нека да поговорим за заглавието на вашия уебсайт. Това е разделът, който определя първото впечатление, когато някой дойде на началната ви страница. Доста важно, нали? А знаете ли, че блокът Cover може да се използва като заглавие на всяка ваша страница?

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

Къде да използвате Cover block?

Както беше споменато по-горе, блокът Cover може да се използва на всяка ваша страница. Освен това той може да бъде добавен навсякъде в страницата, за разлика от заглавието на уебсайта ви, което е фиксирано в горната част на уебсайта ви.

Покривният блок може да се използва като:

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

Настройки на блока за покриване

Настройката на блока за покритие е много проста. Първо, изберете изображение или видеоклип за фон. Вместо това можете да използвате и един цвят. След като сте настроили фона, добавете заглавие и подзаглавие. 

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

Подравняването на блока на корицата предлага следните опции:

• Подравняване вляво
• Център за подравняване
• Подравняване надясно
• Широка ширина
• Пълна ширина

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

От WordPress 5.4 можете да изберете градиентен фон вместо плътен.

Блок на галерията

Представете изображенията в уебсайта си с помощта на блок Галерия. Този стандартен блок на WordPress е създаден, за да съхранява вашите изображения и да ги показва добре на всяка страница на вашия уебсайт. Подобно на другите блокове на WordPress, блокът "Галерия" може да бъде позициониран навсякъде в уебсайта или в рамките на публикация в блог.

Качването на изображенията може да се извърши чрез избиране на файлове от мултимедийната библиотека, от компютъра или чрез функцията drag&drop.

Къде да използвате блок "Галерия"?

В зависимост от вида на уебсайта си може да искате да създадете сложна фотогалерия или просто представяне на изображения. Можете да използвате блок "Галерия" на:

• Вашата начална страница
• Отделни подстраници, създадени като албуми на вашата фотогалерия
• Продуктови страници
• Блогпост

Настройки на блока "Галерия

Освен различните опции за подравняване на самия блок "Галерия", в този блок има няколко интересни опции, като например:

• Брой на колоните, в които се подреждат изображенията.
• Изрязване на изображението, за да съответства на същия размер (на най-малкото изображение).
• Хипервръзка, за да ви даде възможност за свързване към друга страница или мултимедиен файл.

Блок с изображения

Блокът за изображения не е нищо друго освен блок за показване на изображение на вашия уебсайт.

Точно така. Ако просто искате да добавите изображение към някоя от страниците си, трябва да използвате блока Image WordPress. Той може да е подобен на други представени блокове, но има съществени разлики, които го правят идеален за единични изображения.

Кога да използвате Image block?

Блокът с изображения трябва да се използва особено когато обектът, показан на изображението, е особено важен за посетителя на уебсайта, който искате да:

• Привлечете вниманието на уеб посетителите с конкретно изображение.
• Показване на изображение с надпис.
• Покажете инфографики, които помагат на посетителите да разберат по-добре обсъжданата тема.

Настройки на блока с изображения

Едно от най-големите предимства на блока "Изображение" в WordPress е възможността за избор на размер на изображението. Можете лесно да промените размера на изображението, като го издърпате за ъгъла му, да изберете фиксиран размер в пиксели или да определите размера в проценти.

Друга важна опция са полетата за въвеждане на алтернативен текст, надпис и връзка. Силно препоръчвам използването на тези полета, тъй като те играят важна роля в SEO оптимизацията на страницата.

Медиен и текстов блок

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

Къде да използваме медиен и текстов блок?

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

Не забравяйте да добавите блок с бутони към текстовия раздел на блока "Медии и текст", ако се използва като преглед на продукта/услугата. По този начин можете да създадете хубава CTA секция на всяка страница.

Предимства на медийния и текстовия блок

• Съчетаване на изображение и текст, които си пасват контекстуално.
• Избягване на неправилно поставяне на изображение в блога.
• Подпомагане на отзивчивостта на сайта (използвайте функцията "Подреждане за мобилни устройства").

Настройки на медийни и текстови блокове

Когато разглеждате настройките на блока "Медии и текст", ще забележите доста опции за подравняване, като някои от тях са уникални в сравнение с повечето други блокове.

Интересна и полезна настройка на този блок е цветът на фона. Като оцветите областта около изображението и текста, които си пасват, можете визуално да подчертаете тяхната връзка.

Вмъкване на връзка от WordPress версия 5.4 (31.3.2020). Можете да изберете връзка, медиен файл или страница с прикачени файлове.

Блок за маса

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

Къде да използвате блок за маса?

Таблиците играят огромна роля в предоставянето на полезно съдържание по добре подреден и прозрачен начин. Със сигурност повечето уебсайтове използват таблици. Ето само няколко примера за използване на таблици в различни уебсайтове:

• Сравнение на данните
• Таблици за ценообразуване
• Технически данни за продукта
• Рецепти
• Преглед на пакетите за членство

Наличието на блок с таблици като част от безплатното ядро на WordPress е наистина невероятно.

Настройки на блоковете на таблицата

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

След това изберете стила на масата си: по подразбиране или на райета. Преминете към подравняване и стил на шрифта и накрая попълнете таблицата си, преди да добавите финален щрих към нея.

Другите опции включват:

• Фонов цвят
• Клетки с фиксирана ширина
• Заглавие
• Футер
• Връзка (текстът в таблицата може да съдържа връзки към други страници)

Кой блок бихте искали да видите след това?

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