Kuinka luoda yrityksen verkkosivusto – täydellinen vaihe vaiheelta -video-ohje!

WordPress-tarjoukset


En koskaan aloittaisi viestiä niin dramaattisesti, mutta DAMN onko meillä tänään jotain erityistä: täydellinen askel askeleelta video-opas (ilman mitään ohitettua) ammattimaisen pienyritysten WordPress-verkkosivuston luominen!

Mikä tekee tästä videosta niin erityisen, on pohjimmiltaan kolme asiaa: 1. Se tosiasia, että juuri näin me itse toimisimme sen tekemiseen (ja olemme valitettavasti melko paljon asiantuntijoita tässä); 2. Tarkka taso, johon menemme – video on mahtava puolitoista tuntia pitkä, ja luomme pienyritysten verkkosivun alusta loppuun; ja 3. Että video on suunnattu aloittelijoille – ihmisille, jotka eivät todennäköisesti ole aiemmin tehneet mitään tällaista (ja näkevät silti koko idean itselleen sivuston luomisesta jotain todella pelottavaa).

Seuraamalla yksinkertaisesti seuraamalla napsauttamalla napsauttamalla napsauttamalla ja napsauttamalla hiukan ajattelemalla muutamien seikkojen muuttamista oman yrityksesi sopimiseksi, toivottavasti pystyt tekemään samankaltaisesti fantastisen (ja teknisesti loistavan) WordPress-verkkosivuston!

Joten, mitä sinä odotat? Aloittaa!

Kuinka luoda Professional Business -verkkosivusto WordPressillä:

Suora linkki katsoaksesi videota Vimeossa.

