15%

Спести 15% на всички хостинг услуги

Тествай уменията си и получи Отстъпка за всеки хостинг план

Използвайте код:

Skills
За начало
21.10.2024

Как да използвате стартови шаблони в WordPress за изграждане на всеки сайт, който ви е необходим

Стартиращите шаблони в WordPress са предварително изградени, напълно проектирани оформления на страници, които можете да импортирате в сайта си с едно кликване, предоставяйки ви пълна визуална структура — хедъри, футъри, вътрешни страници, типография и цветови схеми — без да пишете нито един ред код. Те са включени в теми като Astra, Neve, Kadence и OceanWP и са достъпни чрез допълнителни плъгини, които се свързват с библиотека от дизайни, специфични за различни индустрии.

Практическата стойност е значителна: вместо да изграждате начална страница от нулата, импортирате шаблон, подходящ за вашата ниша (SaaS продукт, адвокатска кантора, WooCommerce магазин, портфолио), след което заменяте примерното съдържание с вашето собствено. Целият процес — от чиста WordPress инсталация до стилизиран, многостраничен сайт — може да отнеме под 30 минути, при условие че хостинг средата ви е правилно конфигурирана.

Какво ви е необходимо преди да започнете

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

Минимални изисквания за PHP и памет:

  • PHP 7.4 или по-висока версия (препоръчва се PHP 8.1+ за съвременни теми)
  • memory_limit зададен на поне 256 MB в php.ini
  • max_execution_time от 300 секунди или повече
    upload_max_filesize и post_max_size и двете на 64 MB или по-високо
    
    Ако използвате план за VPS Хостинг, можете да редактирате тези стойности директно в /etc/php/8.1/fpm/php.ini (коригирайте пътя на версията, за да съответства на вашия стек) и да презаредите PHP-FPM:
    sudo nano /etc/php/8.1/fpm/php.ini
    # Set: memory_limit = 256M, max_execution_time = 300
    sudo systemctl reload php8.1-fpm
    В споделени среди тези ограничения често се задават чрез контролния панел на хостинга. Ако използвате план за Споделен Уеб Хостинг, проверете секцията за конфигурация на PHP в cPanel или се свържете с поддръжката, за да увеличите ограниченията преди да опитате пълно импортиране на сайта.
    SSL се препоръчва настоятелно преди стартиране. Импортирането на шаблон по HTTP и последващото преминаване към HTTPS причинява проблеми със смесено съдържание при вградени изображения и скриптове. Конфигурирайте вашия SSL Сертификат преди да стартирате импортирането.
    Стъпка 1: Изберете тема, която поддържа стартиращи шаблони
    Не всяка WordPress тема се доставя с библиотека от шаблони. Следните четири са най-зрелите екосистеми, всяка с стотици шаблони и активно развитие:
    
    
    
    Тема
    Размер на библиотеката с шаблони
    Съвместимост с конструктор на страници
    Лека база (KB)
    Безплатен план
    
    
    
    
    
    
    
    
    —
    —
    —
    —
    —
    
    
    
    
    
    
    
    
    **Astra**
    250+ шаблона
    Elementor, Gutenberg, Beaver Builder, Brizy
    ~50 KB
    Да
    
    
    
    
    
    
    
    
    **Neve**
    100+ шаблона
    Elementor, Gutenberg, Brizy
    ~30 KB
    Да
    
    
    
    
    
    
    
    
    **Kadence**
    100+ шаблона
    Gutenberg (нативен), Elementor
    ~40 KB
    Да
    
    
    
    
    
    
    
    
    **OceanWP**
    50+ шаблона
    Elementor, Gutenberg
    ~60 KB
    Да
    
    
    
    
    
    Astra е най-широко използваната опция и има най-дълбока интеграция с Elementor. Kadence е най-добрият избор, ако искате да останете изцяло в нативния блоков редактор Gutenberg и да избегнете зависимост от конструктор на страници на трета страна. Neve е най-оптимизираната за производителност от кутията.
    За да инсталирате избраната от вас тема:
    
    Влезте в таблото на WordPress.
    Отидете на Appearance > Themes.
    Кликнете Add New, потърсете темата по име.
    Кликнете Install, след това Activate.
    
    Стъпка 2: Инсталирайте плъгина за стартиращи шаблони
    Всяка тематична екосистема използва малко по-различен плъгин, за да предостави достъп до своята библиотека с шаблони. Таблицата по-долу свързва темите с техните допълнителни плъгини:
    
    
    
    Тема
    Име на плъгина
    Идентификатор в WordPress.org
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    Astra
    Starter Templates
    `astra-sites`
    
    
    
    
    
    
    
    
    Neve
    Neve Pro / Otter Blocks
    `otter-blocks`
    
    
    
    
    
    
    
    
    Kadence
    Kadence Starter Templates
    `kadence-starter-templates`
    
    
    
    
    
    
    
    
    OceanWP
    Ocean Extra
    `ocean-extra`
    
    
    
    
    
    За Astra (най-разпространеният работен процес):
    
    Отидете на Plugins > Add New.
    Потърсете Starter Templates.
    Инсталирайте и активирайте плъгина с име Starter Templates – Elementor, Gutenberg & Beaver Builder Templates.
    
    След активиране се появява нов елемент от менюто под Appearance > Starter Templates.
    Критичен краен случай: Ако мигрирате съществуващ сайт и вече имате съдържание, не стартирайте пълно импортиране на сайта. То ще презапише съществуващите ви страници, менюта и уиджети. Използвайте вместо това Import Single Page или Import Home Template и ръчно обединете необходимите ви дизайнерски елементи.
    Стъпка 3: Изберете и импортирайте стартиращ шаблон
    След активиране на плъгина, съветникът за импортиране се стартира автоматично или е достъпен чрез Appearance > Starter Templates.
    Работен процес:
    
    Изберете вашия конструктор на страници. Съветникът пита дали искате да използвате Elementor, Gutenberg или Beaver Builder. Този избор е постоянен за импортирането — не можете да смесвате конструктори в рамките на едно импортиране на шаблон. Изберете Gutenberg, ако искате по-лека настройка без плъгини; изберете Elementor, ако имате нужда от разширена гъвкавост при плъзгане и пускане.
    
    
    Филтрирайте по категория. Шаблоните са организирани по индустрия (Бизнес, eCommerce, Агенция, Ресторант, Портфолио, Образование и др.). Използвайте лентата за търсене за филтриране по ключови думи.
    
    
    Прегледайте преди импортиране. Кликнете върху миниатюрата на всеки шаблон, за да отворите жив преглед. Прегледайте вътрешните страници (За нас, Контакти, Блог) — не само началната страница — защото началната страница често изглежда изпипана, докато вътрешните страници са оскъдни.
    
    
    Изберете обхвата на импортирането:
    
    
    Import Complete Site — импортира всички страници, публикации, менюта, уиджети и настройки на персонализатора на темата. Най-подходящо за нови сайтове.
    Import Home Template — импортира само оформлението на началната страница. Най-подходящо за съществуващи сайтове, където искате да обновите само началната страница.
    
    
    Потвърдете импортирането. Плъгинът ще изтегли демо съдържание, изображения (от Unsplash или CDN на плъгина) и настройки на персонализатора. При по-бавни връзки или рестриктивни сървъри, това може да отнеме 60–90 секунди.
    
    Какво се импортира и какво не:
    
    
    
    Актив
    Импортиран
    Бележки
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    Оформления на страници
    Да
    Всички страници в демото
    
    
    
    
    
    
    
    
    Демо изображения
    Да
    Примерни изображения от Unsplash CDN
    
    
    
    
    
    
    
    
    Плъгини (WooCommerce и др.)
    При подкана
    Инсталаторът на плъгини се изпълнява като част от съветника
    
    
    
    
    
    
    
    
    Вашите съществуващи публикации/страници
    Не
    Съществуващото съдържание не се изтрива, освен ако не изберете „Delete Previously Imported Data”
    
    
    
    
    
    
    
    
    Настройки на персонализиран домейн/DNS
    Не
    Трябва да се конфигурират отделно
    
    
    
    
    
    
    
    
    SSL сертификат
    Не
    Трябва да бъде предварително конфигуриран
    
    
    
    
    
    Стъпка 4: Персонализирайте шаблона
    Използване на редактора Elementor
    Отидете на Pages, задръжте курсора върху която и да е страница и кликнете Edit with Elementor. Визуалният редактор се отваря с импортираното оформление, напълно готово за редактиране.
    Основни действия за персонализиране:
    
    Замяна на изображения: Кликнете върху произволен уиджет за изображение, след това кликнете върху миниатюрата на изображението в левия панел, за да отворите медийната библиотека. Заменете демо изображенията с вашите собствени активи.
    Редактиране на текст на място: Кликнете директно върху произволен текстов елемент, за да го редактирате на място.
    Глобални цветове и шрифтове: В Elementor отидете на Site Settings > Global Colors и Global Fonts, за да дефинирате палитрата на вашата марка и типографската система в целия сайт. Промяната на глобален цвят актуализира всеки елемент, който го референцира, на всички страници едновременно.
    Структура на секции и колони: Кликнете с десния бутон върху произволна секция, за да я дублирате, изтриете или преместите. Използвайте панела Navigator (иконата на слоеве в долната лента с инструменти) за сложни оформления с вложени секции.
    
    След редактиране кликнете Update (не Publish — страницата вече е публикувана; Update запазва промените ви).
    Използване на блоковия редактор Gutenberg
    Отидете на Pages, кликнете Edit на целевата страница. Блоковият редактор се отваря с импортираното оформление, базирано на шаблони.
    Основни действия за персонализиране:
    
    Кликнете върху произволен блок, за да го изберете. Използвайте лентата с инструменти над блока за опции за подравняване, цвят и форматиране.
    Използвайте List View (иконата с наредени линии в горната лента с инструменти), за да видите и навигирате пълната йерархия на блоковете — от съществено значение за сложни шаблони с вложени блокове Group и Cover.
    За да промените глобалните стилове, отидете на Appearance > Editor > Styles (теми с пълно редактиране на сайта) или Appearance > Customize (класически теми).
    Панелът Styles в редактора на сайта ви позволява да задавате глобална типография и цветови палитри, които се прилагат към всички блокове.
    
    Бележка за производителността: Шаблоните, базирани на Gutenberg, генерират по-чист HTML и се зареждат по-бързо от тези, базирани на Elementor, тъй като не изискват изпълнение на JavaScript за Elementor. За сайтове, при които Core Web Vitals са приоритет, пътят с Gutenberg е измеримо по-добър.
    Стъпка 5: Конфигурирайте глобалните настройки на темата
    След импортирането отворете Appearance > Customize, за да прецизирате глобалната дизайнерска система. Наличните панели варират в зависимост от темата, но всички основни теми за стартиращи шаблони предоставят:
    Типография:
    
    Задайте основното семейство шрифтове за заглавия (H1–H6) и основен текст.
    Дефинирайте размери на шрифтовете, височини на редовете и разстояния между буквите глобално.
    Използвайте системни шрифтове (-apple-system, BlinkMacSystemFont, sans-serif) или избор от Google Fonts. Системните шрифтове елиминират външна HTTP заявка и подобряват LCP резултатите.
    
    Цветове:
    
    Дефинирайте основен цвят (акцент на марката), вторичен цвят, цвят на текста и цвят на фона.
    Тези стойности попълват CSS персонализирани свойства (--wp--preset--color--primary), към които всички импортирани блокове и уиджети се референцират.
    
    Оформление:
    
    Задайте глобалната ширина на контейнера (обикновено 1200px–1440px за съвременни дизайни).
    Конфигурирайте оформлението на хедъра: фиксиран хедър, прозрачен хедър при превъртане, поведение на мобилното меню.
    Конфигурирайте колоните на футъра, областите за уиджети и текста за авторски права.
    
    Специфично за Astra: Персонализаторът на Astra има панел Performance, където можете да деактивирате зареждането на Google Fonts (полезно, ако самостоятелно хоствате шрифтове за съответствие с GDPR) и да активирате минификация на CSS.
    Стъпка 6: Заменете примерното съдържание
    Демо съдържанието на шаблоните е умишлено общо. Систематичната замяна е по-бърза от редактирането страница по страница:
    
    Отидете на Pages и сортирайте по Date, за да намерите всички страници, импортирани по време на настройката на шаблона.
    Отворете всяка страница и заменете:
    
    
    Заглавията и основния текст с вашето действително съдържание.
    Демо изображенията с ваши собствени снимки или лицензирани стокови изображения. Използвайте описателен alt текст за всяко изображение.
    Примерните телефонни номера, адреси и имейл адреси.
    Демо навигационните връзки — проверете Appearance > Menus, за да се уверите, че всички елементи от менюто сочат към реални страници.
    
    
    Актуализирайте Site Title и Tagline под Settings > General.
    Задайте вашата Homepage и Blog page под Settings > Reading.
    
    Критична стъпка за SEO: След замяна на съдържанието, инсталирайте Yoast SEO или Rank Math и задайте уникално мета заглавие и мета описание за всяка страница. Импортирането на шаблони не попълва SEO метаданни.
    Стъпка 7: Разширете функционалността с плъгини
    Стартиращите шаблони осигуряват дизайнерска скеля, а не функционалност. В зависимост от типа на вашия сайт, ще ви трябват допълнителни плъгини:
    
    
    
    Тип сайт
    Препоръчан плъгин
    Предназначение
    
    
    
    
    
    
    
    
    —
    —
    —
    
    
    
    
    
    
    
    
    eCommerce
    WooCommerce
    Каталог с продукти, количка, плащане
    
    
    
    
    
    
    
    
    Генериране на потенциални клиенти
    WPForms или Contact Form 7
    Форми за контакт и запитвания
    
    
    
    
    
    
    
    
    Членство
    MemberPress или Restrict Content Pro
    Съдържание с ограничен достъп
    
    
    
    
    
    
    
    
    SEO
    Rank Math или Yoast SEO
    SEO на страницата, карти на сайта, схема
    
    
    
    
    
    
    
    
    Производителност
    WP Rocket или LiteSpeed Cache
    Кеширане, минификация, мързеливо зареждане
    
    
    
    
    
    
    
    
    Сигурност
    Wordfence или Solid Security
    Защитна стена, сканиране за зловреден софтуер
    
    
    
    
    
    
    
    
    Резервно копие
    UpdraftPlus
    Автоматизирани резервни копия извън сайта
    
    
    
    
    
    Ако използвате WooCommerce, проверете дали вашият хостинг план може да се справи с допълнителното натоварване на базата данни. VPS с cPanel ви дава необходимото пространство за ресурси и интерфейс за управление, за да се справите с WooCommerce в мащаб без ограниченията на споделения хостинг.
    Стъпка 8: Преглед, тестване и стартиране
    Преди публикуване, преминете през този контролен списък преди стартиране:
    Визуален контрол на качеството:
    
    Прегледайте на десктоп, таблет и мобилно устройство, използвайки отзивчивия преглед на WordPress Customizer или DevTools на браузъра.
    Проверете дали на която и да е страница не са останали демо изображения.
    Проверете дали всички шрифтове са заредени правилно (ограничаването на мрежата в DevTools може да разкрие трептене при смяна на шрифтове).
    
    Функционално тестване:
    
    Изпратете всяка форма и потвърдете, че имейлът с уведомление пристига. Проверете конфигурацията на вашия Имейл Хостинг, ако транзакционните имейли не се доставят — стандартният wp_mail() на WordPress разчита на функцията mail() на PHP, която много хостове блокират. Използвайте SMTP плъгин (WP Mail SMTP, Post SMTP) с удостоверени идентификационни данни.
    Кликнете върху всяка навигационна връзка и бутон. Импортираните шаблони понякога съдържат твърдо кодирани демо URL адреси.
    Тествайте процеса на плащане, ако WooCommerce е активен.
    
    Базова линия на производителността:
    
    Стартирайте тест на PageSpeed Insights на началната страница. Стремете се към LCP под 2.5 секунди и CLS резултат под 0.1.
    Ако резултатите са лоши, активирайте кеширане, оптимизирайте изображенията (конвертирайте в WebP) и обмислете CDN.
    
    Сигурност:
    
    Уверете се, че HTTPS е наложен в целия сайт. Проверете дали в конзолата на браузъра няма предупреждения за смесено съдържание.
    Сменете потребителското име на администратора по подразбиране на WordPress, ако все още е admin.
    Задайте права на файловете: директории на 755, файлове на 644 и wp-config.php на 600.
    
    След като всички проверки преминат успешно, сайтът е готов. Ако все още е под временен домейн, актуализирайте WordPress Address (URL) и Site Address (URL) под Settings > General след насочване на вашия домейн. Можете да регистрирате или прехвърлите вашия домейн чрез Регистрация на домейн, ако все още не сте го направили.
    Чести грешки и как да ги избегнете
    Импортирането се проваля по средата на процеса: Обикновено се причинява от твърде ниски стойности на PHP memory_limit или max_execution_time. Увеличете тези стойности, както е описано в секцията с предварителни изисквания, след което опитайте импортирането отново.
    Демо изображенията не се зареждат след импортиране: Плъгинът Starter Templates изтегля изображения от външен CDN. Ако вашият сървър има ограничения за изходящ HTTP трафик или защитна стена, блокираща външни заявки, изображенията няма да се изтеглят. Добавете CDN домейните на плъгина в белия списък или временно облекчете изходящите правила по време на импортирането.
    Шаблонът изглежда различно от прегледа: Това почти винаги означава, че необходим плъгин (Elementor Pro, специфична добавка) не е инсталиран. Съветникът за импортиране изброява необходимите плъгини — инсталирайте всички тях преди импортирането.
    Промените в персонализатора не се прилагат към импортираните страници: Някои шаблони на Elementor използват собствените глобални настройки на Elementor, а не персонализатора на темата. Промените, направени в Appearance > Customize, няма да засегнат елементите, контролирани от Elementor. Използвайте Elementor > Site Settings за тези страници.
    Влошаване на производителността след импортиране: Пълните импортирания на сайта зареждат всички демо плъгини и активи. Проверете активните плъгини след импортирането и деактивирайте всичко, което не ви е необходимо. Всеки активен плъгин добавя режийни разходи за изпълнение на PHP при всяко зареждане на страница.
    Матрица за технически решения: Избор на вашия път за изграждане
    
    
    
    Сценарий
    Препоръчан път
    
    
    
    
    
    
    
    
    —
    —
    
    
    
    
    
    
    
    
    Нов сайт, без съществуващо съдържание, нужда от бързина
    Astra + Starter Templates + Elementor, пълно импортиране на сайта
    
    
    
    
    
    
    
    
    Сайт с критична производителност (приоритет Core Web Vitals)
    Kadence + Kadence Starter Templates + само Gutenberg
    
    
    
    
    
    
    
    
    Съществуващ сайт, редизайн само на началната страница
    Произволна тема + импортиране на шаблон за единична страница
    
    
    
    
    
    
    
    
    WooCommerce магазин
    Astra или Kadence + специфичен шаблон за WooCommerce
    
    
    
    
    
    
    
    
    Разработчик, изграждащ за клиент
    Neve + дъщерна тема + селективно импортиране на блокове
    
    
    
    
    
    
    
    
    Необходим минимален брой плъгини
    Kadence + Gutenberg, без Elementor
    
    
    
    
    
    Контролен списък преди стартиране
    
    Ограничението на PHP паметта е 256 MB или по-високо преди импортирането
    SSL сертификатът е активен и HTTPS е наложен
    Пълното импортиране на сайта е завършено първо в тестова среда, след което е прехвърлено в продукция
    Всички примерни текстове и изображения са заменени
    SEO мета заглавията и описанията са зададени на всяка страница
    Всички форми са тествани с потвърдена реална доставка на имейл
    Навигационните менюта са проверени — без неработещи връзки или демо URL адреси
    Базовата линия на производителността е измерена с PageSpeed Insights
    Плъгинът за кеширане е активен и конфигуриран
    Потребителското име на администратора е сменено от стандартното admin
  • Правата на wp-config.php са зададени на 600
  • DNS на домейна сочи към правилния IP адрес на сървъра

