WordPress je výkonný a populární systém pro správu obsahu, ale hostující dynamický WordPress místo může být nákladné a vyžadovat neustálou údržbu. Pro mnoho jednoduchých webových stránek nebo blogů je statická verze a WordPress stránky mohou být výbornou alternativou. Statické weby jsou rychlejší, bezpečnější a lze je hostovat zdarma na platformách jako GitHub Pages, Netlify nebo Vercel.
V tomto tutoriálu projdu procesem vytvoření statické verze vaší WordPress web a hostování zdarma. Tento přístup je ideální pro začátečníky, kteří chtějí využít uživatelsky přívětivý přístup WordPress rozhraní pro tvorbu obsahu a zároveň využívat výhod statického webu.
Nástroje, které potřebujete
Než se pustíte do procesu, ujistěte se, že máte všechny potřebné nástroje. Zde je seznam všeho, co budete potřebovat k hostování statiky WordPress stránky zdarma:
• LocalWP: Zdarma místní WordPress vývojový nástroj, který vám umožní stavět a testovat WordPress stránky offline.
• Jednoduše statické: A zdarma WordPress plugin, který generuje statickou verzi vašeho WordPress místo.
• Git: Systém kontroly verzí pro sledování změn ve vašich souborech. Obvykle se dodává předinstalovaný na počítačích Mac a Linux. Uživatelé Windows mohou stahovat z git-scm.com
• Desktop GitHub: Uživatelsky přívětivé rozhraní pro správu repozitářů Git. Stáhněte si jej z: desktop.github.com
• Účet GitHub: Budete to potřebovat k hostování vašeho úložiště a používání stránek GitHub. Zaregistrujte se zdarma na: Github.com
• Účet hostingové platformy: Vyberte jednu z následujících možností:
- Stránky GitHub (dodává se s vaším účtem GitHub)
- Netlify: netlify.com
- Vercel: vercel.com
Než budete pokračovat ve výukovém programu, ujistěte se, že máte nainstalované tyto nástroje a nastavené účty. Když budete mít vše připraveno, bude proces hladký a přímočarý.
Krok 1: Rozvíjejte své WordPress Stránky na LocalWP
Než začneme, musíte mít svůj WordPress stránky připraveny. Pokud jste svůj web ještě nevytvořili nebo je aktuálně hostován jinde, doporučuji použít LocalWP (dříve Local by Flywheel) k místnímu vývoji a testování webu.
- Stáhněte si a nainstalujte LocalWP zdarma z localwp.com.
- Vytvoř nový WordPress místo v LocalWP.
- Navrhněte svůj web, přidejte obsah a nainstalujte potřebné pluginy.
- Ujistěte se, že váš web ve statické podobě vypadá a funguje přesně tak, jak chcete.
Pochopení omezení statických stránek
Zatímco statické WordPress stránky nabízejí výhody, jako je vyšší rychlost, zabezpečení a bezplatné možnosti hostování, je důležité si uvědomit jejich omezení. Některé dynamické vlastnosti WordPress nebude fungovat ve statickém prostředí:
- WordPress Formuláře: Tradiční WordPress formuláře, které se spoléhají na zpracování na straně serveru, nebudou fungovat. To zahrnuje kontaktní formuláře, formuláře předplatného a další interaktivní formuláře.
- WordPress Komentáře: Dynamické systémy komentářů, které umožňují uživatelské interakce v reálném čase, nejsou na statických webech podporovány.
- Přístup do administrátorské oblasti: Jakékoli odkazy na
/wp-admin
nebo podobné vnitřní WordPress trasy nebudou fungovat, protože vyžadují zpracování na straně serveru. - Aktualizace obsahu v reálném čase: Statické weby vyžadují regeneraci a přemístění, aby se objevily jakékoli změny obsahu, na rozdíl od dynamických WordPress stránky, kde jsou změny okamžité.
- Ověření uživatele: Funkce vyžadující přihlášení uživatele nebo členství nejsou v základním statickém nastavení webu podporovány.
- Funkčnost elektronického obchodu: Dynamické nákupní košíky a zpracování plateb obvykle nefungují ve statickém prostředí.
- Funkce vyhledávání: WordPressVestavěná funkce vyhledávání nebude fungovat, i když lze implementovat alternativy (jak je uvedeno ve funkcích Simply Static Pro).
- Dynamické postranní panely a widgety: Widgety, které získávají data v reálném čase nebo vyžadují zpracování na straně serveru, nebudou fungovat podle očekávání.
Možná zástupná řešení
I když tato omezení existují, existují způsoby, jak některá z nich zmírnit:
- Pro formuláře můžete použít služby třetích stran, jako je Formspree nebo Netlify Forms.
- Komentáře lze zpracovávat prostřednictvím služeb jako Disqus nebo Facebook Comments.
- Funkce vyhledávání lze implementovat pomocí řešení na straně klienta, jako je Lunr.js nebo Algolia (jak je nabízeno v Simply Static Pro).
- V případě elektronického obchodování zvažte použití externích služeb, jako je Snipcart nebo Gumroad.
Při vývoji vašeho WordPress pamatujte na tato omezení a podle toho naplánujte strukturu a funkce svého webu. Zaměřte se na stránky založené na obsahu a minimalizujte závislost na dynamických funkcích, které se nepřenesou do statického prostředí.
Krok 2: Nainstalujte a nakonfigurujte Simply Static
Simply Static je zdarma WordPress plugin který generuje statickou verzi vašeho WordPress místo. Postup nastavení:
- Ve vašem WordPress dashboard, přejděte na Pluginy > Přidat nový.
- Vyhledejte „Simply Static“, nainstalujte plugin a aktivujte plugin.
- Přejděte na položku Jednoduše statické > Nastavení ve vašem WordPress Přístrojová deska.
- Na kartě „Obecné“ nastavte následující:
- Cílové adresy URL: Zvolte „Uložit pro použití offline“. Pokud již máte vlastní doménu, vyberte „Absolutní adresy URL“ podle níže uvedeného snímku obrazovky:
- Local Directory: Nastavte toto na adresář mimo váš WordPress instalace, např.
/Users/yourusername/Documents/StaticSite
- Na kartě Zahrnout/Vyloučit se ujistěte, že jsou zahrnuty všechny potřebné adresy URL.
- Ve většině případů použijte /wp-content/ a /wp-includes/
- Uložte nastavení.
K dispozici je také pro verzi SimplyStatic, Zde je souhrn profesionálních funkcí pluginu Simply Static:
- Pokročilé nasazení:
- Nasaďte statické stránky na více platforem včetně SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces a BunnyCDN.
- Snadné aktualizace webu:
- Spravujte aktualizace obsahu efektivně, ať už jde o jednotlivé příspěvky, hromadné aktualizace nebo konkrétní adresy URL.
- Integrace formulářů a komentářů:
- Bezproblémově integrujte formuláře z oblíbených pluginů, jako je Contact Form 7, Gravity Forms a Elementor Forms, do svého statického webu.
- Funkce vyhledávání:
- Implementujte základní vyhledávání pomocí Fuse.js nebo upgradujte na komplexnější vyhledávání pomocí Algolia.
- Podpora WP-CLI:
- Pomocí WP-CLI můžete konfigurovat, exportovat a spravovat funkce Simply Static přímo z příkazového řádku.
- Vícejazyčná podpora:
- Nabízejte obsah ve více jazycích s integrací pro WPML, Polylang a TranslatePress.
- Minifikace:
- Optimalizujte výkon webu minifikací CSS, JavaScriptu a statických HTML souborů.
- WordPress Zatajení:
- Nahradit výchozí WordPress cesty, jak skrýt skutečnost, že WordPress se používá jako redakční systém.
Tyto profesionální funkce výrazně zvyšují funkčnost a flexibilitu statického WordPress weby, což umožňuje pokročilejší nasazení, lepší výkon a lepší uživatelskou zkušenost.
Krok 3: Inicializujte úložiště Git
Nyní, když máme nastavený generátor statických stránek, připravme náš místní adresář pro správu verzí:
- Otevřete terminál nebo příkazový řádek.
- Přejděte do adresáře, který jste zadali v Simply Static (např.
cd /Users/yourusername/Documents/StaticSite
). - Inicializujte nové úložiště Git spuštěním:
git init
Krok 4: Vytvořte úložiště GitHub
K vytvoření a správě našeho úložiště použijeme GitHub Desktop:
- Stáhněte a nainstalujte GitHub Desktop z desktop.github.com pokud jste tak ještě neučinili.
- Otevřete GitHub Desktop a přihlaste se ke svému účtu GitHub.
- Klikněte na „Soubor“ > „Nové úložiště“ nebo použijte tlačítko „Vytvořit nové úložiště na pevném disku“.
- Nastavte následující:
- Název: Vyberte název svého úložiště (např. „my-static-wordpress“)
- Local Path: Nastavte toto na stejný adresář, který jste zadali v Simply Static
- Inicializujte toto úložiště pomocí souboru README: Ponechte nezaškrtnuté
- Git ignore: Vyberte „None“ (vytvořili jsme vlastní v kroku 3)
- Licence: Vyberte vhodnou licenci nebo ponechte hodnotu „Žádná“
- Klikněte na „Vytvořit úložiště“
Krok 5: Potvrďte úložiště
Nyní, když máme naše úložiště nastaveno, udělejme první potvrzení:
- V GitHub Desktop byste měli vidět všechny soubory na vašem statickém webu uvedené jako změny.
- Zadejte shrnutí vašeho odevzdání (např. „Počáteční odevzdání statických souborů webu“).
- Klikněte na „Commit to main“ (nebo „Commit to master“ ve starších verzích).
- Kliknutím na „Publikovat úložiště“ odešlete své místní úložiště na GitHub.
Krok 6: Spusťte jednoduchý statický export
Nyní je čas vygenerovat náš statický web:
- Vraťte se do vaší WordPress Přístrojová deska.
- Přejděte na Jednoduše statické > Generovat. (Výstrahu na chybu diagnostiky můžete ignorovat, protože nasazujete pouze do místního adresáře).
- Klikněte na „Generovat statické soubory“.
- Počkejte na dokončení procesu. To může trvat několik minut v závislosti na velikosti vašeho webu.
- Po dokončení se vraťte na GitHub Desktop.
- Měli byste vidět nově vygenerované nebo aktualizované soubory uvedené jako změny.
- Potvrďte tyto změny zprávou jako „Aktualizujte statické soubory webu“.
- Odešlete změny na GitHub kliknutím na „Push origin“.
Krok 7: Připojte úložiště k hostitelské platformě
Nyní, když je náš statický web na GitHubu, můžeme jej snadno připojit k bezplatné hostingové platformě. Poskytnu pokyny pro stránky GitHub, Netlify a Vercel:
Stránky GitHub
- Přejděte do svého úložiště na GitHub.com.
- Klikněte na „Nastavení“ > „Stránky“ v levém postranním panelu.
- V části Zdroj vyberte možnost Nasadit z pobočky.
- Vyberte větev, kterou chcete nasadit (obvykle „hlavní“ nebo „hlavní“).
- Vyberte kořenovou složku (/) a klikněte na „Uložit“.
- Vaše stránky budou aktivní na
https://yourusername.github.io/repository-name/
.
netlify
- Zaregistrujte si bezplatný účet na netlify.com.
- Klikněte na „Nový web z Gitu“ na hlavním panelu Netlify.
- Vyberte GitHub jako svého poskytovatele Git a autorizujte Netlify.
- Vyberte své úložiště ze seznamu.
- Příkaz sestavení a publikovat adresář ponechte prázdné.
- Klikněte na „Nasadit web“.
- Váš web bude aktivní v subdoméně Netlify, kterou si můžete přizpůsobit v nastavení webu.
Vercel
- Zaregistrujte si bezplatný účet na vercel.com.
- Klikněte na „Nový projekt“ na řídicím panelu Vercel.
- Importujte své úložiště GitHub.
- Ponechte nastavení sestavení tak, jak jsou (Vercel by měl automaticky detekovat, že se jedná o statický web).
- Klikněte na „Nasadit“.
- Váš web bude aktivní v subdoméně Vercel, kterou si můžete přizpůsobit v nastavení projektu.
Shrnutí
Gratuluji! Nyní máte svou statickou verzi WordPress hostovaný web zdarma. Nezapomeňte znovu vytvořit a odeslat své statické soubory, kdykoli v nich provedete změny WordPress místo. Tento pracovní postup vám umožní vychutnat si snadnost WordPress pro tvorbu obsahu a zároveň těžit z rychlosti, bezpečnosti a bezplatného hostování statického webu.
Několik dalších tipů:
- Zvažte nastavení vlastní domény pro profesionálnější vzhled.
- Pravidelně aktualizujte svůj WordPress instalace a pluginy, abyste zajistili, že budete pracovat s nejnovějšími funkcemi a aktualizacemi zabezpečení.
- Prozkoumejte pokročilé funkce Pro verze Simply Static, jako schování WordPress a nastavení formulářů nebo funkcí vyhledávání pro váš statický web.