Как да хоствате статичен файл WordPress Сайт безплатно (на GitHub страници, Vercel, Netlify)

WordPress е мощна и популярна система за управление на съдържание, но хостваща динамична WordPress сайтът може да струва скъпо и да изисква постоянна поддръжка. За много прости уебсайтове или блогове, статична версия на a WordPress сайтът може да бъде отлична алтернатива. Статичните сайтове са по-бързи, по-сигурни и могат да се хостват безплатно на платформи като GitHub Pages, Netlify или Vercel.

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

Инструменти, от които се нуждаете

Преди да се потопим в процеса, нека се уверим, че имате всички необходими инструменти. Ето списък на всичко, от което се нуждаете, за да хоствате статиката си WordPress сайт безплатно:

Преди да продължите с урока, уверете се, че сте инсталирали тези инструменти и сте настроили акаунти. Наличието на всичко готово ще направи процеса плавен и лесен.

Стъпка 1: Разработете своя WordPress Сайт на LocalWP

Преди да започнем, ще трябва да имате своя WordPress готов сайт. Ако все още не сте създали вашия сайт или ако той в момента се хоства другаде, препоръчвам да използвате LocalWP (по-рано Local от Flywheel), за да разработите и тествате сайта си локално.

1. Изтеглете и инсталирайте LocalWP безплатно от localwp.com.
2. Създайте нов WordPress сайт в LocalWP.
3. Проектирайте сайта си, добавете съдържание и инсталирайте необходимите добавки.
4. Уверете се, че вашият сайт изглежда и функционира точно както искате в неговата статична форма.

Разбиране на ограниченията на статичните сайтове

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

1. WordPress Форми: Традиционен WordPress формуляри, които разчитат на обработка от страна на сървъра, няма да работят. Това включва формуляри за контакт, формуляри за абонамент и други интерактивни формуляри.
2. WordPress Коментари: Динамичните системи за коментари, които позволяват потребителски взаимодействия в реално време, не се поддържат в статични сайтове.
3. Достъп до административната зона: Всички връзки към /wp-admin или подобни вътрешни WordPress маршрутите няма да функционират, тъй като изискват обработка от страна на сървъра.
4. Актуализации на съдържанието в реално време: Статичните сайтове изискват повторно генериране и пренасочване, за да се появят промени в съдържанието, за разлика от динамичните WordPress сайтове, където промените са незабавни.
5. Удостоверяване на потребителя: Функциите, изискващи потребителско влизане или членство, не се поддържат в основна статична настройка на сайта.
6. Функционалност за електронна търговия: Динамичните пазарски колички и обработката на плащанията обикновено няма да работят в статична среда.
7. Функционалност на търсенето: WordPressВградената функция за търсене на няма да работи, въпреки че могат да бъдат приложени алтернативи (както е споменато във функциите на Simply Static Pro).
8. Динамични странични ленти и приспособления: Уиджети, които извличат данни в реално време или изискват обработка от страна на сървъра, няма да функционират според очакванията.

Възможни заобиколни решения

Въпреки че съществуват тези ограничения, има начини за смекчаване на някои от тях:

• За формуляри можете да използвате услуги на трети страни като Formspree или Netlify Forms.
• Коментарите могат да се обработват чрез услуги като Disqus или Facebook Comments.
• Функционалността за търсене може да се реализира с помощта на решения от страна на клиента като Lunr.js или Algolia (както се предлага в Simply Static Pro).
• За електронна търговия обмислете използването на външни услуги като Snipcart или Gumroad.

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

Стъпка 2: Инсталирайте и конфигурирайте Simply Static

Simply Static е безплатен WordPress плъгин който генерира статична версия на вашия WordPress сайт. Ето как да го настроите:

1. Във вашата WordPress табло за управление, отидете на Plugins > Add New.
2. Потърсете „Simply Static“, инсталирайте приставката и я активирайте.
3. Отидете на Simply Static > Settings във вашия WordPress табло.
4. В раздела „Общи“ задайте следното:
   • Целеви URL адреси: Изберете „Запазване за офлайн употреба“. Ако вече имате персонализиран домейн, изберете „Абсолютни URL адреси“, както е на екранната снимка по-долу:

5. Локална директория: Задайте това на директория извън вашата WordPress инсталация, напр. /Users/yourusername/Documents/StaticSite

6. В раздела „Включване/изключване“ се уверете, че са включени всички необходими URL адреси.
   • В повечето случаи използвайте /wp-content/ и /wp-includes/

7. Запазете настройките си.

Има и про версия на SimplyStatic, Ето обобщение на професионалните функции на приставката Simply Static:

1. Разширено внедряване:
   • Разположете статични сайтове на множество платформи, включително SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces и BunnyCDN.
2. Лесни актуализации на сайта:
   • Управлявайте ефективно актуализациите на съдържанието, независимо дали за единични публикации, групови актуализации или конкретни URL адреси.
3. Интегриране на формуляри и коментари:
   • Безпроблемно интегрирайте формуляри от популярни добавки като Contact Form 7, Gravity Forms и Elementor Forms във вашия статичен сайт.
4. Функционалност за търсене:
   • Приложете основно търсене с помощта на Fuse.js или надстройте до по-всеобхватно търсене с Algolia.
5. Поддръжка на WP-CLI:
   • Използвайте WP-CLI, за да конфигурирате, експортирате и управлявате Simply Static функции директно от командния ред.
