Jak hostować plik statyczny WordPress Strona za darmo (na GitHub Pages, Vercel, Netlify)

in WordPress

Nasze treści są obsługiwane przez czytelników. Jeśli klikniesz na nasze linki, możemy otrzymać prowizję. Jak oceniamy.

WordPress to potężny i popularny system zarządzania treścią, ale hosting dynamiczny WordPress witryna może być kosztowna i wymagać ciągłej konserwacji. W przypadku wielu prostych witryn internetowych lub blogów statyczna wersja pliku WordPress witryna może być doskonałą alternatywą. Witryny statyczne są szybsze, bezpieczniejsze i można je hostować bezpłatnie na platformach takich jak GitHub Pages, Netlify lub Vercel.

W tym samouczku omówię proces tworzenia statycznej wersji pliku WordPress witrynę i udostępnianie jej za darmo. To podejście jest idealne dla początkujących, którzy chcą wykorzystać łatwość obsługi WordPress interfejs do tworzenia treści przy jednoczesnym korzystaniu z zalet witryny statycznej.

Narzędzia, których potrzebujesz

Zanim przystąpisz do tego procesu, upewnij się, że masz wszystkie niezbędne narzędzia. Oto lista wszystkiego, czego będziesz potrzebować do hostowania statycznego WordPress strona za darmo:

LokalnyWP: Bezpłatny lokal WordPress narzędzie programistyczne, które pozwala budować i testować WordPress witryny w trybie offline.

Po prostu statyczny: Bezpłatny WordPress wtyczka generująca statyczną wersję pliku WordPress strona.

git: System kontroli wersji umożliwiający śledzenie zmian w plikach. Zwykle jest preinstalowany na komputerach Mac i Linux. Użytkownicy systemu Windows mogą pobierać z git-scm.com

Pulpit GitHub: Przyjazny dla użytkownika interfejs do zarządzania repozytoriami Git. Pobierz go z: desktop.github.com

Konto GitHuba: będziesz tego potrzebować do hostowania repozytorium i korzystania ze stron GitHub. Zarejestruj się bezpłatnie na: Github.com

Konto na platformie hostingowej: Wybierz jedną z następujących opcji:

Przed kontynuowaniem samouczka upewnij się, że masz zainstalowane te narzędzia i skonfigurowane konta. Przygotowanie wszystkiego sprawi, że proces będzie płynny i prosty.

Krok 1: Rozwijaj swoje WordPress Strona na LocalWP

Zanim zaczniemy, musisz mieć swój WordPress strona gotowa. Jeśli nie utworzyłeś jeszcze swojej witryny lub jest ona obecnie hostowana gdzie indziej, polecam użycie LocalWP (dawniej Local by Flywheel) do lokalnego opracowania i przetestowania Twojej witryny.

lokalnywp
  1. Pobierz i zainstaluj LocalWP za darmo z localwp.com.
  2. Stwórz nowy WordPress witryna w LocalWP.
  3. Zaprojektuj swoją witrynę, dodaj treść i zainstaluj niezbędne wtyczki.
  4. Upewnij się, że Twoja witryna wygląda i działa dokładnie tak, jak chcesz, w formie statycznej.

Zrozumienie ograniczeń witryny statycznej

