How to Create a Local WordPress Site Using XAMPP

, Author

Haluatko oppia WordPress ostamatta verkkotunnus ja hosting? Haluaisitko asentaa WordPressin paikalliselle tietokoneellesi? Haluatko leikkiä verkkosivustollasi vaikuttamatta asiakkaisiin?

Tällöin tämä artikkeli paikallisen WordPress-sivuston luomisesta XAMPP:n avulla on juuri sitä, mitä tarvitset.

XAMPP on ilmainen ohjelmisto, jonka voit asentaa tietokoneellesi ja joka jäljittelee web-palvelinta, jotta voit käyttää WordPressiä. Näin voit suunnitella verkkosivustosi tietokoneellasi ennen kuin lataat sen live-ympäristöön.

Ennen kuin siirrymme ”paikallisen WordPress-sivuston luomiseen”, ymmärtäkäämme, miksi meidän pitäisi luoda paikallinen asennus.

Miksi perustaa WordPress-sivusto paikallisesti?

Palautan mieleeni varhaistaipaleeni verkkosivujen kehittäjänä.

Luodaksemme verkkosivuston ensimmäinen askel olisi palvelimen perustaminen paikalliselle tietokoneelle. Jos verkkosivusto vaatisi tietokannan, seuraava vaihe olisi myös sen perustaminen.

Lyhyesti sanottuna, minun olisi perustettava kehitysympäristö paikalliseen järjestelmääni.

Tätä varten lataisin kaksi erillistä sovellusta, web-palvelinsovelluksen ja tietokannan. Kummallakin on omat asennusproseduurinsa, ja ne on ajettava itsenäisesti, jotta voit aloittaa työskentelyn verkkosivusi parissa. Ennen kuin huomaatkaan, olet käyttänyt pari tuntia ympäristön selvittämiseen ja asentamiseen, jo ennen kuin olet edes aloittanut verkkosivuston kehittämisen!

Mitä paikallisesti kehittämällä voit tehdä, on varmistaa, että sinulla on toimiva malli verkkosivustosta elävällä palvelimella heti ensimmäisestä päivästä lähtien. Se on loistava vaihtoehto, kun haluat testata toiminnallisuutta paikallisesti ennen kuin maailma pääsee näkemään verkkosivustosi.

Opi WordPress ilman verkkotunnusta ja isännöintiä

Toinen syy luoda paikallinen WordPress-sivusto on se, jos olet aloittamassa.

Jos haluat opetella WordPressiä, sinun pitäisi normaalisti investoida verkkotunnukseen ja isännöintiin. Kyllä, on olemassa myös ilmaisia vaihtoehtoja, kuten WordPress.com.

Mutta mahdollistavatko nämä ilmaiset vaihtoehdot kaikkien WordPress.orgin tarjoamien ominaisuuksien ja toimintojen hyödyntämisen? Ei, eivät!

Jos siis haluat oppia WordPressiä investoimatta etukäteen verkkotunnukseen ja hostingiin, on järkevää luoda paikallinen versio sivustostasi.

Siltä varalta, että haluat luoda WordPress-verkkosivuston sen jälkeen, kun olet ostanut verkkotunnuksen ja hostingin, tämän artikkelin aiheesta WordPress-verkkosivuston tekeminen pitäisi olla avuksi.

Mikäli olet ehkä tajunnut, WordPress-verkkosivuston luomiseksi paikallisesti meidän on perustettava paikallinen palvelin. Tai verkkoterminologiassa meidän on perustettava localhost.

Mikä on Localhost?

Localhost viittaa tietokoneeseesi ja siihen, miten pääset siihen käsiksi.

Localhostin avulla päästään käsiksi verkkopalveluihin, kuten hakemistoon, tietokantaan, sähköpostiin, tiedostoihin ja tulostimiin, jotka ovat käynnissä isännällä loopback-verkkoliitännän välityksellä.

