Paano Mag-host ng Static WordPress Libre ang Site (sa Mga Pahina ng GitHub, Vercel, Netlify)

WordPress ay isang malakas at tanyag na sistema ng pamamahala ng nilalaman, ngunit nagho-host ng isang dynamic WordPress Maaaring magastos ang site at nangangailangan ng patuloy na pagpapanatili. Para sa maraming simpleng website o blog, isang static na bersyon ng a WordPress Ang site ay maaaring maging isang mahusay na alternatibo. Ang mga static na site ay mas mabilis, mas secure, at maaaring i-host nang libre sa mga platform tulad ng GitHub Pages, Netlify, o Vercel.

Sa tutorial na ito, tatahakin ko ang proseso ng paggawa ng static na bersyon ng iyong WordPress site at pagho-host nito nang libre. Ang diskarte na ito ay perpekto para sa mga nagsisimula na gustong gamitin ang user-friendly WordPress interface para sa paglikha ng nilalaman habang tinatangkilik ang mga benepisyo ng isang static na site.

Mga tool na kailangan mo

Bago sumabak sa proseso, siguraduhin nating mayroon ka ng lahat ng kinakailangang tool. Narito ang isang listahan ng lahat ng kakailanganin mo para i-host ang iyong static WordPress site nang libre:

Bago magpatuloy sa tutorial, tiyaking na-install mo ang mga tool na ito at naka-set up ang mga account. Ang pagkakaroon ng lahat ng handa ay gagawing maayos at diretso ang proseso.

Hakbang 1: Paunlarin ang Iyong WordPress Site sa LocalWP

Bago tayo magsimula, kakailanganin mong magkaroon ng iyong WordPress handa na ang site. Kung hindi mo pa nagagawa ang iyong site, o kung ito ay kasalukuyang naka-host sa ibang lugar, inirerekumenda ko ang paggamit ng LocalWP (dating Lokal ng Flywheel) upang bumuo at subukan ang iyong site nang lokal.

1. I-download at i-install ang LocalWP nang libre mula sa localwp.com.
2. Gumawa ng bago WordPress site sa LocalWP.
3. Idisenyo ang iyong site, magdagdag ng nilalaman, at mag-install ng mga kinakailangang plugin.
4. Siguraduhin na ang iyong site ay mukhang at gumagana nang eksakto tulad ng gusto mo sa static na anyo nito.

Pag-unawa sa Static Site Limitations

Habang static WordPress Nag-aalok ang mga site ng mga benepisyo tulad ng pinahusay na bilis, seguridad, at libreng mga pagpipilian sa pagho-host, mahalagang malaman ang kanilang mga limitasyon. Ang ilang mga dynamic na tampok ng WordPress ay hindi gagana sa isang static na kapaligiran:

1. WordPress Form: Tradisyonal WordPress hindi gagana ang mga form na umaasa sa pagpoproseso sa gilid ng server. Kabilang dito ang mga form sa pakikipag-ugnayan, mga form ng subscription, at iba pang mga interactive na form.
2. WordPress Comments: Ang mga sistema ng dynamic na komento na nagbibigay-daan sa mga real-time na pakikipag-ugnayan ng user ay hindi sinusuportahan sa mga static na site.
3. Access sa Admin Area: Anumang mga link sa /wp-admin o katulad na panloob WordPress hindi gagana ang mga ruta, dahil nangangailangan ito ng pagpoproseso sa gilid ng server.
4. Real-time na Mga Update sa Nilalaman: Ang mga static na site ay nangangailangan ng pagbabagong-buhay at muling pag-deploy para lumitaw ang anumang mga pagbabago sa nilalaman, hindi tulad ng dynamic WordPress mga site kung saan ang mga pagbabago ay agaran.
5. Katibayan ng pag aari: Ang mga feature na nangangailangan ng mga login o membership ng user ay hindi sinusuportahan sa isang basic na static na setup ng site.
6. Pag-andar ng E-commerce: Ang mga dynamic na shopping cart at pagpoproseso ng pagbabayad ay karaniwang hindi gagana sa isang static na kapaligiran.
7. Pag-andar ng Paghahanap: WordPressHindi gagana ang built-in na feature sa paghahanap, kahit na maaaring ipatupad ang mga alternatibo (tulad ng nabanggit sa mga feature na Simply Static Pro).
8. Mga Dynamic na Sidebar at Widget: Ang mga widget na kumukuha ng real-time na data o nangangailangan ng pagpoproseso sa gilid ng server ay hindi gagana gaya ng inaasahan.

Mga Posibleng Workarounds

Habang umiiral ang mga limitasyong ito, may mga paraan upang pagaanin ang ilan sa mga ito:

• Para sa mga form, maaari mong gamitin ang mga serbisyo ng third-party tulad ng Formspree o Netlify Forms.
• Maaaring pangasiwaan ang mga komento sa pamamagitan ng mga serbisyo tulad ng Disqus o Facebook Comments.
• Maaaring ipatupad ang functionality ng paghahanap gamit ang mga solusyon sa panig ng kliyente tulad ng Lunr.js o Algolia (tulad ng inaalok sa Simply Static Pro).
• Para sa e-commerce, isaalang-alang ang paggamit ng mga panlabas na serbisyo tulad ng Snipcart o Gumroad.

Kapag nabuo ang iyong WordPress site, isaisip ang mga limitasyong ito at planuhin ang istraktura at mga feature ng iyong site nang naaayon. Tumutok sa mga pahinang batay sa nilalaman at bawasan ang pag-asa sa mga dynamic na feature na hindi isasalin sa isang static na kapaligiran.

Hakbang 2: I-install at I-configure ang Simply Static

Ang Simply Static ay isang libre WordPress isaksak na bumubuo ng isang static na bersyon ng iyong WordPress site. Narito kung paano ito i-set up:

1. Sa iyong WordPress dashboard, pumunta sa Mga Plugin > Magdagdag ng Bago.
2. Maghanap para sa "Simply Static", i-install ang plugin at i-activate ang plugin.
3. Pumunta sa Simply Static > Mga Setting sa iyong WordPress dashboard.
4. Sa ilalim ng tab na "Pangkalahatan", itakda ang sumusunod:
   • Mga Destination URL: Piliin ang "I-save para sa offline na paggamit." Kung mayroon ka nang custom na domain, piliin ang "Mga Ganap na URL", ayon sa screenshot sa ibaba:

5. Lokal na Direktoryo: Itakda ito sa isang direktoryo sa labas ng iyong WordPress pag-install, hal, /Users/yourusername/Documents/StaticSite

6. Sa ilalim ng tab na “Isama/Ibukod,” tiyaking kasama ang lahat ng kinakailangang URL.
   • Sa karamihan ng mga kaso, gamitin ang /wp-content/ at /wp-includes/

7. I-save ang iyong mga setting.

Mayroon ding isang pro na bersyon ng SimplyStatic, Narito ang isang buod ng mga pro feature ng Simply Static plugin:

1. Advanced na Deployment:
   • I-deploy ang mga static na site sa maraming platform kabilang ang SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces, at BunnyCDN.
2. Mga Madaling Update sa Site:
   • Pamahalaan ang mga update ng nilalaman nang mahusay, para sa mga solong post man, maramihang pag-update, o partikular na mga URL.
3. Pagsasama ng Mga Form at Komento:
   • Walang putol na isama ang mga form mula sa mga sikat na plugin tulad ng Contact Form 7, Gravity Forms, at Elementor Forms sa iyong static na site.
4. Functionality ng Paghahanap:
   • Ipatupad ang pangunahing paghahanap gamit ang Fuse.js o mag-upgrade sa isang mas kumpletong karanasan sa paghahanap sa Algolia.
5. Suporta sa WP-CLI:
   • Gamitin ang WP-CLI para i-configure, i-export, at pamahalaan ang mga feature na Simply Static nang direkta mula sa command line.
6. Suporta sa Multilingual:
   • Mag-alok ng nilalaman sa maraming wika na may mga pagsasama para sa WPML, Polylang, at TranslatePress.
7. Pagliit:
   • I-optimize ang pagganap ng site sa pamamagitan ng pagpapaliit ng CSS, JavaScript, at mga static na HTML na file.
8. WordPress Pagkukubli:
   • Palitan ang default WordPress mga landas upang itago ang katotohanan na WordPress ay ginagamit bilang sistema ng pamamahala ng nilalaman.

Ang mga pro feature na ito ay makabuluhang pinahusay ang functionality at flexibility ng static WordPress mga site, na nagbibigay-daan para sa mas advanced na pag-deploy, mas mahusay na pagganap, at pinahusay na karanasan ng user.

Hakbang 3: I-initialize ang Git Repository

Ngayong na-set up na natin ang ating static na site generator, ihanda natin ang ating lokal na direktoryo para sa kontrol ng bersyon:

1. Magbukas ng terminal o command prompt.
2. Mag-navigate sa direktoryo na iyong tinukoy sa Simply Static (hal., cd /Users/yourusername/Documents/StaticSite).
3. Magsimula ng bagong Git repository sa pamamagitan ng pagpapatakbo:

   git init

Hakbang 4: Gumawa ng GitHub Repository

Gagamitin namin ang GitHub Desktop upang lumikha at pamahalaan ang aming repositoryo:

1. I-download at i-install ang GitHub Desktop mula sa desktop.github.com kung wala ka pa.
2. Buksan ang GitHub Desktop at mag-sign in sa iyong GitHub account.
3. Mag-click sa "File" > "Bagong Repository" o gamitin ang "Gumawa ng Bagong Repository sa iyong hard drive" na buton.
4. Itakda ang sumusunod:
   • Pangalan: Pumili ng pangalan para sa iyong repository (hal., “my-static-wordpress”)
   • Local Path: Itakda ito sa parehong direktoryo na iyong tinukoy sa Simply Static
   • Simulan ang repositoryong ito gamit ang README: Iwanang walang check
   • Git balewalain: Piliin ang "Wala" (ginawa namin ang sarili namin sa hakbang 3)
   • Lisensya: Pumili ng naaangkop na lisensya o umalis bilang "Wala"