– (huomautus: videohyvitykset Topher DeRosialle – HeroPressin luojalle

Videon transkriptio:

Tässä videossa aion näyttää, kuinka luoda ammattimaiselle yritykselle suunnattu verkkosivusto WordPressin avulla. Menemme askel askeleelta, enkä jätä mitään pois. Liiketoiminta, jota aiomme käyttää mallina, on coworking-tila. Jos haluat tutustua tämän verkkosivuston lopulliseen versioon, voit siirtyä osoitteeseen coworkerpro.com. Elementtejä, jotka aiomme laittaa tälle sivustolle, voitaisiin käyttää missä tahansa yrityssivustossa. Siellä on toimintakehotus. Hieman meistä. Jotkut henkilökunnasta, suosittelut ja yhteydenottolomake sekä useita muita sivuja. Joten yrityksestäsi riippumatta, tämän videon lopussa sinulla tulisi olla siihen huipputasoinen verkkosivusto. Aiomme isännöidä sivustoamme Sitegroundissa. Katsomme kaikki, mitä he tarjoavat, ja kuinka helppoa on saada asiat liikkumaan. Asennamme muutamia ylimääräisiä laajennuksia auttaaksemme, ja käytämme Themeislen Hestia-teemaa. Hestian avulla voimme käyttää WordPressiin sisäänrakennettua mukautinta muokataksesi sivun kaikkia osia suoraan käyttöliittymästä. Tarkastelemme myös useita työkaluja, joiden avulla sivustomme toimii nopeammin ja paremmin. Tarkastelemme Sitegroundin omaa optimoijaa. Yhdistämme Google-hakukonsolin ja Google Analyticsin sekä Yoast SEO: n hakukoneiden optimointiin. Ja sitten käytämme Automatticin Jetpack-laajennusta roskapostin, varmuuskopioiden ja joidenkin lisätilastojen hallintaan. Jos seuraat vain muutamassa tunnissa, sinulla olisi oltava täydellinen, kaunis, toimiva, yrityssivusto, joka on käyttövalmis. Joten aloitetaan. Ensimmäinen asia, jonka haluamme perustaa, on web-hosting. Nyt web-hosting on se, missä sivustosi tulee olemaan Internetissä. Se on eräänlainen kuin vuokra-autotallin hankkiminen asioiden säilyttämistä varten. Vuokraat vähän tilaa, laitat verkkosivustosi siihen, ja ihmiset voivat käydä siellä. Sivusto, jota aiomme käyttää, on nimeltään Siteground. He ovat erinomainen isäntä, jolla on parhaat hinnat ja paljon ominaisuuksia, joista pidän todella. Mutta ennen kuin aloitamme täällä, haluan näyttää sinulle jotain WinningWP.com-sivustossa. Sitegroundilla ja WinningWP: llä on järjestely, jolla voit säästää% sivuston isännöinnistä. Lisäksi WinningWP saa pienen siivin rahaa, jonka aiot maksaa. Tämä raha menee tällaisten videoiden luomiseen, joten se on todella win-win-tilanne, jossa saat edullista majoitusta, hienoa sisältöä ja myös WinningWP saa vähän. Nyt, jotta voit käyttää tätä sopimusta, sinun tarvitsee vain siirtyä tälle sivulle. Videon alla on linkki. Napsauta sitten Käytä kuponki. Ja siellä olemme, sanotaan, erikoistarjous WinningWP.com-kävijöille. Ja me valitsemme suunnitelman. Suunnitelma, johon aiomme mennä, on GrowBig-suunnitelma. Siinä on vain tarpeeksi lisäominaisuuksia StartUp: n suhteen, että pidän siitä todella. Mutta GoGeek on oikeastaan ​​hiukan isommille sivustoille kuin aiomme rakentaa. Joten valitaan GrowBig. Ja napsaamme aloittaaksesi. Nyt osa tämän videon prosessista on uuden verkkotunnuksen rekisteröinti. Jos sinulla on jo rekisteröity verkkotunnus, Sitegroundilla on täällä hienoja ohjeita siitä, miten osoittaa se sivustollesi tai siirtää nimi oikein Sitegroundiin. Kumpikin toimii erittäin hyvin, ja heillä on hyviä tietoja siitä, kuinka molemmat tehdään täällä. Aiomme hankkia uuden, ja siitä tulee coworkerpro.com. Nyt tämä verkkotunnus maksaa $. vuosi. Ja kun ajattelet sitä vuotuisena hinnana, se ei todellakaan ole kovin paljon. Napsautetaan jatka. Tässä sanotaan, onnittelut, verkkotunnuksemme on saatavilla. Nyt aiomme luoda tilin Sitegroundissa. Ensin laitamme sähköpostiosoitteen ja sitten Siteground-salasanan. Tämä ei ole verkkotunnuksesi tai FTP: n tai muun vastaavanlainen salasana, tämä on vain sisäänkirjautuminen Sivustokenttään. Seuraavaksi laitamme henkilökohtaisia ​​tietoja. Seuraavaksi lisäämme luottokorttitietomme. Ja tässä aiomme sanoa, että laskutusosoitteemme on sama kuin yllä olevissa yhteystiedoissa. Ja nyt aiomme arvioida, mitä ostamme. Meillä on GrowBig-suunnitelma. Tietokeskuksemme tulee olemaan Chicagossa. Se on melko lähellä minne olen. Mutta sinulla on valinta, se voi olla muita paikkoja, sinun tarvitsee vain napsauttaa tätä painiketta. Ostan kuukausisuunnitelman dollarilla. kuukaudessa, joten nyt minulta laskutetaan $ .. Lisää verkkotunnuksen rekisteröinti hintaan $ .. Lisäksi me todella haluamme verkkotunnuksen yksityisyyden. Tämä estää roskapostittajia indeksoimasta verkkotunnusrekisteriä etsimässä sähköpostiosoitteita. Viimeiseksi on Siteground-sivustoskanneri. Tämä tarkkailee sivustoasi etsimällä hakkereita ja hyökkäyksiä ja vastaavia. Se on sen arvoista, se saa sinut askeleen eteenpäin pahoista pojista. Joten sitten kokonaismääräni tulee olemaan $ .. Mutta hieno asia on, että tämä maksaa koko vuoden, joten sinun ei tarvitse ajatella sitä uudelleen vuoden ajan. Vahvistamme palvelusehdot ja napsautamme maksaa nyt. Ja tilauksemme on lähetetty. Voimme kirjautua asiakasalueellemme heti. Verkkotunnusten rekisteröinti voi kestää jopa tunteja. Joten verkkotunnuksemme ei toimi heti. Nyt kun olemme luoneet Siteground-tilimme, voimme siirtyä luomamme verkkotunnukseen ja nähdä tämän paikkamerkin. Kaikilla Sitegroundin uusilla verkkotunnuksilla on tällainen paikkamerkki, ja se pysyy siinä, kunnes asennamme oman verkkosivustomme. Joten seuraavaa askelta varten siirrytään eteenpäin ja asennetaan WordPress. Siirry ensin sivustoon Siteground.com ja kirjaudu sisään aiemmin luomalla tilillä. Nyt kun olemme kirjautuneena sisään täällä pääpaneeliin, kuuluu pieni hälytys, joka kertoo, että sinulla on uusi isäntätili, jota et ole vielä luonut. Ja jos napsautamme näkymää, se antaa meille useita vaihtoehtoja. Voimme perustaa uuden verkkosivuston, siirtää verkkosivuston tai sanoa, että emme tarvitse apua nyt. Tai voimme napsauttaa tätä pientä nuolta ja se palaa myöhemmin. Mutta aiomme mennä eteenpäin ja perustaa uuden verkkosivuston. Haluamme WordPressin. Ja nyt lisäämme WordPress-tilitietoja. Joten tämä koskee WordPressiä sivustollamme. Ja napsautamme vahvistaa. Ja nyt sanotaan, että olet pyytänyt WordPressin asentamista tilillesi. Ja sitten meidän on vahvistettava, että olemme lukeneet Sitegroundin palvelusehdot ja hyväksyneet ne. Jätän sen harjoitukseksi sinulle. Ja nyt napsautamme koko asennus. Ja nyt se tekee tietokannan luomisen meille, WordPressin asentamisen ja näiden kahden yhdistämisen käyttämällä juuri lisäämiämme tietoja. Ja siinä me olemmekin. Voimme edetä asiakasalueellemme. Mutta nyt, jos palaamme verkkosivuillemme ja lataamme uudelleen, huomaat, että meillä on blogi. Huomaa myös, että käytössämme on HTTPS, mikä tarkoittaa, että he loivat meille SSL-varmenteen. Näytän sinulle, missä se tapahtuu, jotta tiedät miten se tehdään, jos sinun täytyy uudestaan. Sivustokentän käyttäjän alueella siirrymme tiliini. Ja siirry sitten cPaneliin. Haluamme käyttää cPanelia aina turvallisesti, joten jatka ja muista se. Tällä sivulla on nyt paljon asioita, mutta täällä on myös tämä upea haku. SSL-varmenne on saatu Let’s Encryptiltä. Joten me kirjoitamme L-E-T: hen, ja siinä me olemme, meidät suodatetaan alaspäin. Ja täällä voit nähdä coworkerpro SSL-sertifikaatin. Mutta Siteground asetti sen meille, joten meidän ei tarvitse huolehtia siitä. Halusin vain, että näkisit missä se on, koska se on tärkeää. Joten nyt kirjataan sisään WordPressiin ja suoritetaan pieniä määrityksiä. Tämä on käyttäjänimi ja salasana, jonka loin vain hetki sitten. Nyt jotain muuta, jonka Siteground teki meille, on Jetpackin asennus. Katsomme sen määrittämistä vähän myöhemmin. Aion sulkea tervetulopalkin ja Jetpack-palkin, ja nyt minulla on erittäin vanilja WordPress-asennus. Joten yksi ensimmäisistä asioista, joita haluamme tehdä, on siirtyä kohtaan Asetukset → Pysyvät linkit ja haluamme postinimen, koska se tekee yksinkertaisemmista ja helppolukuisimmista URL-osoitteista. Se on myös paljon parempi hakukoneiden optimoinnissa, ja se voi olla todella tärkeä. Sitten siirrymme keskusteluun, ja toistaiseksi poistamme kommentit käytöstä, koska emme halua kenenkään kompastuvan tällä sivustolla ja käyttävän kommentteja, koska ne ovat todennäköisesti roskapostia. Menemme Readingiin. Ja aiomme nyt estää hakukoneiden näkyvyyttä, koska emme ole valmiita olemaan julkisia. Älä unohda nyt, kun olet valmis sivustosi kanssa ja olet valmis aloittamaan reaaliaikaisen toiminnan, palaa tälle Asetukset → Lukemissivulle ja poista valinta hakukoneiden indeksoinnista tällä sivustolla. Koska sitten Google voi löytää sinut. Sitten haluamme poistaa WordPressin mukana tulevan oletussisällön. Siellä on yksi viesti ja yksi kommentti. Ja jos roskaamme kyseisen viestin ja tyhjennä roskakori, kommentti tulee sen mukana, joten meidän ei tarvitse etsiä kommenttia ja poistaa sitä. Mennään nyt sivuille, eikä yhtään sivua löydy. Joten nyt, jos tarkastelemme kotisivumme, sen pitäisi näyttää melko vaalealta. Mitään ei löytynyt. Sivupalkissa on joitain asioita, huolehditaan siitä. Tyhjennämme juuri sen, ja sitten meillä on puhdas liuskekivi. Ja siinä se on. Tyhjä sivusto, juuri sopiva sisältömme täyttämiseen. Nyt kotisivullamme ei ole blogia siitä. Se tulee olemaan erillinen osa sivustoa. Mutta tällä hetkellä kotisivumme on blogi. Joten muutamme sitä. Ensimmäinen asia, jonka aiomme tehdä, on luoda kaksi sivua. Me kutsumme tätä yhdeksi kotiin ja yksinkertaisesti julkaisemme sen. Ja sitten teemme uuden, eikä sivustollamme ole blogia, sillä on uutisosa, joten kutsumme tätä uutiseksi. Joten nyt meillä on kaksi sivua, Koti ja Uutiset. Mutta nyt meidän on kerrottava WordPressille, kuinka niitä käytetään. Nyt siirrymme kohtaan Asetukset → Lukeminen. Ja täällä sanotaan, että kotisivusi näkyy, ja juuri nyt se on viimeisin viestisi. Sen sijaan valitsemme staattisen sivun. Ja etusivulle valitsemme Koti, ja viestisivulle valitsemme Uutiset ja tallennamme muutokset. Jos nyt katsomme verkkosivua, siellä on kotisivumme. Ja sivustoamme kutsutaan edelleen blogiini ja WordPress-blogiini, mutta muutamme sitä vain muutamassa minuutissa. Nyt kun sivustollamme on suoritettu alkeellisimmat kokoonpanot, asennamme pari laajennuksia, jotka auttavat meitä eteenpäin. Ensimmäisen nimi on TinyMCE Advanced. Nyt TinyMCE on editorin nimi, jota WordPress käyttää. Jos olet koskaan luonut sivun tai viestin, olet käyttänyt TinyMCE: tä. Jos muokkaamme tätä sivua, näet sen täällä. Oletusarvoisesti siinä on tämä yksi palkki. Jos napsautat tätä painiketta, jota kutsutaan työkalurivin vaihtamiseksi, saadaan toinen palkki. Mutta TinyMCE Advanced tuo vielä enemmän. Täällä on avattava luettelo erityyppisille otsikoille, ja täällä on valikon selaus kaikenlaisten muiden työkalujen kanssa. Joten asennetaan tämä todella nopea. Menemme laajennuksiin, lisäämme uusia ja voimme etsiä laajennuksia, ja siinä se on. Napsautamme asentaa nyt ja aktivoimme. Ja nyt, kun palaan sivuille ja muokkaan kotona, huomaat, että meillä on pudotusvalikko fonteille, otsikoille ja voimme käyttää taulukoita ja kaikenlaisia ​​muita asioita. Ja tästä on hyötyä myöhemmin. Nyt toinen laajennus, jonka aiomme asentaa, on nimeltään My Eyes Are Up Here. Ja tämä on todella hieno laajennus, joka auttaa valokuvien rajaamisessa. Yleensä, jos sinulla on korkea ja kapea valokuva ja pyydät WordPressiä tekemään neliön, se rajaa neliön oikealta keskeltä. Koska Silmäni ovat täällä, se tunnistaa kuitenkin älykkäästi ihmisten kasvot. Kuten tämä. Ja luo sitten oikeat pikkukuvat. Lisäksi, jos ihmisiä ei ole, voit asettaa tämän vaaleanpunaisen pisteen haluamaasi paikkaan ja varmistaa, että valokuvan osa on aina kuvassa. Joten jos sinulla on valokuva vuoristosta ja moottoritieltä, ja haluat rajata sen niin, että näet vain vuoret, voit valita vuoristoalueen, ja kun WordPress rajaa, se pitää vuoret. Tämä laajennus on todella hyödyllinen tekeessä henkilöstöarkistoja ja gallerioita ihmisistä, koska WordPress saa aina kasvonsa. Joten asennetaan tämä. Siellä, nyt se on asennettu. Nyt on täällä muutama lisäosa, jonka haluaisin käydä läpi nopeasti. Hei Dolly tulee jokaisen WordPress-asennuksen mukana, emmekä tarvitse sitä. Joten me vain päästämme eroon siitä. Akismet, jota aiomme käyttää myöhemmin videossa. Sitä käytetään roskapostin torjuntaan. Jetpackissa on myös useita työkaluja, ja siirrymme niihin myöhemmin. Ja sitten SG Optimizer on nopeuttaa sivustoasi Sitegroundissa. Siinä on loistava välimuistiventtiili ja monia muita asioita, joita tarkastelemme myöhemmin. Seuraavaksi aiomme asentaa teemamme. Aihe, jota aiomme käyttää, on nimeltään Hestia. Ja se on peräisin Themeislestä. Tämä on tämä sivu Themeisle.com-sivustolla. Ja sitä on kahta versiota, maksullinen versio ja ilmainen versio. Tässä videossa aiomme käyttää ilmaista versiota. Mutta halusin näyttää sinulle muutamia asioita, jotka se voi tehdä. Tätä Hestiaa me tarkastelemme. Ja tämä kotisivu on rakennettu ilman koodausta. Se on täysin yhteensopiva sivujen rakentajien kanssa, mutta emme aio käyttää sitä tässä videossa, koska me emme tarvitse sitä. Hestia on hieno ilman sitä. Se toimii hienosti mukautuksen kanssa. Ja se on erittäin suosittu. Otamme sen WordPress.org-sivustolta ja käytämme ilmaista versiota. Ilmaisen version asennuksia on ohi. Joten siirrymme kojelautaan, sitten ulkonäköön ja sitten teemoihin. Lisää uusi teema. Ja etsi Hestiaa. Ja siinä se on. Napsauta Asenna ja aktivoi. Ja siinä olemme. Mennään käymään kotisivulla ja katsomaan miltä se näyttää. Tässä on sivuston otsikko. Ja tämä on sivun otsikko, ja voimme muuttaa sitä räätälöijässä. Siihen sisältyy muutama asia, kuten tämä blogiala, ja asuttu alatunniste, jossa joitain kuvia. Aiomme muuttaa sen ulkonäköä, lisäämme valikon ja teemme siihen useita asioita. Mutta ensin, kun olemme täällä teema-alueella, poistamme kaikki paitsi yksi ylimääräinen teema. Joten poistetaan ja. Jotkut poistamme syyn siihen, että jos jokin tietoturvaongelma ilmenee, voimme olla alttiita siihen, vaikka emme käytä teemaa. Nyt on epätodennäköistä, että tietoturvaongelmassa niissä, joita ei pystytty korjaamaan nopeasti. Mutta toisaalta, jos meitä ei lainkaan ole, meidän ei tarvitse huolehtia siitä. Joten miksi pidimme yhden ylimääräisen? Haluat aina yhden ylimääräisen teeman, koska jos jotain tapahtuu pääteemallesi, kuten se poistetaan tai vioittuu, sivustosi palaa takaisin toissijaiseen teemaan. Sitten voit nähdä sen ja päästä järjestelmänvalvojan alueelle. Joten aloitetaan kotisivumme rakentaminen. Ensimmäinen asia, jonka aiomme tehdä, on napsauttaa aloittamista Hestian kanssa. Ja mitä tämä todella tarkoittaa, vie meidät tälle sivulle ulkonäön alla. Ja siinä on joitain tietoja aloittamisesta, mutta siinä on kaksi suositeltua toimenpidettä. Ja aiomme tehdä molemmat. Orbit Fox Companion on laajennus, joka lisää joitain etusivun ominaisuuksia. Se on ilmainen, ja voimme asentaa sen täällä. Ja siinä olemme. Seuraava on nimeltään Pirate Forms, ja tämä muodostaa yhteyslomakkeen. Nyt merirosvolomakkeet eivät ole niin suuria ja monimutkaisia ​​kuin muut muodot, kuten Gravity Forms tai Ninja Forms. Mutta tarkoituksiimme se tulee luomaan hienon pienen kontaktilomakkeen. Nyt sanoi, Hestia Pro on täysin yhteensopiva kaikkien suurempien muotoisten laajennusten kanssa. Joten jos tarvitset niitä, voit varmasti käyttää niitä Hestian kanssa. Hyödyllisten laajennusten alla näemme esimerkiksi sivunmuodostajat ja käännöslaajennukset. Emme aio käyttää mitään näistä suunnittelumme. Joten seuraava asia, jonka haluamme tehdä, on siirtyä kotisivulle. Ja melkein kaikki muu, jonka teemme etusivulla, tehdään räätälöintiohjelman kautta, jonka löydät täältä. Napsauta muokata. Ja nyt, voimme käydä läpi valikon täällä vasemmalla tai napsauttamalla kaikkia pieniä sinisiä lyijykyniä muuttaaksesi asioita. Lyijykynien avulla on erittäin mukavaa löytää asioita monimutkaisesta valikosta. Yksi ensimmäisistä asioista, joita aiomme tehdä, on muuttaa sivuston asettelua. Tällä hetkellä se on laatikossa, ja sillä on tämä reuna täällä oikealla. Jos siirrymme ulkoasuasetuksiin, voimme yleensä poistaa valintaruudun ruudusta. Ja nyt se menee täyteen leveyteen. Jatkamme jakamiskuvakkeita ja haluamme ottaa vierityksen ylöspäin. Se asettaa pienen napin täällä alas, jotta voimme vetoketjua takaisin ylöspäin. Seuraava asia, jonka haluamme tehdä, on muuttaa sivustomme identiteettiä. Tällä hetkellä se on yksinkertaisesti blogiini. Aiomme muuttaa sen Coworker Proksi. Ja juuri niin, se on muuttunut. Ja sitten otsikkolinjalle, jota emme näe kotisivulla, mutta joka tulee näkyviin täällä työkalurivillä, kirjoitamme parhaimmalla mahdollisella tavalla. Sitten napsautamme Julkaise. Julkaise on kuin työn tallentaminen. Nyt huomaat, että se ei päivittänyt otsikkopalkkia tällä, koska muokkaaja voi ladata vain kotisivun uudelleen. Joten suljetaan se todella nopeasti. Ja nyt voit nähdä, että yhteisöstö on parhaimmillaan, suoraan ylöspäin. Palaamme takaisin mukauttajaan. Muutetaan nyt taustaamme, ja tässä on tämä lyijykynä täällä. Voimme muuttaa kuvaa. Ja aion ladata sen. Kaikki tämän videon käyttämät kuvat ovat lähtöisin osoitteesta unsplash.com, joka on loistava paikka saada ilmaisia ​​kuvia. Joten napsautin auki. Ja aion poistaa otsikon, koska se ei ole hyvä näytönlukijoille. Mutta aion laittaa jonkin alt-tekstin tänne. Haluat aina laittaa alt-tekstin kaikkiin kuviin. Napsautin sitten valita kuva. Ja siinä olemme. Muutetaan nyt tätä tekstiä. Sitten seuraava rivi on: Tule työskentelemään kanssamme. Siellä me olemme. Muutetaan nyt tätä painiketta. Napsauta tätä, ja se vie meidät tänne. Siellä nyt sanotaan oppia lisää. Pidämme keskityksestä, ja URL-osoitteen suhteen jätämme sen minuutiksi yksin. Aiomme luoda linkin myöhemmin sivun alaosaan. Mutta toistaiseksi jätämme sen rauhaan. Mutta emme halua, että tämä painike on vaaleanpunainen, haluamme sen olevan sininen. Joten palaan takaisin täältä, siirrymme väreihin ja vaihdamme aksenttivärimme tähän siniseen. Voit valita minkä tahansa värin haluat. Valitsin juuri tämän, koska pidän siitä. Ja sitten napsautamme julkaisua. Ja suljemme tämän. Ja nyt yläosa on melkein valmis. Fonttimme ovat hieman liian rohkeita täällä. Korjataan se. Palaamme takaisin mukauttajaan. Joten nyt siirrytään ulkoasuasetuksiin, typografiaan ja aion sitten valita kirjasinkoko. Ja tässä ovat etusivun osiot, ja tässä on iso otsikkoosa. Aiomme vain pienentää sitä. Miinus kolme, lasketaan julkaisu. Sulje tämä. Siellä nyt on kaikki yhdellä rivillä, aivan kuin haluamme. Nyt ennen valikon laatimista aiomme rakentaa loput näistä osioista. Nyt kun olemme saaneet yläosamme valmis, siirrymme toiseen osaan. Nyt rakennamme sivustoa työpajoille, joten haluamme vakuuttaa ihmiset siitä, että heidän pitäisi tulla töihin tänne. Joten muutetaan nämä esineet asioihin, jotka haluamme heidän sanovan. Napsautamme muokata ja napsautamme sitten tätä lyijykynää otsikon vieressä. Ja tässä voimme laittaa kokonaisen joukon tekstiä. Valinnaisesti mikä tahansa näistä osioista voidaan poistaa käytöstä. Voisimme päästä eroon kaikesta yhdessä, ja teemme sen myöhemmin parin kanssa. Joten vaihdetaan tämä otsikko. Siellä. Ja sitten me muutamme myös sen alapuolella olevaa tekstiä. Freelance-elämässä on paljon etuja, ja kotoa työskenteleminen pyjamassa on yksi niistä. Joten miksi sinun pitäisi tulla työskentelemään kanssamme? Sitten meillä on täällä kolme osiota, ja tässä ovat näiden osioiden kolme järjestelmänhallinta-aluetta. Joten avataan ensimmäinen, ja kuvakkeita ohjataan kirjasimella. Yksi syy, jonka vuoksi haluat työskennellä coworking-toimistossa, on ihmiset. Joten napsautetaan täällä ja löydämme ihmisiä. Kumpikin näistä toimisi. Valitaan tämä. Jätämme sen punaisen värin, mutta muutamme sen ihmisiksi. Ja muutamme tämän tekstin sanoaksemme, että täällä työskentelevät ihmiset ovat älykkäitä, avuliaita ja välitämme. Autamme toisiamme ratkaisemaan ongelmia ja käsittelemään hankalia asiakkaita. Ja voisimme tehdä tämän linkin jostain, mutta emme aio, jätämme sen vain rauhaan. Joten suljemme tuon ja avaamme seuraavan. Toinen syy, jonka vuoksi haluat työskennellä coworking-toimistossa, on laitteet. Et halua faksia kotona, kuka tekee? Mutta joskus tarvitset sellaista. Joten muutetaan tämä työkalupakiksi. Sitä kutsutaan salkkuksi, mutta se näyttää työkalulaatikolta. Ja se on minulle tarpeeksi hyvä. Jätä se siniseksi, ja kirjoitamme laitteita tänne. Ja lisäämme uuden tekstin. Meillä on faksi ja mukava lasertulostin, ja kokoushuone, jossa on neuvottelupuhelin. Asioita, joita sinulla todennäköisesti ei ole tai haluat kotona. Jälleen kerran, jätämme tämän ilman linkkiä. Ja kolmas ominaisuus pysyy tukena. Paitsi, se ei ole tekninen tuki. Emme puhu teknisestä tuesta, vaan emotionaalisesta tuesta. Ihmiset tarvitsevat ympärillään olevia ihmisiä pysyäkseen terveinä. Olemme kaikki järkeviä. Suurimman osan ajasta. Nyt haluaisin huomauttaa, että täällä on poistokentän painike jokaisessa näistä, joten voit tehdä kaksi tai vain yhden, jos haluat. Ja siellä on myös uusi ominaisuus, joten voit lisätä neljännen, viidennen, kuudennen jne. Joten nyt, napsauta julkaise. Ja suljemme tämän. Ja siellä meillä on se, miksi sinun pitäisi tulla työskentelemään kanssamme. Pieniä vaikutuksia jokaisessa kuvakkeessa, ja teksti näyttää kauniilta. Nyt, ennen kuin aloitamme seuraavan osion sivulla, haluaisin määrittää oletusfontin koko sivustolle. Ja se on melko yksinkertaista. Menemme räätälöintiin, ulkoasuasetuksiin, typografiaan. Ja aion valita matkustamon. Ja aion valita saman täällä. Ja nyt kaikki käyttää matkustamoa. Ero on hieno, mutta siinä on. Nyt seuraava osa, jonka parissa työskentelemme, on noin-osa, ja se on tämä pieni suikale täällä. Nyt tämä osio todella vetää sisällön kotisivulta, WordPressin sivulta nimeltään koti. Joten menemme kojelautaan ja vedämme sivu ylös. Ja tällä hetkellä se on tyhjä. Nyt, kuten huomasit, sivun otsikkoa ei käytetä missään täällä, joten sillä ei ole väliä mikä se on. Joten laitetaan teksti tänne. Ja nyt haluan tehdä siitä otsikon koon yhden ja keskittää sen. Laitetaan sitten teksti sen alapuolelle. Haluamme jonkin tekstin, joka saa ihmiset tuntemaan haluavansa tulla osaksi yhteisöämme. Joten aiomme laittaa tämän tekstin sisään. Joka perjantai teemme ryhmälounaan, ja erilaiset ihmiset osallistuvat ruoanlaittoon paikan päällä olevassa keittiössä. Syömme yhdessä tiukasti ystäväryhmänä, jotka rakentavat toisiaan ja auttavat toisiamme kasvamaan. Tehdään tästä nyt hieman suurempi. Ja keskitä se. Nyt huomaat, että fonttikoot ovat pisteinä pikseleiden sijasta. Me todella haluamme pikseliä. Joten siirrymme asetuksiin ja avaamme TinyMCE Advanced -asetukset uudessa välilehdessä. Ja sitten täällä, me napsautamme fonttikokoja, ja se aikoo käyttää px. Joten nyt napsautamme Tallenna muutokset. Aion päivittää tämän, joka päivittää sivun. Ja nyt voimme korostaa kaiken tämän tekstin ja valita pikselin. Ja juuri sitä me haluamme täällä. Joten nyt napsautetaan päivitystä, ja katsomme sivua. Se on aika liukas, mutta haluamme hieman alla olevan tekstin. Palataanpa sitten toimittajamme luo, ja haluan melko vähän tilaa, joten aion vain tehdä tämän ja liittää sen tähän. Ja nyt aiomme tehdä tästä myös px. Ja myös keskitetty, emmekä aio tehdä tästä linkistä vieläkään, koska sitä sivua, jota se aikoo käyttää, ei ole. Mutta haluamme silti hieman enemmän pehmusteita sen alapuolelle. Joten nyt napsautin päivitys. Ja siellä me menemme. Mutta haluan sen olevan vähän isompi. Joten tehkäämme tästä yksinkertaisesti H. No, muotoillaan selkeä muotoilu ja aloitetaan se uudelleen. Joten nyt se on H-kolme ja aiomme keskittää sen uudelleen. Napsautin päivitystä. Joten nyt, lataan uudelleen. Siellä me menemme. Ja myöhemmin, kun olemme luoneet lisää ala-sivuja, palaamme takaisin ja teemme siitä linkin noin -sivulle. Joten tämä on meidän kohta. Jokainen yhteisö ja coworking-sivusto haluaa näyttää joitain jäsenistään. Se voi auttaa ihmisiä tuntemaan olonsa tervetulleiksi. Joten aiomme muuttaa tämän henkilöstösivun jäsensivuksi. Ja aiomme tehdä sen napsauttamalla muokata, siirrymme sitten takaisin alaosaan ja napsautamme tapaavamme joukkueemme. Ja nyt, muokkaamme tätä osaa. Muutetaan se tapaamaan jotkut meistä. Ja sitten me laitamme toisen tekstityksen. Jäsenemme ovat monipuolinen ryhmä kehittäjiä, suunnittelijoita, projektipäälliköitä ja monia muita ammattilaisia. Jäsenluettelomme on noin% naisista, ja meillä on edustettuina monenlaisia ​​etnisyyksiä. Joten meillä on täällä neljä oletusarvoa, ja täällä voit nähdä ne neljä osaa. Ja siellä on linkki uuden joukkueen jäsenen lisäämiseksi. Joten avataan ensimmäinen. Muutetaan nimi Tinaksi. Ja tekstitys on suunnittelijaviivataiteilija, ja me muutamme myös hänen kuvansa. Ja poistamme otsikon ja laitamme aina alt-tekstin kaikkiin lähettämiisi kuviin. Ja muistatko, että me asensimme silmäni täällä? Siinä on kaksi erilaista esikatselua. Nyt tässä nimenomaisessa tapauksessa hänen kasvonsa olivat jo keskellä, joten sillä ei ollut oikeasti merkitystä. Mutta muilla lataamillamme kuvilla on merkitystä. Meidän ei tarvitse valita suuntausta tai kokoa tai mitään muuta, koska teema valitsee sen meille. Joten napsautamme lisäystä viestiin ja siellä on Tina. Lisäämme paremman kuvauksen Tiinasta. Nyt huomaa, että tämä on tekstialue, joten voit tarttua tähän pieneen juttuun täällä ja liu’uttaa sen alas tarvittaessa. Tina viettää päivänsä luomalla digitaalisia teoksia. Hänen taiteensa on ollut esillä Carnegie Hallissa ja Lontoon taidemuseossa. Haluan huomauttaa, että jokainen, jonka aion täällä koota, on muodostettu. Ja toista uudelleen, että kaikki kuvasi ovat peräisin Unsplashista. Nyt voisimme luoda linkin, jos Tinalla olisi oma sivu, mutta hänellä ei ole sitä, joten jätämme linkin tyhjäksi. Ja sitten me valitsemme hänen sosiaaliset verkostot. Voimme valita kuvakkeen ja lisätä sitten URL-osoitteen. Ja jätän nämä oletukseksi, koska Tiinalla ei oikeastaan ​​ole sosiaalisia verkostoja, koska tein hänet. Mutta jos halusit päästä eroon yhdestä, voit napsauttaa Poista-kuvaketta, ja nyt LinkedIn on poissa Tinasta. Jos haluat lisätä jotain muuta, voit napsauttaa Lisää-kuvaketta ja löytää jonkin muun sosiaalisen verkoston. Joten se on Tina. Näytän sinulle vielä yhden. Ja sitten, muokkaamisen taian avulla, tee kaksi muuta sinulle, koska ne tehdään täsmälleen samalla tavalla. Seuraavina ihmisinämme tulee todella olemaan kolmen sisaren yritys. Ja tässä taas voimme valita mitä haluamme olla kuvan keskipiste. Napsautamme lisäystä viestiin, ja siellä on kolme sisarta. He ovat markkinointiyritys. Ja nyt sanotaan, että Juanita, Juliette ja Jacqueline ovat kolme siskoa, jotka perustivat oman markkinointiyrityksen. He työskentelevät pääasiassa nuorten kaupungin taiteilijoiden ja muusikoiden kanssa. Nyt huomaat, että kaikki nämä muut kuvat ovat neliömäisiä, mutta tämä ei ole, se on vähän lyhyempi. Ei se mitään. Ne ovat kuitenkin kaikki samanleveisiä, ja teemamme rajoittaa sitä. Niiden kaikkien on oltava samanleveisiä, mutta ne voivat olla hiukan pitempiä tai lyhyempiä. Joten nyt aion tehdä seuraavat kaksi. Nyt minulla on osio, joka näyttää eräitä yhteisön jäsenistämme. Kuten huomaat, lisääminen on helppoa, ja jokainen niistä on melko joustava. Joten nyt, napsauta julkaise, sulje mukauttaja ja varmista, että se näyttää hyvältä koko leveydellä. Se varmasti. Joten nyt, kun olemme valmiita tämän osan kanssa, voimme siirtyä seuraavaan. Aina kun myyt tuotetta, ihmiset haluavat nähdä suosituksia. He haluavat kuulla oston tehneiltä ihmisiltä ja nähdä heidän mielestään. Joten seuraava osa tulee olemaan suositusosa. Ja oletusarvoa kutsutaan, mitä asiakkaat sanovat, mutta aiomme muuttaa meidän. Aloitamme napsauttamalla muokata, ja vieritämme takaisin alas. Napsautamme täällä, mitä asiakkaat sanovat. Kuten kaikki muutkin osiot, voit poistaa käytöstä. Ja oletusarvoisesti on olemassa kolme suositusta, mutta voit lisätä lisää. Joten vaihtakaamme meidän asiakkaidemme sanoihin jäsenten sanomiin. Ja sitten meidän alaotsikkomme kohdalla meidän on harvoin markkinoitava, koska jäsenillämme on tapana kertoa kaikille tietävänsä, mikä on hieno paikka työskennellä. Joten nyt, saamme omat suosituksemme. Vaihdetaan kuvia. Ja huomaat, että se asettaa sen automaattisesti ympyrään meille. Alkuperäinen kuvamme oli neliö. Päätin pitää etunimen ja jopa tekstityksen, koska se sopii. Mutta laitamme oman tekstin. Rakastan, että saan kunnioitusta ympärilläni olevilta ihmisiltä. Nainen olla liiketoiminnassa tarkoittaa usein tekemistä ihmisten kanssa, jotka eivät usko minun olevan täällä. Mutta Coworker Pro -sovellukseen sopin. Ja sitten taas voisi olla linkki, mutta emme linkitä mihinkään, joten voimme jättää sen tyhjäksi. Tehdään seuraava henkilö. Siellä olemme nyt valinneet Hansonin. Ja me laitamme hänen nimensä. Ja lisää postitse. Ja jälleen, me aiomme käyttää vain etunimiä, ja sen sijaan, että hänestä tulisi riippumaton taiteilija, kutsumme häntä vetoamisinsinööriksi. Ja sitten laitamme oman tekstin. Tämän tilan nuoruuden ja jännityksen ilmapiiri on päihdyttävä. Nämä ihmiset muuttavat maailmaa, ja minun on oltava paikalla nähdäkseni sen tapahtuvan. Ja sitten me muutamme kolmannen. Muutamme kuvan. Selaa täällä. Aiomme laittaa alt-tekstiin. Ja lisää postitse. Jätämme Natalyan freelanceriksi. Poista sukunimi ja laita oma teksti. Perjantain lounaat ryhmän kanssa ovat parhaat. Rakastan ryhmäkeittämistä ja perheen tunnetta, joka tulee kaikilta pöydän ääreltä. Ja siinä on, nyt meillä on suosittelumme alue. Julkaisemme, sulje räätälijä. Vieritä sitten alas nähdäksesi miltä se näyttää laajakuvassa. Ja se näyttää hyvältä. Meidän on tehtävä vielä yksi kohta, ja se on alatunniste. Mutta ensin haluan huomauttaa, että koska emme halua blogia tälle sivulle, voimme siirtyä räätälöintiin, ja menemme aina alas blogin alueelle ja napsautamme pieni silmä täällä. Ja nyt se on mennyt. Ja nyt meillä on tämä alatunniste, joka on valmistettu enimmäkseen meille. Mutta julkaistaan. Sulje tämä ja katso miten se näyttää. Se menee suoraan suosittelusta alatunnisteeseen. Alatunnisteen muokkaaminen Hestiassa eroaa hiukan muista osioista. Se käyttää edelleen mukautinta, mutta siinä on joitain erilaisia ​​gadgeteja. Katsotaanpa. Napsauta muokata-painiketta, niin menemme loppuun asti. Ja koko alatunnistossa on vain yksi muokkauslinkki. Joten napsautetaan sitä. Täällä voit muuttaa taustakuvan aivan kuten kaikki muutkin muutetut kuvat. Aion jättää tämän, koska pidän kaupunkikuvasta, mutta voit laittaa mihin tahansa haluamaasi taustalle. Siellä on otsikko, ota yhteyttä, me jätämme sen, koska se sopii. Mutta sitten tekstitys, aiomme laittaa sisään, että vastaanotto käy ilmi: aamu ja ilta. Itäinen normaaliaika. Sitten meillä on täällä lomakkeen otsikko, ja se on täällä. But to determine what form goes right here, we click this little tab right here. And it’s simply a short code. Which means you could put in any short code, and it could render any number of things there. It could render another form or a bunch of information. You may recall near the beginning of this video that we installed the Pirate Forms plugin to go with Hestia. That’s because it’s using it right here. And as you can see, it is a perfectly functional small simple form. So we’re going to leave it. But now, we want to edit this content. So we’re going to click right here, edit. And it pops up here. I’m going to put in a different address, because I’m not in Romania. And I’m going to put in different contact information. But I like give us a ring and find us at the office, those fit nicely. And then, when we’re done, we click edit again, and it goes away, and you can see our new information here. And that’s it for the footer, just like that. Just a little bit of text touch-up, and we left the form alone, and we’re all set. So let’s publish. And close the customizer, and see how it looks. Just great. Now that we have the footer done, let’s look at adding a menu right up here. And most of the menu right now is going to link to various parts of the homepage. In a few minutes, we’ll add some actual pages, and we’ll add those to the nav then. But for now, we’re merely going to make a nav that lets us move around the homepage. Now, the first thing we want to do is get a list of the links that we’re going to use in our nav. And I’ll show you how we’re going to do it. Scroll to the second section. Why you should come work with us. Now this is the only part of the whole video that even looks at code. In your browser, we’re going to right click, right here in this white space, and go to inspect. And the first thing it comes up to is a section. And these sections right here, there’s a list of them, are the things we’re looking for. They’re just under the main div. Now, each section has an ID. This one that we clicked on is features. Next is about. Then there’s team, then there’s testimonials, and lastly, there’s contact. If this all sounds familiar, it’s because it’s the sections of the homepage. So you want to write down on a piece of paper, or a text file on your computer, the names of these IDs. Go ahead and hit pause and write them down. Once you’ve gotten them written down, let’s go back to our browser. Now we’re going to use the customizer. So we click customize. And one of our options right here is menus. Right now, there are only two menus. There’s a default top bar, currently set to very top bar menu, which actually isn’t being used on our theme right now. It has a phone number and an email address that we could use if we wanted. But we’re not going to. And there’s also a socials top menu, and so you could put social networks in the top bar. And we’re not going to do that right now either. We’re going to create a new menu, and we’re going to call it primary menu. And we’re going to click the primary menu checkbox. And that’s what’s going to make it appear right here. So let’s click next. And now we can add items. Now, rather than use the suggested pages and links that we have here, we’re going to create custom links. And we’re going to link to the various sections of our page. Now the first one was called features. And we’re going to use the ID that we pulled out of the code. We’re going to start with a slash, which means, on the homepage, then we’re going to put in a hashtag, which means, go to an ID. And we’re going to type features. And then we’ll click add to menu. So let’s look at just that one for right now. Click publish, and we’ll leave the customizer. So now we have features, and if we click it, it beautifully scrolls right down to the features section. So now, all we need to do is the same thing for all the other sections. So let’s go back to the customizer again. We’ll go back to the menus. We’ll edit our primary menu. And add items. All of these are going to be custom. Now the next ID we have is about. However, we really called that section community. So the link text is going to be community. Add to menu. The next one had an ID of team, but again, we’re going to deviate just a little bit and call it members in the menu. Then we’ll add to menu. The next one is testimonials. And we’ll leave that one called testimonials. And lastly, we’re going to have contact. So now, let’s click publish. And there’s our nav. We can even click while in the customizer, and have it jump around. Now one more thing we want to add to the nav is a little search option off here to the right. So we’re going to actually leave the primary menu, and go to header options. And under navigation, we can enable search in menu. And now, we have a little glass here. So now, we’ll click publish. And close the customizer. And here we have a beautiful nav that lets us jump around the homepage. Now, we’re also going to create some subpages that are actually different pages from the homepage, and we’ll come back to the nav and add those to it when we do that. Now that we are nearly finished with the homepage, let’s build the news page. Before we get started, I want to remind you of a couple things. We’ll go to settings, reading, and I’ll point out that our posts page is actually a news page. So let’s go to pages, and edit the news page. And you’ll note that we can’t put any text in here, because it’s supposed to be an archive. But let’s view it. The posts will go here, and we have this horrible pink bar at the top. We are using the page’s title, and fortunately, we can also use the featured image. So let’s upload a nice featured image. There’s our alt text, and we set the featured image, and update. And now, we’ll go look at it. And there we are. Now as long as we’re here, let’s add it to the menu. We’ll go to customize, menus, primary menu. Add items. And we’ll add our news page, except we want it here at the top. Then we hit publish, and close the customizer, and now we have a news item. And it goes to this page. So let’s create our first post. We’ll click add new, and there is nothing unique about posts in Hestia. This is % stock WordPress. So if you’re familiar with WordPress, you know how this works. Let’s go ahead and make one. Our coworking space has a new refrigerator. The old one saw its last ham sandwich last Friday. And we’ll put an image at the top of the post. And put in our alt text. And that’s too small, so we’ll click the pencil, and we’ll go to large. And we’ll center it. And click update. And there we are. I’m also going to set it as the featured image, and you’ll see why in a moment. So I don’t need to upload it again, it’s already there. We’ll add a new category called kitchen. Publish. And now, when we reload our news archive, there we are. Now this image is the featured image. If we hadn’t set one, then this text would slide all the way to the left, which is usually fine, but it looks really sharp with a featured image. If we click, it also puts the featured image in the bar at the top, so that’s something to remember. Now, you’ll note that it says uncategorized, and we made one for kitchen, so let’s go back. And there we are, we have proper category right there. Now, before we get too much farther, I want to fix the nav in the footer. I want it to replicate what’s in the header, so I’m going to go to customize, and go to menus, and click on primary. And you’ll note that it’s already set to primary, but if I also set it to footer, you can see that it’s now down there at the bottom. So now, I’ll publish and close this, and there, now we have the same nav at the top and the bottom. I’d like to show you one more option with the blog page. And then we’re going to create an about page. Right here on the homepage, we’re going to click customize. And then we’re going to go to front page sections. The sections that are bolded are the sections that we have built. The ones that are grayed out are sections that could exist, but don’t, because we never turned them on. The ribbon simply gives you a background image, and a place to put in some text and a button. The clients bar allows you to post icons of your clients. Subscribe allows you to put in a subscribe form, and then blog is where I was headed here, allows you to put in a blog section. So I’m going to unclick disable section, and we’ll scroll down. And while you were away, I added a second blog post. So we have one here for the kitchen, and a new member. And we can make this say news. And there we are, now we have a news section on our homepage. And if we decide we don’t want that, we click the little I, which checks this, and I’m going to click publish. And now we’re back to where we were, but now you’ve seen how easy it is to add a news section to the homepage. But now, let’s create an about page. Again, there’s very little custom about pages in Hestia. So if you’ve ever built a page, you know how it works. Here’s our about text. We’ll create a featured image, and I’m going to use the same image as the homepage header, for some continuity. And now, let’s view that page. And there it is. And now, let’s put it in the menu. We’ll go to customize. Menus, primary menu. Add items, and we’ll add this about page. We want about way up here at the top. So then we’ll publish, and then close the customizer bar. And there we have about. So let’s test these items. We’ll go first to contact. Which takes us to the homepage, and the footer. Then there’s testimonials, members, community, features, news, and about. And if we want the top of the homepage, we simply click the logo, and there we are. Now, our site is essentially finished. The next things we’re going to do all relate to maintenance items, like setting up stats, SEO things, etc. But our site is built and our content is done. So let’s get started on our maintenance. The first maintenance thing we’re going to look at relates to caching, which helps your site go faster. Caching typically means keeping a copy of your page stored on the server, so that it can serve it faster without having to build it all from the database. Normally, I prefer a plugin called WP Rocket. It’s really excellent. However, many hosts, including Siteground where we’re hosting, cache for you, and you don’t need a plugin at all, and I’d like to go over that with you. If we go to dashboard, then at the bottom, there’s SG Optimizer. And there are several things here that we can do. Let’s configure the SuperCacher Config. Right now, Dynamic Cache is on, and that means when it builds a page and sends it out, it keeps a copy, so that the next person doesn’t have to build the page. The cache is also automatically flushed at the right times, so that if you make a change to a page, it doesn’t keep serving the old one. And you have a button here to manually purge it if you want to. You can choose to exclude some URLs from dynamic caching. But then there’s a section here called Memcached settings, and this stores in the server’s memory some of the frequently executed queries to the database. So we’re going to turn this on, and you’ll note that it says, you must enable Memcached from your cPanel. So let’s go to cPanel. We’ll go to Siteground.com and click login. Then we go to my accounts. Go to cPanel. And then over here in the search bar, we’re going to hit cache. And then click SuperCacher. And right here is level three, Memcached. And we’re going to turn it on, by clicking right here. And now, we’ll simply reload this page rather than click the button again, and now we’ll click the button. And now it’s enabled for our site. There’s a button here to test caching for the site, if we click test URL, it says it’s cached. So now we have two different layers of caching enabled, and it should make the site go much, much faster. But in addition to caching, there’s HTTPS Config. And this is already set properly, and you probably should never touch it. This requires that your site operate on HTTPS. Without this, it could operate on either HTTP or HTTPS. But we never want it on HTTP only. So we’re going to leave this just the way it is. Lastly, there’s PHP Config. We want to be running on at least PHP seven. Right now, we’re at ., and we’re going to leave it there, because that’s better than PHP seven. PHP seven is worlds faster than PHP five. And PHP five is pretty common on a lot of servers. So if your server’s on five, ask your host about moving to seven. Or, if you’re here on Siteground, you can switch. So now we’ve gone through the sections of the Siteground optimizer, and the only thing we changed was, we turned on Memcached. Next, let’s talk about getting the site connected to the search engines. First, we’re going to connect the site to various Google properties. Within WordPress, we’re going to use plugins to do that, but before we can use the plugins, we actually have to create the accounts in Google. If you already have an account in Google, you can use it. I’m going to start from scratch. You can use a single Google account across all of Google’s properties. So it doesn’t matter which one you start with. We’re going to start here with Google Analytics. So I click sign in, and then analytics, and we’re going to create an account. And here you can use either an existing email address, or create a Gmail account. I’m going to create a Gmail account. Then we’ll put in our password, and click next. I would recommend putting in your phone number and recovery email address, but you don’t have to. You do need to tell them when you were born. Then there’s their privacy and terms, and click I agree, and now we have a Google account, and now we can sign up for Google Analytics. We’re doing a website, not a mobile app. We’re going to create an account name and a website name, and then we have to tell it where our site is. Choose an industry category, and time zone. And then we have some data sharing options. You’ll want to read these over and decide for yourself if you wanna share this data with Google. I’m going to say okay, and I’m going to click to get tracking ID. But before we can do that, we have to agree again to the terms and services, and click I accept. Now this is our tracking ID. And in the bad old days, you would have to copy either this or all of this code, and figure out how to wedge it into your website somehow. But we’re going to use a cool plugin in just a few minutes. But before we get there, I’m also going to connect with Google Search Console. It used to be called Google Webmaster Tools, but now they call it Search Console. Now, because we’re already logged in with Analytics, we can simply click search console. And they want our password again. And they really want us to give them a recovery phone number and email, which I recommend you do, but I’m not going to bother, because I’m not going to be using this domain very long. And then we tell them where our website is. And click add a property. Now, in order to verify to the Search Console that we own this property, we need to do any number of several things. The recommended method is uploading an HTML file. Among the alternate methods is Google Analytics, and we’re going to use that in just a few minutes, once we connect our Analytics account. So as of right now, we have created a Gmail account and connected it with Google Analytics and Search Console. Now we need to connect those two things to our website. So let’s get going on that. The first plugin we’re going to connect is called MonsterInsights. We’ll go to our dashboard, plugins, add new. And there it is, Google Analytics for WordPress by MonsterInsights. We’ll install and activate. And right at the top, it says that we should configure the settings. The first thing we’re going to do is authenticate with our Google account. If you ever connected your Twitter account to any other site or anything like that, this is very similar. We choose our account. We tell it what it’s allowed to do. And then we pick the profile that we have under that username. Right now, there’s only the one, so we’re going to choose all website data. And if at any time, you don’t want to do this, you can click cancel, but we’re going to complete authentication. And now, our profile is active, with this UA code. You can click verify credentials, and it will say that it is done. And now our site is set up with Google Analytics, just like that. There are some other things that can be done. You can pay for a version of MonsterInsights Pro, and get some added features. If you wish, you can allow them to do usage tracking. And you can optionally have it do automatic updates. Now, if we go over to tracking, we have some options. For example, if an administrator or editor is logged in, then they are not tracked. That way, you don’t artificially boost your own traffic. You can enable demographics, and you can do things with link attribution and file downloads, etc. I’m not going to change any of the defaults, they’re great. The defaults are perfect in MonsterInsights. Now that we’ve connected our site to Google Analytics with MonsterInsights, we’re going to connect it to Search Console with Yoast SEO. So let’s go to plugins and add new. And search. And there it is, we’ll click install now, and activate. Now the first thing you’ll note is that there are some notifications at the top. The first thing it says is that we’re blocking Google, which is true, and is fine for now, we want to do that. But right here, the next thing they want us to do is connect with Google Search Console, so let’s click that. To allow Yoast SEO to fetch your Google Search Console information, please enter your Google authorization code. Click this button. Choose the account that we are working with. And then, we’re going to allow Yoast. And it gives us this big long code. Then we can close this window, and paste it here. And authenticate. And now, we have authenticated, and we don’t need to do any of these methods. Now that our site is connected to Google Search Console, Google can know much, much more about our website, and all of the tools built into Yoast will work even better. So we’ll take a look at those tools next. The next plugin we’re gonna look at here is called Jetpack. Now Jetpack was installed for us by Siteground. But it’s just a regular plugin. If you go to installed plugins, you’ll see it right here, and if you don’t have it, you can simply install it like a regular plugin. Now Jetpack is a little but different from most plugins. It’s actually a collection of plugins. And what makes it unique is that most of the things that Jetpack does is heavy lifting, heavy work, and it does it out on the WordPress.com servers, so that it doesn’t weigh down your server. It can do things like website statistics, image compression, spam fighting, comments filtering, etc. The first thing we need to do is connect Jetpack to a WordPress.com account. Now you might think that creating a WordPress.com account means getting a blog there, but it doesn’t have to. You can simply have an account there to use with Jetpack. So let’s click set up Jetpack. And here, we can either log into an existing .com account, or create a new one. We’re going to create a new one right now, and we’re going to click sign up here in the top right. We’ll put in our email address, choose a username, and then a password, and then we’ll create our account. And then it immediately begins connecting our website with Jetpack. Now by default, Jetpack is free. But there are upgrades available. Down at the bottom here is a button that says start with free. And there we are, now we’re connected. By default, nothing is turned on. But they recommend that all of these things be turned on. Many of them are good, and I like them. But I recommend reading through them, and making sure that you want what’s there. For example, we don’t need a contact form. We have Pirate Forms from Themeisle. So I’m not going to click activate recommended features. I am going to go to site stats, and it’s automatically set up. We could click configure, and set up some settings. We can have a chart showing hours of views in the admin bar. We can decide who gets counted, even if they’re logged in. One of the ways it works is by putting this little tiny image on the page. It’s not required, but it’s helpful, so I tend to leave it there. And then, here we get to decide who’s allowed to view stats. Right now, it’s only the administrator. Because we just set this up, there’s nothing to display yet. But it says your stats will begin to appear here within minutes, and that’s one of the reasons that I like including Jetpack stats in addition to Google Analytics. With Google Analytics, you get to either watch real-time stats, or you wait until tomorrow to find out what today’s stats are. You can’t look hour by hour today, and see how you’re doing as the day goes on. With Jetpack stats, you can do that. You can look every minutes, and see how your stats are growing. This can be useful when you’re doing a large push on your website. Another great thing that Jetpack can do is filter spam, and it does it using the companion plugin called Akismet. If we go to plugins, you’ll see that it’s right here. Akismet comes with WordPress. Now Akismet is also a service. It processes the spam on an outside server, so that it doesn’t bog your server down. So let’s activate Akismet. And then, right at the top here, we can set up our account. Now because we’re connected with Jetpack, we can simply click connect. Otherwise, we could sign up with a different email address, or get an API key. So I’m just going to connect with Jetpack. Now Akismet has a variety of pricing models. There’s enterprise, for larger sites. There’s $ per month per site for smaller commercial sites. And then, there’s name your price. And what’s interesting is that you can name a price of zero, if you wish. So let’s click get personal. And then right up here is the slider. If we drag this down to zero, the credit card information goes away. Now it says, you may not do this if you have advertising, you sell products, or you publish information about your business or service. Now something very important to note here is that this only works if you do not have advertising, you do not sell products, and you don’t publish information about your business or service. Our site is advertising a commercial space, that’s what it is. So we’re not going to do the free one. But we can choose $ a year, which is $ a month, which is not very much. If you find that it’s blocking lots and lots of spam for you, I would recommend paying more for the service. They’re nice enough to allow you to choose, and they’re providing you great service. So give them what you can. Now because our site is not a real site for a real service, I’m going to choose the free one. But if you’re building a site for a real business, you’ll need to pay for Akismet. Now that it’s processed, we can activate this site. In the background here, you can see the API key that was an option earlier, and it put it into our site for us. Now optionally, it can also show the number of approved comments beside each comment author. So not only does it block spam, it approves quality posts. By default, Akismet takes your spam and puts it in the spam folder. Right now, our setting is that the most egregious spam gets automatically deleted, and does not go into the spam folder. If you really need to see all of it, then you can click this option right here. And now that Akismet is set up, we shouldn’t get any spam at all on our website. If we do, then we have the option to mark it as such, and it will communicate to Akismet, hey, you missed this one, and Akismet learns. That’s how it gets so good. Next, let’s look at backups. For backups, we’re going to use the backup system built into Jetpack. And it used to be called VaultPress, but now it’s just called Jetpack backups. But you may still see VaultPress around. Let’s go to the Jetpack dashboard. And here at the top, there’s a tab that’s called plans. Now the backups for Jetpack are not free. However, their personal plan, the cheapest one, does include full off-site backups. Now these are nightly backups, you get one a day. If you go to the more expensive plans, then you can get real-time backups, where you just push a button and it does a backup right there when you ask. We’re going to do the personal one, and it comes with priority email support, which is pretty useful. So let’s click upgrade to personal. Now this took us to our account on WordPress.com. You may recall, we had to create this account in order to connect Jetpack to our site. So this is the same site. Now I’m going to fill out this form, and click pay. Now that we’ve clicked purchase, it’s setting up a number of things for us. It set up the daily offset backups, with a -day backup archive. That means you can recover your site up to days back, but not , so if you miss something for days, too bad. Unlimited backup storage space, that’s really important. If you are a musician or a photographer and you have a ridiculous amount of data, unlimited storage space is a big deal. Automated restores, which means you don’t have to do anything really, if you just want to restore, you click a button and it does its thing. You don’t have to download zip files and mess around with things. It comes with spam protection, easy site migration, if you’re going to move somewhere, and priority support. So now let’s go back to our site. Now we’ll still here in our dashboard, and we’re still looking at the plans. But now, there’s an option to manage your plan. Remember how I said Jetpack backups were called VaultPress? With here we are, we have a VaultPress menu item. If we click it, you’ll see that VaultPress is backing up my data right now. It’s done with uploads, and it’s going to work on the rest next. Something important to note. The first backup backs up everything, but in the future, it only backs up changes. So the first one is probably going to be quite slow. But from then on, they should be very speedy. The next thing important to know is that you can close this window. It’s not dependent on your browser being open. It’ll do its thing. And they’re going to email us when it’s done. Another cool thing is we can set up remote access, so that you don’t have to be at your computer to restore your site. Right now, we have a license for one site. It says we’ve never backed up, ’cause it’s still in process. If we upgrade our plan, then they will do a security scan on the backup, and let us know if it finds anything wrong. Let’s go to settings. And there’s a wide variety of things that you can do here. We’re not going to cover them all, because it could get really deep. But you can set up SSH access, so that VaultPress can access your site’s server. Now Siteground does offer SSH, but not all sites do. If not, you could set up SFTP, or regular FTP. Or you could say, “I want to restore my site to some other server.” This is really handy when actually moving servers. If we were to leave Siteground and go to some other host, we could say to VaultPress, hey, go install my site over there, and it could do that. It also knows who we are, what account this is. If we go to activity, it tells us that it’s done a full sync of uploads. We’ll look at our backups, and there probably isn’t any yet. You can still see this icon spinning. Now we need to set up access for VaultPress to access our server better, and that takes us right back to here. Now to allow VaultPress to access our website, we’re going to enable SSH. That stands for secure shell, and it’s a secure way for VaultPress to log in to our site and work on it. So we’re going to click right here, and then we need to fill in our server information. Now some of this we’re going to get from Siteground, because that’s where our site is hosted. So let’s go to Siteground, and log in. Now, setting up SSH isn’t very difficult, but there are a number of steps. So if you follow closely, it should work just great. I’m going to click on my accounts, and go to cPanel. Now in this search right here, we’re going to type SSH. And there’s one icon left. Click that. Now what we want to do is upload a public key. If we go back to VaultPress, and click show public key, it’s right here. We just copy everything in the black here, and on Siteground, paste it here. We don’t put anything in the allowed IP address field. Then click upload. And now our key has been successfully added to our account. If we go back, you can see it right here. So now, we need to go back to our cPanel home. Now to find our username and password, we’re going to go back to my accounts. Which actually leaves cPanel, and we’re going to click right here, information and settings. Now, VaultPress wants a server address, port number, and a username and password. For the server address, we’re going to use our FTP server. Our port number is . This is not standard for SSH, it’s custom to Siteground. And you can find that information in the Siteground documentation. Our username is our cPanel username. Because we’re using a public key, we shouldn’t need a password. So let’s click save. And now it works. I’d like to reiterate that because we used our public key, we don’t need to put our password in. That’s the way keys work. So now, VaultPress can connect directly to our server, and work with the files that it finds there. So just a quick review of what we did here at VaultPress. We went to settings, and we set up SSH, so that it can log in. The other things are interesting, but not vital. We can look at our backups, we can look at our activity. And you can see what it did and when it did it. But let’s go back to our website. Then we’ll go into the admin area, and we’ll go to Jetpack, VaultPress, and on this page, you can see an ongoing progress of how it’s doing. Now that we have finished backups, our site is complete. Everything is done. Let’s do a quick summary of what we’ve built. The first thing we did is set up an account on Siteground. Then they walked us through a wizard which set up our hosting, installed WordPress, set up SSL for secure browsing, and helped us buy a domain name. At that point, we had a plain WordPress site, with default theme and original content. The next thing we did is install some plugins that we knew we were going to need. We installed TinyMCE, so that we had a few extra buttons here, and then we also installed My Eyes Are Up Here, so that we could install images of people and make sure their faces were in the pictures. The next thing we did is pick our theme, and we chose Hestia from Themeisle. It proved to be pretty flexible, and I’m very happy with it. Then we built our homepage, and we went through section by section and used the customizer to create each of these elements. We didn’t have to do any coding to build this entire site. We also made a couple of regular pages with normal content on them. Once we were done building the site, we added on some extra tools. We went through the Siteground Optimizer. Most quality WordPress hosts these days have something similar, so if you host somewhere else, make sure you look for a tool similar to this. We connected to the Google Search Console, as well as Google Analytics. And then we also hooked up Yoast SEO, so that we would have good search engine optimization. Then lastly, we configured Jetpack. Siteground installed it for us. If your host does not, you can install it like a regular plugin. But Jetpack gave us Akismet for spam, its own built-in stats program, and lastly, VaultPress for backups. So now we have a complete site, it’s fully functional, and has a robust back end to keep it working smoothly. I hope you enjoyed building your site as much as I enjoyed building this one. Remember to check out the links in the description for discounts, as well as locations for each of the pieces of software we used. And if you’re interested in learning more about WordPress, and further improving and progressing your site, come take a look through some of the other content we offer over on WinningWP.com.

Näytä lisää videoita …

Mitään lisättävää?

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map