Yli liian teknistä? No, annas kun selitän tämän.

Silmukkamekanismia voidaan käyttää verkkopalvelun käyttämiseen isäntäkoneella ilman, että tarvitaan fyysistä (esim, laitteistollista) verkkoliitäntää, kuten verkkoporttia tai pistorasiaa, tai edes verkkoliitäntäohjainta.

Esimerkiksi paikallisesti luotua WordPress-verkkosivustoa voidaan käyttää selaimesta URL-osoitteella ’http://localhost’, kunhan XAMPP-ohjelmistossa tai muussa ohjelmistossa on käytössä Apache- tai paikallinen verkkopalvelinohjelmisto.

Kuten missä tahansa toimialueen nimessä, myös localhostilla on IP-osoite (Internet Protocol). IP-osoitteet vaihtelevat välillä 127.0.0.0.0 – 127.255.255.255.255. Loopback-osoitteen oletusarvoinen IP-osoite on kuitenkin 127.0.0.1.

Tyypillisesti IP-osoitetta käyttäessäsi yrität muodostaa yhteyden etätietokoneeseen internetin välityksellä.

Kirjoittaessasi selaimella esimerkiksi wpastra.com se ohjaa sinut Astran verkkopalvelimelle ja Astran pääsivulle.

Loopback-osoitteella kutsut kuitenkin paikallista haja-asemaosoitetta (localhost), ts, sinun tietokonettasi.

Ja tämän artikkelin vuoksi menemme eteenpäin ja perustamme paikallisen palvelimemme XAMPP:n avulla.

Joka vie meidät seuraavaan aiheeseen.

Mikä on XAMPP?

Kun käsittelimme, mikä on localhost, emme ole käsitelleet sitä, miksi tarvitsemme localhostia.

WordPress on kirjoitettu PHP:llä (Hypertext Preprocessor). Aivan kuten WordPress, myös PHP on avoimen lähdekoodin kieli, ja se on laajalti käytetty ohjelmointi- ja skriptikieli dynaamisten ja vuorovaikutteisten verkkosivustojen luomiseen.

Ja mihin luulet, että kaikki verkkosivustollasi näkyvät tiedot, kuten blogiartikkelit, tuotetiedot, tallennetaan? Siellä MySQL-tietokanta tulee kuvaan.

MySQL on DBMS (Database Management System), jota WordPress käyttää kaikkien verkkosivustosi tietojen tallentamiseen ja hakemiseen.

Jälleen, aivan kuten WordPress ja PHP, myös MySQL on avointa lähdekoodia.

Ja siltä varalta, että mietit, mikä on avoin lähdekoodi.

Noh, avoin lähdekoodi on ohjelmisto, jonka lähdekoodi on vapaasti saatavilla, ja sitä voidaan jakaa edelleen ja muokata niin, että se sopii parhaiten tarpeisiisi.

Ja PHP:n ja MySQL:n pyörittämiseen, joita puolestaan tarvitaan WordPress-verkkosivustosi pyörittämiseen, tarvitset web-palvelimen.

Joo, arvasit oikein.

Lääkitäksesi paikallisen web-palvelimen, sinun on asennettava XAMPP.

xamppin kotisivu

Kuten heidän kotisivuillaan kerrotaan, XAMPP on erittäin suosittu PHP-kehitysympäristö.

Aloittelijalle Apache-, PHP- ja MySQL-ympäristöjen asentaminen erikseen paikalliselle tietokoneellesi voi olla ylivoimaista. Siinä XAMPP:n käyttäminen auttaa.

XAMPP on täysin ilmainen ja helposti asennettava ohjelmistopaketti, joka auttaa sinua perustamaan paikallisen palvelinympäristön.

Ohjelmiston voi ladata Windowsille, Linuxille ja Macille.

Tässä artikkelissa menemme eteenpäin ja asennamme XAMPP:n, jotta voimme käyttää localhostia sekä Windowsissa että Macissa.