5. I-click ang "Gumawa ng Repository"

Hakbang 5: I-commit ang Repository

Ngayong nai-set up na natin ang ating repositoryo, gawin natin ang ating unang commit:

1. Sa GitHub Desktop, dapat mong makita ang lahat ng mga file sa iyong static na site na nakalista bilang mga pagbabago.
2. Maglagay ng buod para sa iyong commit (hal., “Initial commit of static site files”).
3. I-click ang “Commit to main” (o “Commit to master” sa mga mas lumang bersyon).
4. I-click ang “I-publish ang repository” para itulak ang iyong lokal na repository sa GitHub.

Hakbang 6: Magpatakbo ng Simply Static Export

Ngayon ay oras na para buuin ang aming static na site:

1. Bumalik sa iyong WordPress dashboard.
2. Mag-navigate sa Simply Static > Bumuo. (Maaari mong balewalain ang alerto ng error sa Diagnostics, dahil nagde-deploy ka lang sa isang lokal na direktoryo).
3. I-click ang "Bumuo ng Static Files".
4. Hintaying makumpleto ang proseso. Maaaring tumagal ito ng ilang minuto depende sa laki ng iyong site.
5. Kapag kumpleto na, bumalik sa GitHub Desktop.
6. Dapat mong makita ang mga bagong nabuo o na-update na mga file na nakalista bilang mga pagbabago.
7. I-commit ang mga pagbabagong ito gamit ang isang mensahe tulad ng "I-update ang mga static na file ng site."
8. Itulak ang mga pagbabago sa GitHub sa pamamagitan ng pag-click sa “Push origin”.

Hakbang 7: Ikonekta ang Repository sa isang Hosting Platform

Ngayon na ang aming static na site ay nasa GitHub, madali na naming maikonekta ito sa isang libreng platform sa pagho-host. Magbibigay ako ng mga tagubilin para sa Mga Pahina ng GitHub, Netlify, at Vercel:

Mga Pahina ng GitHub

1. Pumunta sa iyong repository sa GitHub.com.
2. Mag-click sa "Mga Setting" > "Mga Pahina" sa kaliwang sidebar.
3. Sa ilalim ng “Source”, piliin ang “Deploy from a branch”.
4. Piliin ang sangay na gusto mong i-deploy (karaniwang "pangunahing" o "master").
5. Piliin ang root folder (/) at i-click ang “I-save”.
6. Ang iyong site ay magiging live sa https://yourusername.github.io/repository-name/.

netlify

1. Mag-sign up para sa isang libreng account sa netlify.com.
2. I-click ang “Bagong site mula sa Git” sa iyong dashboard ng Netlify.
3. Piliin ang GitHub bilang iyong Git provider at pahintulutan ang Netlify.
4. Piliin ang iyong imbakan mula sa listahan.
5. Iwanang blangko ang build command at i-publish ang direktoryo.
6. I-click ang "I-deploy ang site".
7. Ang iyong site ay magiging live sa isang Netlify subdomain, na maaari mong i-customize sa mga setting ng site.

vercel

1. Mag-sign up para sa isang libreng account sa vercel.com.
2. I-click ang “Bagong Proyekto” sa iyong dashboard ng Vercel.
3. I-import ang iyong GitHub repository.
4. Iwanan ang mga setting ng build kung ano ang mga ito (dapat awtomatikong makita ng Vercel na ito ay isang static na site).
5. I-click ang "I-deploy".
6. Ang iyong site ay magiging live sa isang Vercel subdomain, na maaari mong i-customize sa mga setting ng proyekto.

Buod

Binabati kita! Mayroon ka na ngayong static na bersyon ng iyong WordPress site na naka-host nang libre. Tandaan na muling buuin at itulak ang iyong mga static na file sa tuwing gagawa ka ng mga pagbabago sa iyong WordPress site. Ang daloy ng trabaho na ito ay nagbibigay-daan sa iyo upang tamasahin ang kadalian ng WordPress para sa paglikha ng nilalaman habang nakikinabang mula sa bilis, seguridad, at libreng pagho-host ng isang static na site.

Ilang karagdagang tip:

• Pag-isipang mag-set up ng custom na domain para sa mas propesyonal na hitsura.
• Regular na i-update ang iyong WordPress pag-install at mga plugin upang matiyak na nagtatrabaho ka sa mga pinakabagong feature at mga update sa seguridad.
• Galugarin ang mga advanced na tampok ng Pro na bersyon ng Simply Static, parang nagtatago WordPress at pag-set up ng mga form o paggana ng paghahanap para sa iyong static na site.