Как да добавите бутон в редактора на WordPress [урок]

Защо блокът с бутони на WordPress е толкова важен?

Навигацията в уебсайта е важна за посетителите и клиентите. Искаме да ги изпратим от една подстраница нататък. Да ги преведем през целия процес на пазаруване. Ето защо е важно правилно да вмъкнете важните връзки в съдържанието на страницата.

По принцип имаме 2 възможности. Използвайте стандартна връзка или бутон. Мненията за това кога да се използва първата и кога по-късната опция са различни. Обикновено на една страница има няколко възможни действия. Трябва да се уверим кое от тях е основно и кое е второстепенно. Препоръчваме ви да използвате бутон само за първичното действие. По този начин ще постигнете по-голяма видимост на това основно действие. Така ще насочите вниманието на посетителите към това действие. Можем също така да го наречем бутон за призоваване към действие. Не създавайте прекалено много бутони на една подстраница.

Какви са функциите на основните бутони?

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

Има много параметри, които определят успеха на бутона. Важни са например размерът, разположението или цветът на бутона. Необходимо е да се спазват стандартните принципи на UI и UX. Зеленият цвят се използва за бутони с положително действие, например за купуване на нещо. Червеният цвят е за отрицателно такова - например да се отпишете от бюлетина. Правилно проектираните бутони по този начин пряко влияят върху действията на посетителите.

Добавяне на бутон на всяка страница или публикация в WordPress

Ситуация преди WordPress 5

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

В по-старите ни теми за WordPress можете да добавите бутон с помощта на шорткъти във визуалния редактор. След като кликнете върху Insert Shortcode -> Button, можете да зададете различни настройки в модалния прозорец. Текст, цвят на текста, цвят на бутона, url, подравняване и т.н. Благодарение на тези разширени настройки можете да добавите бутон доста лесно и бързо, без да се налага да програмирате.

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

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

Стъпка по стъпка как да добавите бутон в редактора на WordPress

1. Първо трябва да решите къде искате да поставите бутона
2. Блокът с бутони може да бъде добавен по различни начини:
- като щракнете върху "+" в горната лента или където и да е в редактора на блокове, където избирате блок с бутони

- Можете също така да намерите всеки блок, като използвате лентата за търсене, просто напишете "бутон"

- като въведете "/", което ви дава достъп до всички налични блокове

3. Създаденият блок "Бутон" може да бъде конфигуриран допълнително

Добавяне на текст на бутона и URL адрес

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

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

Промяна на цвета на бутона

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

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

Намерете своя собствен стил на бутон

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

Редактиране на бутон с персонализиран CSS

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

Както виждаме, има много по-лесен начин от използването на шорткод за бутони. Блокът с бутони на WordPress може да се използва във всяка тема, която е съвместима с редактора на блокове на WordPress. Прочетете повече за нашата чисто нова тема за WordPress Citadela. Тя е специално проектирана и разработена за WordPress Block Editor.

Допълнителен съвет в края

Не забравяйте да наблюдавате успеха на блока с бутони на WordPress и самия бутон. Ако използвате Google Analytics, можете да създадете уникален URL адрес. За да проследите кликванията на посетителите, можете да добавите Параметър UTM на Google. URL адресът може да бъде създаден с помощта на конструктора на URL адреси. Добавянето на параметри ви позволява да определите източника на посещението. Това е много полезно, ако искате да знаете откъде посетителите са дошли на вашата страница за пазаруване.

Какъв е най-големият проблем, който имате в момента с блока с бутони на WordPress? Нека да обсъдим това в коментарите по-долу. Споделете своя опит с използването на бутони в уебсайта.