Vaihe 1: Lataa ja asenna XAMPP paikalliselle tietokoneellesi

XAMPP:n asentaminen Windowsiin

Käy XAMPP:n verkkosivulla ja napsauta ’XAMPP for Windows’. Asennustiedosto (EXE-tiedosto) latautuu. Klikkaa asennusohjelmaa ja jatka ohjeiden mukaan.

xampp setup 2

Voit jättää oletusasetukset alla olevan kuvan mukaisiksi.

xampp setup 3

Voit halutessasi päättää kansiosta, johon haluat asentamaan XAMPPin.

xampp setup 4

Kohdeasemaksi ja -kansioksi valitaan oletusarvoisesti ”C:\xampp”.

xampp setup 5

Esimerkkikieleksi asetetaan oletusarvoisesti englanti.

xampp setup 6
xampp setup 7

Klikkaa ’Next’, kun löydät ylläolevan ikkunan, jossa kysytään ’Ready to Install’.

xampp setup 8

Mahdollisesti sinua pyydetään myös tietoturvahälytyksen kautta sallimaan pääsy asennukseen.

xampp-asennus 9

Klikkaa ’Salli pääsy’ jatkaaksesi.

xampp-asennus 10

Tässä se on! XAMPP on asennettu.

Klikkaamalla ’Valmis’, ohjauspaneeli avautuu.

xampp-asetukset

Hallintapaneelissa voit ’Käynnistää’ ja ’Pysäyttää’ vastaavia palveluita.

Klikkaa ’Käynnistää’ Apachea ja MySQL:ää vastaan.

xampp-asetukset wordpressille

Tarkista nyt, että asennus on suoritettu onnistuneesti, kirjoittamalla selaimeesi ’http://localhost’.

localhost onnistuneesti asennettu

Kun asennus on onnistunut, pääset yllä olevalle etusivulle.

Nyt kun olemme asentaneet XAMPP:n paikallisesti Windows-käyttöjärjestelmään, tarkastellaanpa vaiheita XAMPP:n asentamiseksi paikallisesti Mac-käyttöjärjestelmään.

XAMPP:n asentaminen Mac-käyttöjärjestelmään

Maciin asennuksen vaiheet ovat suurin piirtein samat, mutta muutama ero on syytä huomioida.

Aluksi sen sijaan, että napsauttaisit ’XAMPP for OS X’-välilehteä etusivulla, napsauta ’Klikkaa tästä muita versioita’ -linkkiä ’Lataa’ -kohdassa.

Lataa xampp for OS X 1

Jossain tapauksissa oletusarvoinen lataustiedosto sen jälkeen, kun olet napsauttanut välilehteä ’XAMPP for OS X’

jossain tapauksissa oletusarvoinen lataustiedosto sen jälkeen, kun olet napsauttanut välilehteä. Näin ollen on suositeltavaa valita toinen versio lataustiedostosta.

Sivun ’Muut versiot’ alla selaa alaspäin kohtaan ’XAMPP for OS X’.

Lataa xampp for OS X 2

Klikkaa ’Lisää latauksia’.

Sinut ohjataan ulkoiselle verkkosivustolle.

Lataa xampp for OS X 3

Valitse ’XAMPP Mac OS X’.

Ja klikkaa sitten ’7.4.11’. Tässä vaihtoehdossa on maksimilataukset viikossa.

Lataa xampp for OS X 4

Nyt huomaat, että ohjelmistosta on kaksi versiota.

Ensimmäinen on ’xampp-osx-7.4.11-0-vm.dmg’ ja toinen on ’xampp-osx-7.4.11-0-installer.dmg’.

Lataa xampp for OS X 5

Valitse ’installer’-versio.

Kunhan lataus on valmis, kaksoisnapsauta kuvaa aloittaaksesi asennusprosessin.

xampp-asennus Macilla