6. Многоезична поддръжка:
   • Предлагайте съдържание на множество езици с интеграции за WPML, Polylang и TranslatePress.
7. Минимизиране:
   • Оптимизирайте ефективността на сайта чрез минимизиране на CSS, JavaScript и статични HTML файлове.
8. WordPress Укриване:
   • Замяна по подразбиране WordPress пътища за скриване на факта, че WordPress се използва като система за управление на съдържанието.

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

Стъпка 3: Инициализиране на Git Repository

След като вече сме настроили генератора на статичен сайт, нека подготвим нашата локална директория за контрол на версиите:

1. Отворете терминал или команден ред.
2. Придвижете се до директорията, която сте посочили в Simply Static (напр. cd /Users/yourusername/Documents/StaticSite).
3. Инициализирайте ново Git хранилище, като изпълните:

   git init

Стъпка 4: Създайте хранилище на GitHub

Ще използваме GitHub Desktop, за да създадем и управляваме нашето хранилище:

1. Изтеглете и инсталирайте GitHub Desktop от desktop.github.com ако още не сте го направили.
2. Отворете GitHub Desktop и влезте в акаунта си в GitHub.
3. Кликнете върху „Файл“ > „Ново хранилище“ или използвайте бутона „Създаване на ново хранилище на вашия твърд диск“.
4. Задайте следното:
   • Име: Изберете име за вашето хранилище (напр. „my-static-wordpress“)
   • Локален път: Задайте това на същата директория, която сте посочили в Simply Static
   • Инициализирайте това хранилище с README: Оставете без отметка
   • Git ignore: Изберете „Няма“ (създадохме наши собствени в стъпка 3)
   • Лиценз: Изберете подходящ лиценз или оставете „Няма“
5. Кликнете върху „Създаване на хранилище“

Стъпка 5: Ангажирайте хранилището

След като имаме настроено нашето хранилище, нека направим първия си ангажимент:

1. В GitHub Desktop трябва да видите всички файлове във вашия статичен сайт, посочени като промени.
2. Въведете резюме за вашия ангажимент (напр. „Първоначално ангажимент на статични файлове на сайта“).
3. Щракнете върху „Ангажиране към основния“ (или „Ангажиране към мастер“ в по-старите версии).
4. Щракнете върху „Публикуване на хранилище“, за да изпратите вашето локално хранилище към GitHub.

Стъпка 6: Стартирайте просто статично експортиране

Сега е време да генерираме нашия статичен сайт:

1. Върни се към вашия WordPress табло.
2. Придвижете се до Simply Static > Generate. (Можете да пренебрегнете предупреждението за грешка на диагностиката, тъй като внедрявате само в локална директория).
3. Щракнете върху „Генериране на статични файлове“.
4. Изчакайте процесът да завърши. Това може да отнеме няколко минути в зависимост от размера на вашия сайт.
5. След като приключите, върнете се към GitHub Desktop.
6. Трябва да видите новогенерираните или актуализирани файлове, посочени като промени.
7. Извършете тези промени със съобщение като „Актуализиране на статичните файлове на сайта“.
8. Изпратете промените в GitHub, като щракнете върху „Изпратете произхода“.

Стъпка 7: Свържете хранилището към хостинг платформа

Сега, когато нашият статичен сайт е на GitHub, можем лесно да го свържем с безплатна хостинг платформа. Ще предоставя инструкции за GitHub Pages, Netlify и Vercel:

Страници на GitHub

1. Отидете до вашето хранилище на GitHub.com.
2. Кликнете върху „Настройки“ > „Страници“ в лявата странична лента.
3. Под „Източник“ изберете „Внедряване от клон“.
4. Изберете клона, който искате да внедрите (обикновено „main“ или „master“).
5. Изберете основната папка (/) и щракнете върху „Запазване“.
6. Вашият сайт ще бъде активен на https://yourusername.github.io/repository-name/.

netlify

1. Регистрирайте се за безплатен акаунт на netlify.com.
2. Кликнете върху „Нов сайт от Git“ на таблото за управление на Netlify.
3. Изберете GitHub като ваш доставчик на Git и упълномощете Netlify.
4. Изберете вашето хранилище от списъка.
5. Оставете командата за изграждане и директорията за публикуване празна.
6. Щракнете върху „Внедряване на сайт“.
7. Вашият сайт ще бъде активен в поддомейн на Netlify, който можете да персонализирате в настройките на сайта.

Версел

1. Регистрирайте се за безплатен акаунт на vercel.com.
2. Щракнете върху „Нов проект“ на таблото за управление на Vercel.
3. Импортирайте вашето GitHub хранилище.
4. Оставете настройките за компилация такива, каквито са (Vercel трябва автоматично да открие, че това е статичен сайт).
5. Щракнете върху „Разполагане“.
6. Вашият сайт ще бъде активен в поддомейн на Vercel, който можете да персонализирате в настройките на проекта.

Oбобщение

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

Някои допълнителни съвети:

• Помислете за настройка на персонализиран домейн за по-професионален вид.
• Редовно актуализирайте своите WordPress инсталация и добавки, за да сте сигурни, че работите с най-новите функции и актуализации за защита.
• Разгледайте разширените функции на Професионална версия на Simply Static, като криене WordPress и настройка на формуляри или функция за търсене за вашия статичен сайт.