Публикувано: Обновено:
Почти всеки сайт на тази платформа започва от готова тема. След това идва въпросът как да я направите своя: с вашето лого, цветове, шрифтове и подредба. Платформата дава няколко начина, а правилният зависи от темата, която ползвате.
Персонализиране на WordPress означава да промените вида и подредбата на сайта: лого, цветове, шрифтове, меню, начална страница и шаблони. При блокова тема това става визуално в Site Editor, при класическа тема в Customizer или с конструктор на страници, а по-дълбоките промени се правят с код в child theme.
Пишем от гледната точка на екипа на CreateWeb: правим сайтове с WordPress от 2018 г., екип от шестима души. Ползваме блоковия редактор и Elementor, затова описваме и двата пътя. В статията няма измислени статистики.
Как да персонализирам WordPress тема без програмиране от административния панел
Без програмиране персонализирате WordPress през административния панел: Site Editor при блокова тема или Customizer при класическа тема. И в двата случая промените се виждат веднага, преди да ги запазите.
Първо проверете какъв тип е темата ви. В админ панела отидете в „Външен вид“. Ако виждате „Редактор“ (Editor), темата е блокова. Ако виждате „Персонализиране“ (Customize), темата е класическа.
| Тип тема | Къде се персонализира | Какво променяте |
|---|---|---|
| Блокова тема | Външен вид → Редактор (Site Editor) | шаблони, хедър, футър, стилове, меню, шрифтове |
| Класическа тема | Външен вид → Персонализиране | лого, цветове, меню, джаджи, част от оформлението |
| Тема с конструктор | Elementor или друг конструктор | всяка страница визуално, с плъзгане на елементи |
Официалната документация уточнява, че Site Editor е достъпен само когато е активна блокова тема. Отваря се от „Външен вид“ → „Редактор“ и позволява да управлявате шаблони, части от шаблона като хедър и футър, стилове, навигация, шаблони за многократна употреба (patterns) и страници (WordPress.org, Site Editor).
За повечето промени не са нужни специални технически умения. Затова Site Editor и Customizer са удобни и за начинаещи. Нужни са малко търпение и резервно копие преди по-големи промени.
Когато отворите редактора, кликнете върху елемента, който искате да промените. Вдясно се отваря панел с настройките на избрания блок: цвят, размер, отстояния, подравняване. Така създавате оформлението визуално, без да пишете код.
Как да променя дизайна и оформлението на началната страница в WordPress
При блокова тема отворете шаблона на началната страница в Site Editor и подредете блоковете. При класическа тема изберете статична начална страница от настройките и я редактирайте в редактора или в конструктора.
Стъпка по стъпка за класическа тема:
- Създайте страница „Начало“ в „Страници“ → „Добави нова“.
- В „Настройки“ → „Четене“ изберете тя да се показва като начална.
- Редактирайте я в блоковия редактор или в конструктора на страници.
При блокова тема:
- Отворете „Външен вид“ → „Редактор“.
- Изберете шаблона за начална страница.
- Добавяйте, местете и махайте блокове: заглавия, снимки, колони, бутони.
- Запазете и прегледайте на телефон.
Проверката на мобилни устройства е задължителна. Секция, която изглежда добре на компютър, често е твърде дълга или с твърде малък текст на телефон.
Какво да има на началната страница на вашия сайт:
- ясно заглавие какво правите и за кого;
- основните услуги или продукти, с линк към всяка;
- бутон „Свържете се с нас“, видим без превъртане;
- доказателства: проекти, клиенти, отзиви, само реални;
- контакти и работно време.
Показване на последните публикации на началната страница има смисъл за блог. За фирмен сайт обикновено е по-полезно мястото да отиде на услугите и на начините клиент да ви пише.
Как да добавя лого, слоган, цветове и меню към WordPress сайт
Лого, име и слоган се задават в Site Editor (раздел за идентичност) или в Customizer. Цветовете и шрифтовете са в „Стилове“ при блокова тема, а главното меню се прави в блока за навигация или в „Външен вид“ → „Менюта“.
- Лого и слоган: при блокова тема можете да зададете име на сайта, слоган, лого и иконка на сайта; при класическа тема същото е в Customizer.
- Цветове: изберете основен цвят, цвят на фона и на линковете. Текстът трябва да се чете добре върху фона.
- Шрифтове: при блоковите теми шрифтове се добавят и управляват от редактора на стилове.
- Меню: подредете главното меню с най-важните страници: услуги, за нас, контакти.
- Иконка на сайта: малкото изображение в раздела на браузъра; квадратно, поне 512 на 512 пиксела по препоръката на WordPress.
Добрият визуален стил е последователен. Ползвайте 2 до 3 цвята и 1 до 2 шрифта в целия уебсайт. Повече цветове и шрифтове правят сайта да изглежда по-малко професионален.
Цветовете не са само въпрос на вкус. Указанията за достъпност на W3C (WCAG) изискват контраст поне 4,5:1 между обикновения текст и фона и 3:1 за голям текст (W3C, Understanding Contrast (Minimum)). Светлосив текст на бял фон изглежда елегантно, но често не минава този праг.
Как да персонализирам WordPress сайт с редактор за блокове, конструктор или плъгин
Блоковият редактор е вграден в системата и не изисква отделни плъгини. Конструкторът на страници (например Elementor) е плъгин с повече визуални функционалности, но добавя още един слой, който трябва да се обновява.
| Блоков редактор | Конструктор на страници | |
|---|---|---|
| Цена | безплатен, вграден | обикновено безплатна базова версия и платена Pro |
| Свобода в дизайна | добра, расте с всяка версия | много голяма |
| Зависимост | част от ядрото | отделен плъгин |
| Подходящ за | блогове, фирмени сайтове | сайтове с много индивидуални страници |
Ние ползваме и двата. Важното е да не смесвате няколко конструктора в един сайт, защото всеки добавя свой код и забавя зареждането. За сайт с много различни страници конструкторът дава повече свобода в дизайна. За лични блогове и прости фирмени сайтове вграденият редактор често стига. Подробно сравнение имаме в статията за конструктор на страници за WordPress.
Как да редактирам WordPress тема с custom код и какво е child theme
Промени с код (CSS, PHP) се правят в child theme: дъщерна тема, която наследява основната и пази вашите промени при обновяване. Ако редактирате файловете на основната тема директно, следващото обновяване ги изтрива.
Кога ви трябва код:
- промяна, която темата не предлага в настройките;
- нов шаблон за специфичен тип страница;
- функционалности, за които не искате да добавяте плъгин;
- custom типове съдържание, например „Проекти“ или „Екип“, с отделни полета.
Разработка с код има смисъл, когато промяната ще се ползва дълго. За единична корекция на цвят или отстояние стига полето за допълнителен CSS (Custom CSS).
Как се прави безопасно:
- Създайте child theme или я поискайте от разработчика.
- Добавяйте CSS в нея или в полето за допълнителен CSS.
- PHP промени правете на тестово копие, не на живия сайт.
- Пазете промените в система за версии или поне в резервно копие.
Редактирането на PHP в админ панела без копие е най-бързият начин сайтът да спре. Грешка в един ред може да блокира целия уебсайт.
Как да персонализирам вашия WordPress сайт безопасно: копия и плъгини
Преди всяка по-голяма промяна направете резервно копие, пробвайте на тестова среда и ползвайте само плъгини и теми от надеждни източници. След промяната проверете сайта на телефон и компютър.
Правила, които спазваме при всеки проект:
- Резервно копие преди промяна на тема, плъгини или код.
- Тестова среда за големи промени, ако хостингът я предлага.
- Плъгини само от официалния каталог или от проверени разработчици.
- Обновяване на плъгините и темата след проверка на съвместимостта.
- Отделен потребител с потребителско име и парола за всеки, който работи по сайта, с правата, които му трябват.
При нас тестът минава на копие на уебсайта, а промените отиват на живия сайт едва след проверка. Ако хостингът не предлага тестова среда, пак може да се направи копие на поддомейн.
Кой плъгин за копия да изберете, сравняваме в статията бекъп плъгин за WordPress. Как се разпределят правата, обясняваме в статията за потребителските роли в WordPress.
Как да избера между готова WordPress тема и персонализирана тема
Готовата тема е по-бърза и по-евтина за старт, но изглежда като много други сайтове. Индивидуалният дизайн отнема повече време, но следва вашия бранд и съдържание.
Готови шаблони има безплатни и платени. Безплатен вариант от официалния каталог е разумен за личен блог или тест на идея. За фирмен сайт или онлайн магазин е важно темата да е бърза, да се поддържа активно и да работи с плъгините, които ще ползвате, например WooCommerce.
При нас дизайнът на уебсайт минава през wireframe и макет за компютър и телефон, с до 3 кръга корекции, за 2 до 6 седмици. Повече има на страницата за дизайн на уебсайт.
Как да създам сайт с WordPress: домейн, хостинг, инсталация на WordPress от контролен панел и пускане
Нужни са домейн и хостинг, инсталация на WordPress, тема, основните плъгини, съдържание и проверка преди пускане. Персонализирането идва след като структурата на страниците е ясна.
Последователност от нулата:
- Изберете домейн и хостинг. Хостингът трябва да има удобен контролен панел, да поддържа актуална версия на PHP и да прави резервни копия. Критериите за избора на хостинг описваме в статията какво е хостинг.
- Направете инсталацията. Повечето хостинги имат инсталиране с един бутон от контролния панел на хостинга, така че инсталирате системата за минути.
- Влезте в администрацията с име и парола и сменете стандартните настройки.
- Изберете и инсталирайте тема.
- Инсталирайте само нужните плъгини: SEO, резервни копия, сигурност, форма за контакт.
- Създайте страниците и съдържанието.
- Персонализирайте дизайна: лого, цветове, шрифтове, меню.
- Проверете скоростта, мобилната версия и формите.
- Добавете сайта в Google Search Console, за да видите как търсачките го индексират.
Как скоростта влияе на класирането, обясняваме в статията за Core Web Vitals.
За вашия онлайн бизнес с продажби добавете WooCommerce и продуктови страници. Електронен магазин изисква и плащания, доставка и общи условия.
Колко струва изработката и поддръжката на WordPress уебсайт
При нас лендинг страница е от 1 000 €, фирмен или корпоративен сайт е от 1 500 до 8 000 €, а онлайн магазин е от 3 000 до 15 000 €. Поддръжката е от 39 до 179 € на месец без ДДС.
Цената на изработка на WordPress сайт зависи от броя страници и екрани в дизайна, функционалностите и интеграциите. Готовата тема с базова настройка излиза по-евтино от индивидуален дизайн.
В цената на фирмен сайт при нас влизат ръководител на проекта, UX/UI дизайн, обучение как да управлявате съдържанието и помощ при миграция. Текстовете и снимките ги дава клиентът. Срокът е до 12 седмици.
Поддръжката има 4 плана: Защита (39 €), Старт (69 €), Бизнес (99 €) и Премиум (179 €) на месец без ДДС. Те се различават по включените часове и времето за реакция. Персонализирането не свършва с пускането: всяка нова секция, страница или промяна в дизайна е работа, която трябва да се направи безопасно на вашия уебсайт. При магазин с WooCommerce поддръжката е +20 € на месец.
Подробно какво формира цената има в статията колко струва WordPress сайт. Какво включва грижата след пускането, описваме на страницата поддръжка на WordPress сайт.
Какви са предимствата и функционалностите на WordPress и за какви уеб сайтове е подходящ
WordPress е безплатна платформа за управление на съдържание (CMS) с хиляди теми и плъгини. Подходящ е за блогове, фирмени сайтове и онлайн магазини, когато искате пълен контрол и възможност да управлявате съдържанието сами.
Предимства:
- безплатен код и много разширения;
- пълен контрол над сайта и данните, на вашия сървър;
- много платформи и услуги работят с него;
- добра основа за SEO, ако темата и структурата са правилни.
WordPress стои зад много уебсайтове, от лични блогове до големи медии и магазини. Това означава, че за почти всяка нужда на вашия бизнес вече има тема, плъгин или разработчик, който го познава.
Изисквания: някой трябва да обновява системата и плъгините и да следи сигурността. Без това сайтовете остаряват бързо. Кога платформата е правилен избор и кога не, разглеждаме в статията как да изберете CMS, а как работи платформата, в статията какво е WordPress.
Често задавани въпроси
Кратки отговори на въпросите, които чуваме най-често за персонализиране на WordPress.
Какво е персонализиране на WordPress?
Промяна на вида и подредбата на сайта: лого, цветове, шрифтове, меню, начална страница и шаблони. Прави се визуално от админ панела или с код в child theme.
Как да разбера дали темата ми е блокова?
Отидете в „Външен вид“. Ако виждате „Редактор“, темата е блокова и имате Site Editor. Ако виждате „Персонализиране“, темата е класическа.
Трябват ли ми технически познания?
За лого, цветове, меню и подредба не трябват. За промени с код и нови шаблони са нужни технически познания или разработчик.
Какво е child theme и трябва ли ми?
Дъщерна тема, която пази вашите промени при обновяване на основната тема. Трябва ви, ако правите промени с код.
Мога ли да сменя темата, без да загубя съдържанието?
Съдържанието (страници, публикации, снимки) остава. Оформлението, менютата и част от настройките може да се променят, затова направете резервно копие и пробвайте на тестово копие.
По-добре ли е Elementor от блоковия редактор?
Зависи от сайта. Elementor дава повече визуална свобода в сравнение с вградения редактор, който пък работи без допълнителен плъгин. Ние ползваме и двата според проекта.
Може ли AI да персонализира WordPress сайт?
AI инструментите помагат с текстове, идеи и код, но решенията за дизайн, структура и съдържание пак трябва да ги провери човек.
Заключение: персонализирайте с ред и копие, с или без AI
Персонализирането на WordPress е лесно, когато знаете какъв е типът на темата: Site Editor за блокови теми, Customizer или конструктор за класически, child theme за код. Резервното копие преди всяка голяма промяна пази от неприятни изненади.
Нашето мнение е, че за фирмен сайт най-важно е персонализирането да следва бранда и съдържанието. Възможностите на темата са само средство. Започнете от лого, цветове, шрифтове и меню, а по-дълбоките промени оставете за момента, в който знаете точно какво ви трябва.
Ако искате да създадете нов сайт или да персонализирате вашия WordPress сайт с професионален дизайн, вижте как работим при изработка на уеб сайт или пишете ни.