Ja vedä sitten XAMPP-kansio Sovellukset-kansioon.

Ei muuta. XAMPP on nyt asennettu hakemiston ’/Applications/XAMPP’ alle.

Kaksoisklikkaa XAMPP:tä. Sinua pyydetään jatkamaan sovelluksen avaamista. Napsauta ’Avaa’.

Avaa xampp-asennus Macissa

Asennusprosessi käynnistyy, ja voisit seurata seuraavia vaiheita, jotka ovat itsestään selviä, kuten alla näkyy.

xampp-asennus Mac 1
xampp-asennus Mac 2

Yllä näkyvässä ikkunassa voit valita tai poistaa haluamasi komponentit, jotka haluat asentaa.

’XAMPP Developer Files’ voidaan halutessasi poistaa valinta. ’XAMPP Core Files’ on pakollinen ja pysyy valittuna.

xampp-asennus Mac 3
xampp-asennus Mac 4
xampp-asennus Mac 3</figure></div>. 5
xampp-asennus Maciin 6
xampp-asennus Maciin 7

Asennusprosessin ollessa valmis, käynnistä XAMPP klikkaamalla ’Finish’-painiketta.

Tällöin sovellusikkuna avautuu kuvan mukaisesti.

xamppin asennus Mac 8:ssa

Klikkaa ’Siirry sovellukseen’ tai kirjoita selaimeen ’http://localhost’ tarkistaaksesi, onko asennusprosessi sujunut hyvin.

xamppin onnistunut asennus Macissa

Jos löydät yllä olevan sivun, no sitten olet onnistuneesti asentanut XAMPPin paikalliseen Mac-tietokoneeseesi.

xampp manage servers on Mac

Palaa takaisin sovellusikkunaan ja napsauta välilehteä ’Manage Servers’ (Hallitse palvelimia).

Huomaa, että oletusarvoisesti ’Apache Web Server’ on käynnissä. Jos tämä ei ole käynnissä, et ehkä pääse localhost-sivulle. Käynnistääksesi palvelun sinun tarvitsee vain napsauttaa ’Käynnistä’ -painiketta. Vastaavasti lopettaaksesi Apache-palvelun suorittamisen, napsauta ’Stop’-painiketta.

Vaikka käsittelemme tätä seuraavassa vaiheessa, suosittelen myös ’MySQL Database’-palvelun käynnistämistä.

Nyt kun olemme asentaneet XAMPP:n paikalliselle tietokoneellemme, seuraava vaihe on WordPressin asentaminen.

Vaihe 2. Lataa ja asenna WordPress paikalliselle tietokoneelle

Lataa WordPressin uusin versio (tällä hetkellä 5.5.3) osoitteesta WordPress.org.

Lataa WordPress

Latautuu tiedosto ’wordpress-5.5.3.zip’. Pura tiedoston sisältö.

WordPress-kansio

Kuten yllä olevassa kuvassa näkyy, tiedoston sisältö on purettu kansioon ’wordpress-5.5.3’. Kyllä, jos sinulla on eri WordPress-versio, kansion nimi muuttuu vastaavasti.

Kopioi nyt ’wordpress’-kansio. Tämä kansio sisältää kaikki WordPress-sivuston luomiseen tarvittavat tiedostot.

Siirry XAMPP-kansioon.

XAMPP-kansio

XAMPP-kansion alta huomaat ’htdocs’-kansion.

Siirrä ’wordpress’-kansio ’htdocs’-kansioon.

Lataa WordPress XAMPP:hen

Kun olet siirtänyt kansion ’htdocs’-kansioon, voit nimetä kansion uudelleen haluamallasi tavalla. Tyypillisesti voit nimetä kansion sen mukaan, mitä verkkosivustoa olet luomassa.

Olen esimerkiksi nimennyt kansion uudelleen muotoon ’wpastra’, kuten yllä olevassa kuvassa näkyy.