Често задавани въпроси

Мога ли да използвам стартиращ шаблон на съществуващ WordPress сайт, без да загубя текущото си съдържание?

Да, но трябва да изберете „Import Single Page” или „Import Home Template”, а не „Import Complete Site”. Пълното импортиране на сайта ще презапише съществуващите страници, менюта и области за уиджети. Винаги правете пълно резервно копие преди всяка операция по импортиране.

Работят ли стартиращите шаблони с произволна WordPress тема или само с конкретни?

Стартиращите шаблони са обвързани с конкретни тематични екосистеми. Плъгинът Astra Starter Templates работи само с темата Astra. Kadence Starter Templates изискват темата Kadence. Не можете да импортирате шаблони между несъвместими теми.

Защо импортираните ми страници изглеждат различно от прегледа на шаблона?

Най-честата причина е липсващ необходим плъгин — обикновено Elementor Pro или премиум добавка. Съветникът за импортиране изброява всички необходими плъгини; инсталирайте всеки един от тях преди импортирането. Вторична причина е ограничение на PHP паметта, което е причинило тихо провалване на импортирането, оставяйки някои активи незаредени.

Ще навреди ли използването на стартиращ шаблон на SEO на моя сайт?

Не по своята същност, но стартиращите шаблони импортират демо съдържание без SEO метаданни. Трябва ръчно да зададете уникални мета заглавия, описания и структурирани данни за всяка страница. Освен това, някои шаблони с много Elementor генерират раздут HTML, който може да повлияе негативно на Core Web Vitals — проверете с PageSpeed Insights след импортирането.

Мога ли да превключа към различен стартиращ шаблон, след като вече съм персонализирал сайта си?

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

15%

Спести 15% на всички хостинг услуги

Тествай уменията си и получи Отстъпка за всеки хостинг план

Използвайте код:

Skills
За начало