Podczas statycznego WordPress witryny oferują korzyści, takie jak większa szybkość, bezpieczeństwo i opcje bezpłatnego hostingu, ważne jest, aby zdawać sobie sprawę z ich ograniczeń. Niektóre dynamiczne funkcje WordPress nie będzie działać w środowisku statycznym:

  1. WordPress Formularze: Tradycyjny WordPress formularze, które opierają się na przetwarzaniu po stronie serwera, nie będą działać. Dotyczy to formularzy kontaktowych, formularzy subskrypcji i innych formularzy interaktywnych.
  2. WordPress Komentarze: Dynamiczne systemy komentarzy umożliwiające interakcję użytkownika w czasie rzeczywistym nie są obsługiwane w witrynach statycznych.
  3. Dostęp do obszaru administracyjnego: Wszelkie linki do /wp-admin lub podobne wewnętrzne WordPress trasy nie będą działać, ponieważ wymagają przetwarzania po stronie serwera.
  4. Aktualizacje treści w czasie rzeczywistym: witryny statyczne wymagają regeneracji i ponownego wdrożenia, aby pojawiły się jakiekolwiek zmiany w treści, w przeciwieństwie do witryn dynamicznych WordPress witryny, w których zmiany są natychmiastowe.
  5. Uwierzytelnianie użytkownika: Funkcje wymagające logowania lub członkostwa użytkownika nie są obsługiwane w podstawowej konfiguracji witryny statycznej.
  6. Funkcjonalność handlu elektronicznego: Dynamiczne koszyki i przetwarzanie płatności zazwyczaj nie będą działać w środowisku statycznym.
  7. Funkcja wyszukiwania: WordPresswbudowana funkcja wyszukiwania nie będzie działać, chociaż można zastosować alternatywy (jak wspomniano w funkcjach Simply Static Pro).
  8. Dynamiczne paski boczne i widżety: Widżety pobierające dane w czasie rzeczywistym lub wymagające przetwarzania po stronie serwera nie będą działać zgodnie z oczekiwaniami.

Możliwe obejścia

Chociaż te ograniczenia istnieją, istnieją sposoby na złagodzenie niektórych z nich:

  • W przypadku formularzy możesz skorzystać z usług stron trzecich, takich jak Formspree lub Netlify Forms.
  • Komentarze można obsługiwać za pośrednictwem usług takich jak Disqus lub Komentarze na Facebooku.
  • Funkcjonalność wyszukiwania można wdrożyć za pomocą rozwiązań po stronie klienta, takich jak Lunr.js lub Algolia (oferowanych w Simply Static Pro).
  • W przypadku handlu elektronicznego rozważ skorzystanie z usług zewnętrznych, takich jak Snipcart lub Gumroad.

Podczas opracowywania swojego WordPress należy pamiętać o tych ograniczeniach i odpowiednio zaplanować strukturę i funkcje witryny. Skoncentruj się na stronach opartych na treści i zminimalizuj zależność od funkcji dynamicznych, które nie przekładają się na środowisko statyczne.

Krok 2: Zainstaluj i skonfiguruj po prostu statycznie

Simply Static jest darmowy WordPress wtyczka który generuje statyczną wersję pliku WordPress strona. Oto jak to skonfigurować:

  1. W twoim WordPress panelu sterowania, przejdź do Wtyczki > Dodaj nowe.
  2. Wyszukaj „Simply Static”, zainstaluj wtyczkę i aktywuj ją.
  3. Przejdź do Simply Static > Ustawienia w pliku WordPress deska rozdzielcza.
  4. W zakładce „Ogólne” ustaw następujące opcje:
    • Docelowe adresy URL: wybierz „Zapisz do użytku offline”. Jeśli masz już domenę niestandardową, wybierz „Bezwzględne adresy URL”, jak pokazano na poniższym zrzucie ekranu:
Po prostu ustawienia statycznego adresu URL
  1. Katalog lokalny: ustaw go na katalog poza Twoim WordPress instalacja np. /Users/yourusername/Documents/StaticSite
    Po prostu statyczne ustawienia wdrażania
    1. Upewnij się, że na karcie „Uwzględnij/Wyklucz” uwzględniono wszystkie niezbędne adresy URL.
      • W większości przypadków użyj /wp-content/ i /wp-includes/
    Dodatkowe pliki i katalogi
    1. Zapisz swoje ustawienia.

      Istnieje również profesjonalna wersja SimplyStaticOto podsumowanie profesjonalnych funkcji wtyczki Simply Static:

      1. Zaawansowane wdrożenie:
        • Wdrażaj witryny statyczne na wielu platformach, w tym SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces i BunnyCDN.
      2. Łatwe aktualizacje witryny:
        • Efektywnie zarządzaj aktualizacjami treści, zarówno w przypadku pojedynczych postów, aktualizacji zbiorczych, jak i określonych adresów URL.
      3. Integracja formularzy i komentarzy:
        • Bezproblemowo integruj formularze z popularnych wtyczek, takich jak Contact Form 7, Gravity Forms i Elementor Forms, ze swoją statyczną witryną.
      4. Funkcja wyszukiwania:
        • Zaimplementuj podstawowe wyszukiwanie za pomocą Fuse.js lub uaktualnij do bardziej wszechstronnego wyszukiwania za pomocą Algolii.
      5. Obsługa WP-CLI:
        • Użyj WP-CLI do konfigurowania, eksportowania i zarządzania funkcjami Simply Static bezpośrednio z wiersza poleceń.
      6. Wsparcie wielojęzyczne:
        • Oferuj treści w wielu językach dzięki integracji z WPML, Polylang i TranslatePress.
      7. Minifikacja:
        • Zoptymalizuj wydajność witryny, minimalizując pliki CSS, JavaScript i statyczne pliki HTML.
      8. WordPress Ukrywanie:
        • Zamień domyślne WordPress ścieżki, aby ukryć fakt, że WordPress jest używany jako system zarządzania treścią.

      Te profesjonalne funkcje znacznie zwiększają funkcjonalność i elastyczność statyki WordPress witryn internetowych, umożliwiając bardziej zaawansowane wdrożenia, lepszą wydajność i lepsze doświadczenie użytkownika.

      Krok 3: Zainicjuj repozytorium Git

      Teraz, gdy mamy już skonfigurowany generator stron statycznych, przygotujmy nasz katalog lokalny do kontroli wersji:

      1. Otwórz terminal lub wiersz poleceń.
      2. Przejdź do katalogu określonego w Simply Static (np. cd /Users/yourusername/Documents/StaticSite).
      3. Zainicjuj nowe repozytorium Git, uruchamiając:
         git init

      Krok 4: Utwórz repozytorium GitHub

      Do tworzenia naszego repozytorium i zarządzania nim będziemy używać GitHub Desktop:

      pulpit githuba
      1. Pobierz i zainstaluj GitHub Desktop z desktop.github.com jeśli jeszcze tego nie zrobiłeś.
      2. Otwórz GitHub Desktop i zaloguj się na swoje konto GitHub.
      3. Kliknij „Plik” > „Nowe repozytorium” lub użyj przycisku „Utwórz nowe repozytorium na swoim dysku twardym”.
      4. Ustaw następujące elementy:
        • Nazwa: Wybierz nazwę swojego repozytorium (np. „my-static-wordpress”)
        • Ścieżka lokalna: Ustaw tę opcję na ten sam katalog, który określiłeś w Simply Static
        • Zainicjuj to repozytorium za pomocą pliku README: Pozostaw niezaznaczone
        • Git ignorowanie: wybierz „Brak” (stworzyliśmy własny w kroku 3)
        • Licencja: Wybierz odpowiednią licencję lub pozostaw opcję „Brak”
      5. Kliknij „Utwórz repozytorium”

      Krok 5: Zatwierdź repozytorium

      Teraz, gdy mamy już skonfigurowane repozytorium, dokonajmy pierwszego zatwierdzenia:

      1. W GitHub Desktop powinieneś zobaczyć wszystkie pliki w witrynie statycznej wymienione jako zmiany.
      2. Wprowadź podsumowanie swojego zatwierdzenia (np. „Początkowe zatwierdzenie statycznych plików witryny”).
      3. Kliknij „Zatwierdź do głównego” (lub „Zatwierdź do głównego” w starszych wersjach).
      4. Kliknij „Opublikuj repozytorium”, aby wypchnąć lokalne repozytorium do GitHub.

      Krok 6: Uruchom prosty eksport statyczny

      Teraz czas wygenerować naszą statyczną stronę:

      Po prostu eksport statyczny
      1. Wróć do swojego WordPress deska rozdzielcza.
      2. Przejdź do opcji Simply Static > Generuj. (Możesz zignorować alert o błędzie diagnostyki, ponieważ wdrażasz tylko w katalogu lokalnym).
      3. Kliknij „Generuj pliki statyczne”.
      4. Poczekaj na zakończenie procesu. Może to zająć kilka minut, w zależności od rozmiaru witryny.
      5. Po zakończeniu wróć do GitHub Desktop.
      6. Powinieneś zobaczyć nowo wygenerowane lub zaktualizowane pliki wymienione jako zmiany.
      7. Zatwierdź te zmiany, wyświetlając komunikat „Aktualizuj statyczne pliki witryny”.
      8. Prześlij zmiany do GitHub, klikając „Wyślij pochodzenie”.

      Krok 7: Połącz repozytorium z platformą hostingową

      Teraz, gdy nasza statyczna witryna znajduje się na GitHubie, możemy łatwo połączyć ją z bezpłatną platformą hostingową. Podam instrukcje dla GitHub Pages, Netlify i Vercel:

      Strony GitHub

      1. Przejdź do swojego repozytorium na GitHub.com.
      2. Kliknij „Ustawienia” > „Strony” na lewym pasku bocznym.
      3. W sekcji „Źródło” wybierz opcję „Wdróż z gałęzi”.
      4. Wybierz gałąź, którą chcesz wdrożyć (zwykle „główną” lub „główną”).
      5. Wybierz folder główny (/) i kliknij „Zapisz”.
      6. Twoja witryna będzie dostępna o godz https://yourusername.github.io/repository-name/.

      Netlifikuj

      1. Zarejestruj darmowe konto pod adresem netlify.com.
      2. Kliknij „Nowa witryna z Git” na pulpicie nawigacyjnym Netlify.
      3. Wybierz GitHub jako dostawcę Git i autoryzuj Netlify.
      4. Wybierz swoje repozytorium z listy.
      5. Pozostaw polecenie budowania i katalog publikowania pusty.
      6. Kliknij „Wdróż witrynę”.
      7. Twoja witryna będzie działać w subdomenie Netlify, którą możesz dostosować w ustawieniach witryny.

      vercel

      1. Zarejestruj darmowe konto pod adresem vercel.com.
      2. Kliknij „Nowy projekt” na pulpicie nawigacyjnym Vercel.
      3. Zaimportuj swoje repozytorium GitHub.
      4. Pozostaw ustawienia kompilacji bez zmian (Vercel powinien automatycznie wykryć, że jest to witryna statyczna).
      5. Kliknij „Wdróż”.
      6. Twoja witryna będzie działać w subdomenie Vercel, którą możesz dostosować w ustawieniach projektu.

      Podsumowanie

      Gratulacje! Masz teraz statyczną wersję pliku WordPress witryna hostowana za darmo. Pamiętaj, aby zregenerować i przesłać pliki statyczne za każdym razem, gdy wprowadzasz zmiany w pliku WordPress strona. Ten przepływ pracy pozwala cieszyć się łatwością WordPress do tworzenia treści, jednocześnie korzystając z szybkości, bezpieczeństwa i bezpłatnego hostingu strony statycznej.

      Kilka dodatkowych wskazówek:

      • Rozważ skonfigurowanie domeny niestandardowej, aby uzyskać bardziej profesjonalny wygląd.
      • Regularnie aktualizuj swoje WordPress instalacji i wtyczek, aby mieć pewność, że korzystasz z najnowszych funkcji i aktualizacji zabezpieczeń.
      • Poznaj zaawansowane funkcje programu Wersja Pro Simply Staticjak ukrywanie się WordPress oraz konfigurowanie formularzy lub funkcji wyszukiwania dla witryny statycznej.

      o autorze

      Matt Ahlgren

      Mathias Ahlgren jest dyrektorem generalnym i założycielem Website Rating, kierując globalnym zespołem redaktorów i pisarzy. Posiada tytuł magistra w zakresie informatyki i zarządzania. Po wczesnych doświadczeniach z tworzeniem stron internetowych na studiach jego kariera skupiła się na SEO. Z ponad 15-letnim doświadczeniem w SEO, marketingu cyfrowym i tworzeniu stron internetowych. Zajmuje się także bezpieczeństwem stron internetowych, czego dowodem jest certyfikat Cyber ​​Security. Ta różnorodna wiedza specjalistyczna leży u podstaw jego przywództwa w firmie Website Rating.

      Strona główna » WordPress » Jak hostować plik statyczny WordPress Strona za darmo (na GitHub Pages, Vercel, Netlify)
      Dzielić się z...