Käyttääksesi nyt WordPress-verkkosivustoasi ja tarkistaaksesi, että asennus on mennyt läpi ilman virheitä, kirjoita selaimessa URL-osoite ’http://localhost/<wordpress-kansio>’. Jossa ’<wordpress-kansio>’ on syöttämäsi kansion nimi.

Joka minun tapauksessani on ’http://localhost/wpastra’.

Onnistuneen asennuksen jälkeen sinun pitäisi päästä seuraavalle sivulle.

WordPressin kieliasetus XAMPP:n avulla

Valitse haluamasi kieli ja klikkaa Jatka.

Seuraavalla sivulla, kuten alla näkyy, sinua pyydetään syöttämään tietokantasi tiedot.

XAMPP enter WordPress database details prompt

Ja miten tarkalleen ottaen saamme tietokannan tiedot?

Noh, tässä kohtaa viimeinen vaiheemme astuu kuvaan.

Ja vielä lisäyksenä, vaiheet WordPressin asentamiseksi paikallisesti Macille ovat samat tähän asti.

Vaihe 3. MySQL-tietokannan perustaminen

Käy takaisin localhostin pääsivulle, eli ’http://localhost’. Sinun pitäisi ohjautua Dashboardiin (http://localhost/dashboard).

XAMPP WordPress-tietokannan asennus 1

Klikkaa sivun oikeassa yläkulmassa olevaa ’phpMyAdmin’-linkkiä.

Siut ohjataan ’phpMyAdmin’-kojelautaan.

XAMPP WordPress-tietokannan asennus 2

Vasemmalla puolella huomaat useita olemassa olevia tietokantojen nimiä.

Luo uusi tietokanta napsauttamalla yläreunassa olevaa välilehteä ’Tietokannat’.

XAMPP WordPress-tietokannan asetukset 3

Syötä ’Tietokannan nimi’ ja klikkaa ’Luo’.

XAMPP WordPress-tietokannan asetukset 4

Loin esimerkiksi tietokannan nimellä ’wpastra’.

XAMPP WordPress-tietokannan asennus 5

Nyt kun tietokanta on luotu, siirry takaisin WordPressin asennussivulle ja klikkaa ”Let’s go!”.

XAMPP WordPress-asennuksen tietokanta-asetukset

Kirjoita aluksi ’Tietokannan nimi’ -kohtaan äsken luodun tietokannan nimi.

Käyttäjätunnuksen ’Käyttäjätunnus’ kohdalle kirjoita sama kuin ’root’. Ja ’Salasana’ -kentän voi jättää tyhjäksi. Jätä loput kaksi kenttää, eli ’Database Host’ ja ’Table Prefix’, oletusarvoiksi. Jotka ovat vastaavasti ’localhost’ ja ’wp_’.

Kun olet valmis, napsauta ’Submit’.

XAMPP WordPress run installation

Sinun pitäisi nyt päästä seuraavalle sivulle. Jos näin on, niin silloin yhteytesi tietokantaan toimii hienosti!

Jatka eteenpäin ja klikkaa ’Suorita asennus’.

XAMPP WordPressin asennusasetukset

Kirjoita ’Sivuston nimi’, ’Käyttäjätunnus’, ’Salasana’ ja ’Sähköpostiosoitteesi’.

Kuten yllä olevasta kuvasta näkyy, olen kirjoittanut vaaditut kentät.

Ja klikkaa sitten ’Asenna WordPress’.

WordPressin onnistunut asennus Windowsissa

Klikkaa ’Kirjaudu sisään’, kun asennus on suoritettu onnistuneesti.

WordPressin kirjautumissivu

Ja saat näkyviin WordPressin kirjautumisnäytön.

Syötä äsken luomaasi käyttäjätunnusta ja salasanaa.

Wordpressin asennus XAMPP:n avulla

Ja voilà! Olet WordPressin kojelaudalla. Olet luonut paikallisen WordPress-sivuston XAMPP:n avulla.

