WordPress er et kraftig og populært innholdsstyringssystem, men som er vert for en dynamikk WordPress nettstedet kan være kostbart og kreve løpende vedlikehold. For mange enkle nettsteder eller blogger kan en statisk versjon av en WordPress nettstedet kan være et utmerket alternativ. Statiske nettsteder er raskere, sikrere og kan hostes gratis på plattformer som GitHub Pages, Netlify eller Vercel.
I denne opplæringen vil jeg gå gjennom prosessen med å lage en statisk versjon av din WordPress nettstedet og hoste det gratis. Denne tilnærmingen er perfekt for nybegynnere som ønsker å utnytte det brukervennlige WordPress grensesnitt for innholdsskaping mens du nyter fordelene ved et statisk nettsted.
Verktøy du trenger
Før du dykker inn i prosessen, la oss sørge for at du har alle nødvendige verktøy. Her er en liste over alt du trenger for å være vert for din statiske WordPress nettsted gratis:
• LocalWP: En gratis lokal WordPress utviklingsverktøy som lar deg bygge og teste WordPress nettsteder offline.
• Rett og slett statisk: En gratis WordPress plugin som genererer en statisk versjon av din WordPress området.
• gå: Versjonskontrollsystem for sporing av endringer i filene dine. Kommer vanligvis forhåndsinstallert på Mac og Linux. Windows-brukere kan laste ned fra git-scm.com
• GitHub Desktop: Et brukervennlig grensesnitt for å administrere Git-repositories. Last den ned fra: desktop.github.com
• GitHub-konto: Du trenger dette for å være vert for depotet ditt og bruke GitHub-sider. Registrer deg gratis på: github.com
• Vertsplattformkonto: Velg ett av følgende:
- GitHub-sider (følger med GitHub-kontoen din)
- Netify: netify.com
- Vercel: vercel.com
Før du fortsetter med opplæringen, sørg for at du har disse verktøyene installert og kontoer satt opp. Å ha alt klart vil gjøre prosessen jevn og grei.
Trinn 1: Utvikle din WordPress Nettsted på LocalWP
Før vi begynner, må du ha din WordPress siden klar. Hvis du ikke har opprettet nettstedet ditt ennå, eller hvis det for øyeblikket er vert et annet sted, anbefaler jeg å bruke LocalWP (tidligere Local by Flywheel) for å utvikle og teste nettstedet ditt lokalt.
- Last ned og installer LocalWP gratis fra localwp.com.
- Lage en ny WordPress nettsted i LocalWP.
- Design nettstedet ditt, legg til innhold og installer nødvendige plugins.
- Sørg for at nettstedet ditt ser ut og fungerer akkurat slik du vil ha det i sin statiske form.
Forstå begrensninger for statiske nettsteder
Mens statisk WordPress nettsteder tilbyr fordeler som forbedret hastighet, sikkerhet og gratis vertsalternativer, det er viktig å være klar over deres begrensninger. Noen dynamiske trekk ved WordPress vil ikke fungere i et statisk miljø:
- WordPress Skjemaer: Tradisjonell WordPress skjemaer som er avhengige av behandling på serversiden vil ikke fungere. Dette inkluderer kontaktskjemaer, abonnementsskjemaer og andre interaktive skjemaer.
- WordPress Kommentar: Dynamiske kommentarsystemer som tillater brukerinteraksjoner i sanntid, støttes ikke på statiske nettsteder.
- Admin områdetilgang: Eventuelle lenker til
/wp-admin
eller lignende internt WordPress ruter vil ikke fungere, da disse krever behandling på serversiden. - Innholdsoppdateringer i sanntid: Statiske nettsteder krever regenerering og omdistribuering for at eventuelle innholdsendringer skal vises, i motsetning til dynamiske WordPress nettsteder hvor endringer er umiddelbare.
- Bruker autentisering: Funksjoner som krever brukerpålogging eller medlemskap støttes ikke i et grunnleggende statisk nettstedoppsett.
- E-handelsfunksjonalitet: Dynamiske handlekurver og betalingsbehandling vil vanligvis ikke fungere i et statisk miljø.
- Søkefunksjonalitet: WordPresssin innebygde søkefunksjon vil ikke fungere, selv om alternativer kan implementeres (som nevnt i Simply Static Pro-funksjonene).
- Dynamiske sidefelt og widgeter: Widgets som trekker sanntidsdata eller krever behandling på serversiden, vil ikke fungere som forventet.
Mulige løsninger
Selv om disse begrensningene eksisterer, er det måter å redusere noen av dem på:
- For skjemaer kan du bruke tredjepartstjenester som Formspree eller Netlify Forms.
- Kommentarer kan håndteres gjennom tjenester som Disqus eller Facebook Comments.
- Søkefunksjonalitet kan implementeres ved å bruke klientsideløsninger som Lunr.js eller Algolia (som tilbys i Simply Static Pro).
- For e-handel, vurder å bruke eksterne tjenester som Snipcart eller Gumroad.
Når du utvikler din WordPress nettsted, hold disse begrensningene i bakhodet og planlegg strukturen og funksjonene på nettstedet deretter. Fokuser på innholdsdrevne sider og minimer avhengigheten av dynamiske funksjoner som ikke vil oversettes til et statisk miljø.
Trinn 2: Installer og konfigurer Simply Static
Simply Static er en gratis WordPress plugg inn som genererer en statisk versjon av din WordPress nettstedet. Slik setter du det opp:
- I din WordPress dashbord, gå til Plugins > Legg til ny.
- Søk etter «Simply Static», installer plugin og aktiver plugin.
- Gå til Simply Static > Settings i din WordPress dashbordet.
- Under fanen "Generelt" angir du følgende:
- Destinasjonsadresser: Velg «Lagre for bruk uten nett». Hvis du allerede har et egendefinert domene, velg "Absolutt URLs", i henhold til skjermbildet nedenfor:
- Lokal katalog: Sett dette til en katalog utenfor din WordPress installasjon, f.eks.
/Users/yourusername/Documents/StaticSite
- Under «Inkluder/ekskluder»-fanen, sørg for at alle nødvendige nettadresser er inkludert.
- I de fleste tilfeller bruker du /wp-content/ og /wp-includes/
- Lagre innstillingene.
Det er også en pro-versjon av SimplyStatic, Her er et sammendrag av pro-funksjonene til Simply Static-plugin:
- Avansert distribusjon:
- Distribuer statiske nettsteder til flere plattformer, inkludert SimplyCDN, GitHub, Amazon AWS S3, Digital Ocean Spaces og BunnyCDN.
- Enkle nettstedoppdateringer:
- Administrer innholdsoppdateringer effektivt, enten det er for enkeltinnlegg, masseoppdateringer eller spesifikke nettadresser.
- Integrasjon av skjemaer og kommentarer:
- Integrer sømløst skjemaer fra populære plugins som Contact Form 7, Gravity Forms og Elementor Forms i det statiske nettstedet ditt.
- Søkefunksjonalitet:
- Implementer grunnleggende søk med Fuse.js eller oppgrader til en mer omfattende søkeopplevelse med Algolia.
- WP-CLI-støtte:
- Bruk WP-CLI til å konfigurere, eksportere og administrere Simply Static-funksjoner direkte fra kommandolinjen.
- Flerspråklig støtte:
- Tilby innhold på flere språk med integrasjoner for WPML, Polylang og TranslatePress.
- Minifisering:
- Optimaliser nettstedets ytelse ved å redusere CSS, JavaScript og statiske HTML-filer.
- WordPress Skjul:
- Erstatt standard WordPress veier for å skjule det faktum at WordPress brukes som innholdsstyringssystem.
Disse pro-funksjonene forbedrer funksjonaliteten og fleksibiliteten til statisk betydelig WordPress nettsteder, noe som gir mulighet for mer avanserte distribusjoner, bedre ytelse og forbedret brukeropplevelse.
Trinn 3: Initialiser Git Repository
Nå som vi har satt opp vår statiske nettstedsgenerator, la oss forberede vår lokale katalog for versjonskontroll:
- Åpne en terminal eller ledetekst.
- Naviger til katalogen du spesifiserte i Simply Static (f.eks.
cd /Users/yourusername/Documents/StaticSite
). - Initialiser et nytt Git-depot ved å kjøre:
git init
Trinn 4: Opprett et GitHub-depot
Vi bruker GitHub Desktop til å opprette og administrere depotet vårt:
- Last ned og installer GitHub Desktop fra desktop.github.com hvis du ikke allerede har det
- Åpne GitHub Desktop og logg på GitHub-kontoen din.
- Klikk på "Fil"> "Nytt arkiv" eller bruk knappen "Opprett et nytt arkiv på harddisken".
- Still inn følgende:
- Navn: Velg et navn for depotet ditt (f.eks. "my-static-wordpress")
- Lokal bane: Sett denne til samme katalog som du spesifiserte i Simply Static
- Initialiser dette depotet med en README: La det være umerket
- Git ignore: Velg "Ingen" (vi laget vår egen i trinn 3)
- Lisens: Velg en passende lisens eller la stå som "Ingen"
- Klikk "Opprett arkiv"
Trinn 5: Overfør depotet
Nå som vi har satt opp depotet vårt, la oss gjøre vår første forpliktelse:
- I GitHub Desktop bør du se alle filene på det statiske nettstedet ditt oppført som endringer.
- Skriv inn et sammendrag for forpliktelsen din (f.eks. "Initial commit of static site files").
- Klikk "Forplikte til hoved" (eller "Forplikte deg til master" i eldre versjoner).
- Klikk på "Publiser repository" for å skyve ditt lokale depot til GitHub.
Trinn 6: Kjør en ganske enkelt statisk eksport
Nå er det på tide å generere vårt statiske nettsted:
- Gå tilbake til din WordPress dashbordet.
- Naviger til Simply Static > Generer. (Du kan ignorere diagnostikkfeilvarselet, siden du bare distribuerer til en lokal katalog).
- Klikk på "Generer statiske filer".
- Vent til prosessen er fullført. Dette kan ta noen minutter avhengig av størrelsen på nettstedet ditt.
- Når du er ferdig, gå tilbake til GitHub Desktop.
- Du bør se de nylig genererte eller oppdaterte filene oppført som endringer.
- Bekreft disse endringene med en melding som "Oppdater statiske nettstedsfiler".
- Send endringene til GitHub ved å klikke på "Push origin".
Trinn 7: Koble depotet til en vertsplattform
Nå som vårt statiske nettsted er på GitHub, kan vi enkelt koble det til en gratis vertsplattform. Jeg vil gi instruksjoner for GitHub-sider, Netlify og Vercel:
GitHub-sider
- Gå til depotet ditt på GitHub.com.
- Klikk på "Innstillinger"> "Sider" i venstre sidefelt.
- Under "Kilde", velg "Deploy from a branch".
- Velg grenen du vil distribuere (vanligvis "hoved" eller "master").
- Velg rotmappen (/) og klikk "Lagre".
- Siden din vil være live kl
https://yourusername.github.io/repository-name/
.
Netlify
- Registrer deg for en gratis konto på netify.com.
- Klikk "Ny side fra Git" på Netlify-dashbordet.
- Velg GitHub som din Git-leverandør og autoriser Netlify.
- Velg depotet ditt fra listen.
- La byggekommandoen og publiser katalogen stå tom.
- Klikk på "Deploy nettsted".
- Nettstedet ditt vil være live på et Netlify-underdomene, som du kan tilpasse i nettstedinnstillingene.
Vercel
- Registrer deg for en gratis konto på vercel.com.
- Klikk "Nytt prosjekt" på Vercel-dashbordet.
- Importer GitHub-depotet ditt.
- La byggeinnstillingene være som de er (Vercel skal automatisk oppdage at det er et statisk nettsted).
- Klikk på "Deploy".
- Nettstedet ditt vil være live på et Vercel-underdomene, som du kan tilpasse i prosjektinnstillingene.
Oppsummering
Gratulerer! Du har nå en statisk versjon av din WordPress nettstedet vert gratis. Husk å regenerere og push de statiske filene dine hver gang du gjør endringer i din WordPress nettstedet. Denne arbeidsflyten lar deg nyte den enkle WordPress for innholdsskaping mens du drar nytte av hastigheten, sikkerheten og gratis hosting av et statisk nettsted.
Noen flere tips:
- Vurder å sette opp et tilpasset domene for et mer profesjonelt utseende.
- Oppdater din regelmessig WordPress installasjon og plugins for å sikre at du jobber med de nyeste funksjonene og sikkerhetsoppdateringene.
- Utforsk avanserte funksjoner i Pro-versjon av Simply Static, som å gjemme seg WordPress og sette opp skjemaer eller søkefunksjonalitet for ditt statiske nettsted.