Voit käyttää sivustoasi syöttämällä URL-osoitteen, joka tässä esimerkissä on ’http://localhost/wpastra’.

WordPress-verkkosivusto XAMPP:llä

Asenna teemat ja liitännäisohjelmat, testaa täydelliset toiminnallisuudet ja luo WordPress-verkkosivustosi paikallisesti. Paikallinen asennus toimii täsmälleen samalla tavalla kuin isännöity versio.

  1. How to Install Astra Theme?
  2. How to Install Starter Templates (Free) Plugin?
  3. Best Free Theme for Elementor

MySQL:n asentaminen Macissa

Vaikka suurin osa edellä mainituista vaiheista MySQL:n asentamisessa ja tietokannan luomisessa paikallisesti Windows-käyttöjärjestelmässä ovat samoja, on pari eroa huomioitava.

Ja huomioitavat vaiheet ovat tietokannan tietojen syöttämisen jälkeen.

XAMPP WordPress -tietokannan asetukset Macille

Kuten edellä on esitetty, vaiheet tähän asti ovat samat kuin aiemmin selitetty.

Tietokannan tietojen syöttämisen jälkeen napsauta ’Lähetä’.

Löydät nyt itsesi alla olevan kuvan mukaiselta sivulta, jossa on hieman PHP-koodia.

XAMPP WordPress-asennus Macille wp-konfiguraatioasetukset

Kopioi yläpuolella korostettu koodi ja luo tiedosto ’wp-config.php’.

Vaihtoehtoisesti, jos tarkastat XAMPP-kansioon siirtämäsi ’wordpress’-kansion, huomaat tiedoston nimeltä ’wp-config-sample.php’.

wp-konfigurointitiedoston asetukset Mac OS:lle

Avaa tämä tiedosto valitsemallasi tekstieditorilla. Poista tiedoston sisältö ja korvaa se juuri kopioimallasi koodilla. Ja tallenna tiedosto.

Kun olet suorittanut tämän vaiheen, nimeä tiedosto uudelleen muotoon ’wp-config.php’.

Ja palaa sitten takaisin asennusprosessiin ja napsauta ’Suorita asennus’.

XAMPP WordPress -asennusasetukset

Loppuosa askeleista on samoja, joita on käsitelty aiemmin, kun MySQL:n asetuksia on määritetty Windows-käyttöjärjestelmään.

WordPressin onnistunut asennus windowsissa

Ja olet onnistuneesti asentanut WordPressin paikallisesti myös Mac-järjestelmään.

Vianmääritys yleisimpiin ongelmiin XAMPP:n ja WordPressin asentamisen aikana

Voi olla, että minulla on ollut tuuria XAMPP:n ja WordPressin asentamisen aikana, kun olin laatimassa tätä artiklaa. Jos kuitenkin kohtaat ongelmia asennuksen aikana, tässä on linkkejä joihinkin yleisiin ongelmiin ja niiden ratkaisuihin.

  1. XAMPP for Windows FAQs
  2. XAMPP for OS X FAQs
  3. XAMPP asennettu, miten lisätä WordPress

Johtopäätökset

Kuten tässä artikkelissa mainittiin, jos haluat luoda paikallisen WordPress-sivuston ja testata sen toiminnallisuuksia, ennen kuin teet sivustosta live-sivun, WordPressin asentaminen paikallisesti on hyvä käytäntö.

Ja nyt kun olemme käsitelleet paikallisen WordPress-sivuston luomista XAMPP:n avulla sekä Windows- että Mac-käyttöjärjestelmissä, uskomme, että sinun pitäisi olla helppo seurata sitä.

Haluaisimme kuulla sinusta. Kerro meille, jos olet onnistunut perustamaan WordPress-sivuston paikallisesti edellä mainittujen vaiheiden avulla.

Vastaa

Sähköpostiosoitettasi ei julkaista.