Kuinka luoda yrityksen verkkosivusto WordPress & Elementorin avulla

Opi luomaan yrityksellesi verkkosivusto WordPressin, Elementorin ja Astra -sovelluksen avulla. Nämä ovat kaikki 100% ilmaisia ​​työkaluja, joita käytän henkilökohtaisesti.


Tässä kuinka tehdä verkkosivusto 2019 -opetusohjelma, näytän sinulle enemmän kuin vain verkkosivuston luomisen, opetan myös kuinka SEO optimoida verkkosivustosi ja miten luoda siitä viittauksia.

Tämä opetusohjelma on kattava ja pisin kuinka web-sivuston opetusohjelma rakennetaan. Toivottavasti nautit siitä.

Tarvitsemasi asiat:

  • Hosting. Suosittelen SiteGroundia.
  • verkkotunnus.
  • WordPress-teema. Tässä opetusohjelmassa käytämme ilmaista Astra-teemaa.
  • WordPress Page Builder. Tätä varten käytämme ilmaista Elementor-sivunrakentajaa.

Aloitetaan!

Vaihe 1: Osta web-hosting ja verkkotunnus.

Tärkein osa yrityksesi verkkosivustoa on isännöinti. Isännöinti aikoo selvittää kuinka nopeasti verkkosivustosi latautuu. Tämä on erittäin tärkeä tekijä, joka vaikuttaa lyijyn luomiseen ja muuntamiseen. Google suosii myös nopeampia verkkosivustoja, joilla on alhaiset poistumisprosentit, joten nopeampi verkkosivusto lisää mahdollisuuksiasi sijoittua Googlessa.

Yksi asia, jonka haluaisin huomauttaa, on välttää EIG- ja GoDaddy-yrityksiä mahdollisimman paljon. EIG tarkoittaa Endurance International Groupia, ja se hallitsee yli 60 isäntäyritystä. Se potkaisee heidän sisäisen tukihenkilöstönsä ja yhdistää kaiken yhden sateenvarjon alle. Mitä tapahtuu, kärsii asiakastuki, isäntälaatu ja yleinen palvelun laatu.

Tässä on joitakin tunnettuja EIG-yrityksiä:

  • hostgator
  • BlueHost
  • iPage
  • Arvixe
  • Läski lehmä
  • HostMonster pieni oranssi

GoDaddyllä on myös paljon huonoja arvosteluja laadusta ja asiakaspalvelusta, ja heidän isännänsä verkkosivustot latautuvat todella hitaasti.

Haluat myös välttää äiti- ja pop-isäntiä, koska heillä ei ole resursseja edistyneiden hosting-tekniikoiden käyttämiseen, jotka antavat verkkosivustollesi reunan.

Haluat myös valita isäntä, joka tarjoaa ilmaisia ​​SSL-varmenteita. Ilman SSL-varmennetta verkkosivustosi yläosassa on tämä ruma ”Ei suojattu” -merkki:

ole turvallinen

Jos olet yritys, voit käytännössä jättää hyvästit potentiaalisille asiakkaille, joilla on kyseinen etiketti. Jos hosting ei tarjoa ilmaisia ​​SSL-varmenteita, yksi SSL-varmenne voi maksaa sinulle 50–100 dollaria vuodessa verkkosivustoa kohden.

Haluat myös palvelun, jonka avulla voit päivittää jotain nimeltä PHP7, mikä tekee verkkosivustostasi paljon nopeamman.

Sivustokenttä, ensisijainen Web-hosting-palvelu

Löysin kaikki nämä kriteerit täyttävän isännöintipalvelun SiteGround. SiteGround tarjoaa ilmaisen SSL-sertifikaatin, mahdollistaa päivityksen PHP7: ksi, tarjoaa laadukasta isäntää ja uskomattoman asiakastuen. Se on todella paras siellä.

Tässä on SiteGroundin tärkeimmät ominaisuudet:

  • Ilmainen SSL-varmenne
  • Nopea asiantunteva tuki
  • WordPress-vaiheistusympäristö
  • Ilmaiset verkkosivustojen siirrot
  • 30 päivän varmuuskopioita

Olen tehnyt heidän kanssaan hämmästyttävän sopimuksen antaa 70% alennuksen kaikille, jotka kirjautuvat käyttämään tämä linkki. Joten jos haluat säästää rahaa isännöinnissäsi, napsauta tätä linkkiä ja osta hosting nyt.

Voit ostaa isäntäsi SiteGround-sivustolta, napsauta tätä linkkiä. Kun olet laskeutunut heidän kotisivulleen, näet neljä erityyppistä isännöintiä:

valitse tontti suunnitelma

Valitse WordPress-hosting ja napsauta Aloittaa. Näet sitten kolme hinnasuunnitelmaa:

sivuston WordPress-palvelun hinnoittelu

Valitse yksi tarpeidesi ja budjettisi mukaan. Voit myös tarkistaa heidän kunkin hosting-suunnitelman vertailu jotta pystyt päättämään, mikä sopii yrityksesi tarpeisiin.

Kun olet valinnut suunnitelman, napsauta Hanki suunnitelma. Sitten siirrytään seuraavaan vaiheeseen, joka on verkkotunnuksen valinta. Jos sinulla on jo verkkotunnus, valitse ”Minulla on jo verkkotunnus”. Mutta jos sinulla ei ole, valitse “Rekisteröi uusi verkkotunnus” joten voit ostaa verkkotunnuksen heti SiteGround-sivustosta. Tämä maksaa 15,95 dollaria vuodessa.

valitse verkkotunnus

Muista, että jos verkkotunnus, jonka haluat ostaa, ei ole enää saatavilla, SiteGround ilmoittaa sinulle, ja sinun on valittava toinen. Kun sinulla on verkkotunnus, napsauta Edetä.

Seuraava vaihe ostoksesi suorittamiseksi on tarkat henkilökohtaiset ja laskutustiedot. Kun olet valmis, napsauta Maksa nyt. Sinulla on nyt luotettava web-hosting ja verkkotunnus.

Vaihe 2: Asenna WordPress.

WordPress on verkkosivustojen luontityökalu, jota käytämme yrityksesi verkkosivustosi luomiseen. Se on täysin ilmainen, erittäin helppo käyttää, mutta silti erittäin tehokas. Siihen kuuluu tuhansia laajennuksia ja teemoja, joiden avulla voit tehdä verkkosivustollasi mitä haluat.

SiteGround tulee tosiasiassa yhden napsautuksen WordPress-asennuksella, joka asentaa WordPressin nopeasti sinulle.

Kun olet suorittanut isäntäostoksesi, näet ruudun, jossa on linkki “Jatka asiakasaluetta”. Napsauta sitä ja siirryt sivulle, jolla voit määrittää uuden isäntätilisi. Alla Asenna verkkosivustosi, valita Aloita uusi verkkosivusto.

Näet sitten luettelon ohjelmistoista, jotka voit asentaa. valita WordPress.

asenna WordPress

Prosessin loppuun saattamiseksi sinun on annettava järjestelmänvalvojan kirjautumistiedot (sähköpostiosoite, käyttäjänimi ja salasana) verkkosivustollesi. Nämä ovat yksityiskohdat, joita käytät verkkosivustosi taustakuvaan, joten muista pitää ne suojattuina.

Kun olet valmis, napsauta Vahvistaa > Täydellinen asennus. Ja sinulla on nyt suora, itse isännöimä WordPress-verkkosivusto.

Vaihe 3: Asenna SSL-varmenne.

Ennen kuin teet mitään muuta, haluan ensin näyttää sinulle, kuinka asentaa SSL-varmenne päästäksesi eroon Not Secure -etiketistä, jonka näytin sinulle aiemmin. Alla Omat tilit, klikkaus Mene cPaneliin.

mene cpaneliin

CPanel on paikka, johon voit asentaa erilaisia ​​ohjelmistoja ja työkaluja verkkosivustollesi. Jos vierität kokonaan alas, sinun pitäisi nähdä osio nimeltään turvallisuus. Napsauta tämän osan alla Salatkoon.

antaa salata

Valitse toimialue, johon haluat asentaa SSL-varmenteen, valitse Salatkoon SSL, ja napsauta Asentaa.

Nyt on aika kirjautua sisään uuteen verkkosivustoosi. Klikkaus Omat tilit uudelleen yläreunassa ja napsauta asennukset välilehti. Täällä näet rekisteröimäsi verkkotunnuksen. Koko se on vihreä Siirry hallintaportaaliin painiketta. Napsauta tätä painiketta, niin pääset WordPress-kirjautumissivulle.

Siirry WordPress-järjestelmänvalvojan kojelautaan

WordPress-kirjautumissivut seuraavat yleensä seuraavia muotoja: yourdomain.com/wp-admin ja yourdomain.com/wp-login. Sinun saattaa olla erilainen. Mutta sinun on muistettava tai muistettava kirjautumissivusi URL-osoite, jotta seuraavalla kerralla pääset siihen kirjoittamalla URL suoraan osoitepalkkiin ja joutumatta enää kirjautumaan sisään Sivustokenttään.

WordPress-kirjautumissivu näyttää tältä:

Wordpress kirjautumissivu

Kirjoita käyttäjätunnuksesi ja salasanasi tähän kirjautuaksesi sisään verkkosivustollesi ensimmäistä kertaa.

Kun olet sisällä, sinun on ensin ilmoitettava WordPressille, että sinulla on SSL-varmenne. Tämä on melko helppoa tehdä.

Siirry vasemmalla sivupalkilla asetukset > yleinen. Näytöllä näet kaksi ruutua verkkotunnuksellasi: WordPress-osoite (URL) ja sivuston osoite (URL). Sinun on kirjoitettava kirjain “s” ”http” jälkeen ja kaksoispisteen ”:” eteen molemmille ruuduille.

lisäämällä ssl-varmenne WordPressiin

Kun olet valmis, napsauta Tallenna muutokset. Verkkosivustossasi pitäisi nyt olla riippulukon kuvake aivan verkkotunnuksen vieressä:

suojattu verkkosivusto https: llä

Nyt viimeinen asia, joka meidän on tehtävä SSL-sertifikaatin suhteen, on varmistaa, että ihmiset, jotka kirjoittavat osoitteeseensa “http”, ohjataan uudelleen “https” -osoitteeseesi. Tarvitsemme plugin tehdäksemme sen.

Asenna laajennus siirtymällä kohtaan liitännäiset > Lisää uusi. Etsi laajennusta oikean yläkulman hakupalkista Todella yksinkertainen SSL. Asenna ja aktivoi se.

asenna todella yksinkertainen SSL

Näet sitten tämän ponnahdusviestin kojelaudassa:

aktivoi todella yksinkertainen SSL

Napsauta sinistä Mene eteenpäin, aktivoi SSL! painiketta. Sinut kirjataan ulos, ja kun olet kirjautunut sisään uudelleen, Really Simple SSL -laajennus on täysin voimassa.

Vaihe 4: Asenna Astra-teema ja Astra-sivustot.

Yrityssivustolle haluat teema, jolla on puhdas koodi ja joustavat ominaisuudet, jotta mukauttaminen olisi mahdollisimman helppoa ja nopeaa. Siellä on paljon laadukkaita WordPress-teemoja, mutta teema, jota aiomme käyttää täällä, on Astra-teema.

Astra-teema on ilmainen WordPress-teema, jolla on erinomainen nopeus ja yksinkertaisuus. Pidän siitä eniten siitä, että se konfiguroi itsensä tarvitsemiesi työkalujen perusteella ja tämä helpottaa asioita. On myös Pro-versio, jos haluat käyttää premium-ominaisuuksia.

astra-teema

Tässä on ominaisuuksia, joita rakastan Astrasta eniten:

  • Yksi nopeimmista käytettävissä olevista teemoista
  • Yli 100 aloitussivustoa (useimmat ovat 100% ilmaisia)
  • Joustava megavalikkoominaisuus
  • Tehokas lisäosapaketti
  • Laaja WooCommerce-tuki

Asenna Astra siirtymällä osoitteeseen Ulkomuoto > Teema > Lisää uusi. Etsi Astra, napsauta Asentaa, ja Aktivoida.

Astra-asennus

Toinen mahtava asia Astrassa on se, että siinä on plugin nimeltään Astra-aloitussivustot. Tässä laajennuksessa on kirjasto valmiiksi rakennetuista ilmaisista ja premium-malleista, joita voit käyttää omalla verkkosivustollasi vain muutamalla napsautuksella. Käytämme Astra-sivustomallia leikataksesi verkkosivustomme luomisaika puoliksi.

Astra-asennuksen jälkeen näet tämän viestin kojelaudassa:

aloita astra-sivustolla

Klikkaus Aloittaa. Tämä asentaa Astra Starter Sites sinulle. Voit myös asentaa Astra-sivustot siirtymällä osoitteeseen liitännäiset > Lisää uusi. Etsiä Astra-sivustot ja asenna ja aktivoi se. Siirry sivulle Astra Sites esiintymiset >Astra-aloitussivustot.

Sivun rakentajan valitseminen

Kun Astra Sites on asennettu, sinulta kysytään, mikä sivunmuodostaja haluat: Gutenberg, Elementor, Beaver Builder tai Brizy. Tässä opetusohjelmassa aion käyttää Elementoria.

Elementor on WordPress-sivujen rakentaja, joka vei sivun rakentamisen uudelle tasolle. Sillä on syvä ominaisuusjoukko, mutta se on erittäin helppo käyttää ja hallita. Ilmainen versio riittää kunnollisen verkkosivun luomiseen, mutta jos haluat edistyneempiä ominaisuuksia, kuten mahdollisuuden lisätä yhteyslomakkeita, liukusäätimiä, hinnoittelutaulukoita ja muuta, voit päivittää Pro-versioon.

Astra-sivuston teeman valitseminen

Kun olet valinnut sivusi rakentaja, sinut viedään Astra Sites -mallien kirjastoon. Valittavana on tonnia tyylikkäitä, ammattimaisia ​​malleja – sekä ilmaisia ​​että premium-malleja. Mallit on järjestetty seuraaviin luokkiin: Blogi, Liiketoiminta, Verkkokauppa, Ilmainen ja Muu. Koska olet luomassa yrityksen verkkosivustoa, on parasta selata sitä liiketoiminta jakso.

Valitse aikaa valitsemalla malli, joka mielestäsi vastaa parhaiten tuotemerkkiäsi. Nämä mallit ovat täysin muokattavissa valitsemasi sivunmuodostajan kanssa, mikä tarkoittaa, että voit helposti muuttaa tekstiä, kuvia, asettelua, painikkeita ja periaatteessa kaikkea sivulla olevaa.

Tässä opetusohjelmassa aion käyttää Kirjanpitäjä malli, koska se näyttää silmiinpistävältä ja helppolta.

Jos haluat asentaa teeman, sinun täytyy vain napsauttaa sitä, jotta se siirretään esikatseluun. Jos pidät näkemästäsi, napsauta Tuo teema -painiketta ja varmista, että kaikki ruudut on valittu.

laatikot astra sivustot teema

Jos huomaat, siellä on laatikko, joka sanoo “Asenna vaadittavat laajennukset”. Jos valitset tämän ruudun, kaikki aiheeseen tarvittavat laajennukset asennetaan näyttämään täsmälleen sellaiselta kuin se on. Tätä aihetta varten se asensi WPForms Lite -laajennuksen, jonka avulla voit luoda yksinkertaisia ​​yhteyslomakkeita, ja Elementor, sivunrakentaja, jota käytän. Voit napsauttaa sen vieressä olevaa pientä kysymysmerkkiä nähdäksesi, mitä lisäosia asennetaan.

WPForms on laajennus, joka voi auttaa sinua saamaan yrityksellesi laadukkaita viittauksia tehokkaiden lomakkeiden avulla. Voit tarkistaa WPForms-arvosteluani tietääksesi siitä enemmän. Jos haluat käyttää eri lomakelaajennusta, voit vain poistaa WPForms käytöstä tai poistaa sen liitännäiset > Asennetut laajennukset ja asenna haluamasi lomakerakentaja.

Astra-sivuston teeman asentaminen

Teeman tuominen voi viedä hetken. Älä sulje selainta tai napsauta päivitystä. Odota se, ja kun se on valmis, näet sinisen Näytä sivusto painiketta. Napsauta tätä painiketta siirtyäksesi verkkosivustollesi, jonka teema on nyt juuri tuoma.

Vaihe 5. Suunnitteluelementtien valinta.

Verkkosivustosi näyttää nyt upealta, mutta haluat tehdä siitä oman. Tätä varten tarvitset oman värimaailman, typografian ja logon.

Aloitetaan värivalikoimasta. Jos sinulla on jo brändivärisi, se tulee olemaan helpompaa.

Väripaletin valitseminen

Verkkosivustolla on yleensä 2–3 väriä: ensisijainen, aksentti- ja pop-väri. pääväri on verkkosivustosi hallitseva väri ja todennäköisimmin tuotemerkin väri. Tämän värin avulla ihmiset haluavat muistaa tuotemerkkisi.

Päävärisi valinnassa sinun on tutkittava väripsykologiaa tai miten värit vaikuttavat ihmisten havaintoihin tai käyttäytymiseen. Tietyt värit saavat ihmiset tuntemaan jotain, esim. punainen antaa heille olla huolissaan, joten sinun on otettava nämä asiat huomioon päävärisi valinnassa.

korostusväri käytetään yleensä tiettyjen elementtien erottamiseen kuin muut, kuten otsikot tai viestinimikkeet.

Viimeiseksi pop väri kontrastissa muiden värejen kanssa, jotta verkkosivuston tärkeät elementit erottuvat, kuten toimintakehotuspainikkeet tai lyijynmuodostuslomakkeet.

Haluan käyttää väripaletin valinnassa kahta työkalua. Ensimmäinen niistä on Coolors.co, verkkosivusto, jolla voit selata erilaisia ​​väripaletteja ideoiden tai inspiraation saamiseksi. Jos näet jotain pidät, voit kopioida Hex-koodin nopeasti käyttääksesi sitä WordPressissä.

Jos napsautat Tutkia otsikossa näet tämän suuren palettikokoelman:

coolors väripaletit

Jos näet haluamasi paletin, siirrä hiiri sen päälle ja napsauta näkymä, ja sinut viedään uuteen ikkunaan, jossa näet kunkin värin Hex-koodit.

väripalettien hex-koodit

Nämä Hex-koodit ovat mitä sinun täytyy käyttää näitä värejä verkkosivustollasi. Myöhemmin aion näyttää sinulle kuinka näitä Hex-koodeja käytetään WordPress-taustaohjelmassa.

Toinen hieno työkalu on Colorzilla. Tämä on Google Chrome -laajennus, jonka avulla voit saada minkä tahansa verkkosivun hex-koodin napsauttamalla sitä.

Jos haluat saada Colorzilla-laajennuksen, Klikkaa tästä. Napsauta sitten Lisää Chromeen.

ColorZilla

Näet sitten tämän kuvakkeen työkalurivillä:

colorzilla-kuvake

Joten nyt, jos haluat tietää verkkosivustosi näkemän värin Hex-koodin, napsauta vain tätä kuvaketta ja napsauta sitten väriä, jonka haluat kopioida. Hex-koodi kopioidaan sitten automaattisesti. Voit liittää tämän Hex-koodin tietyille alueille WordPressissä.

Typografian mukauttaminen

Haluat myös käyttää omaa typografiaa, joka vastaa brändisi identiteettiä ja auttaa verkkosivustostasi erottumaan. Verkkosivustoilla on yleensä 2–3 kirjasinta. Aivan kuten väreilläkin, sinulla on ensisijainen fontti jotka ovat otsikoiden tai valikkojen fontteja. Tarvitset myös kehon fontti tekstien kappaleille ja myös ylimääräinen “pop-fontti”Joidenkin tekstien erottamiseksi.

Kuten värit, tarvitset typografiaa, joka pysyy uskollisena tuotemerkillesi, näyttää silmille miellyttävältä ja lähettää oikean viestin tuotemerkistäsi.

Yksi suosikkityökaluistani typografian valinnassa on Fontpair.co. Tämä on verkkosivusto, joka näyttää kuinka kaksi eri kirjasinta näyttävät yhdessä.

fontpair.co

Jos näet jotain pidät, huomioi sen nimi, jotta voit etsiä sitä WordPressistä ja käyttää sitä verkkosivustollasi.

Pidän myös WhatFontin käytöstä, Google Chromen laajennuksesta, joka kertoo millä tahansa verkkosivustolla käytetyn fontin viemällä hiiren sen päälle.

Asentaa WhatFont, Klikkaa tästä napsauta sitten Lisää Chromeen. Sitten näet tämän kuvakkeen työkalurivillä:

whatfont

Jos haluat tietää fontin nimen, napsauta tätä kuvaketta ja vie hiiri tekstin päälle. WhatFont kertoo sinulle tämän fontin nimen, ja jos napsautat sitä, näet myös fontin koon, värin, perheen, tyylin, painon ja muut.

käyttämällä mitäfont

Logon hankkiminen

Viimeiseksi, yrityksesi tarvitsee kauniin logon, joka puhuu tuotemerkkisi perustasta. Täällä voit mennä kolmella eri reitillä. Voit luoda logosi itse käyttämällä ilmaista työkalua nimeltä Kangas, suosittu suunnittelutyökalu, joka tekee suunnittelusta todella helpon myös aloittelijoille.

Olet yllättynyt kuinka monella logomallilla Canvalla on, ja ne kaikki näyttävät mahtavilta. Voit muokata näitä malleja tehdä niistä omia.

Sinun pitäisi kuitenkin tietää, että sinun on päivitettävä Pro: ksi, jos haluat viedä logon läpinäkyvällä taustalla. On kuitenkin yhden kuukauden ilmainen kokeiluversio, joten voit päivittää Proon, viedä läpinäkyvän logon ja peruuttaa ennen kokeilun päättymistä..

kanvaan logot

Voit myös vuokrata logosuunnittelijan tekemään se sinulle. Voit kokeilla verkkosivustoja, kuten Fiverr.com tai 99design, mutta sinun on oltava varovainen valittaessa taiteilijaa tyylin, seurannan, arvostelujen, arviointien ja muun perusteella.

Kolmas reitti, ja luultavasti hyvä idea, jos haluat vahvan brändilogon, on palkata suunnittelustrategia / konsultti. Tällaiset ihmiset ovat ammattilaisia, jotka vievät aikaa ymmärtääksesi tuotemerkkisi merkitystä, missä yrityksesi menee ja mitkä ovat arvot, jotta he voivat sisällyttää sen logoon.

Vaihe 6. Muokkaa verkkosivustoasi.

Kun sinulla on värivalikoima, fontit ja logo verkkosivustollesi, on nyt aika käyttää niitä verkkosivustollasi. Jos olet WordPress-sovelluksen ohjauspaneelissa, siirry kohtaan Ulkomuoto > Muokkaa avataksesi teemamuokkaimen.

räätälöi teema

Voit myös mennä tänne, jos olet verkkosivusi etusivulla. Näytön yläreunassa tulisi olla musta palkki, joka näkyy vain verkkosivustollesi kirjautuneille. Klikkaus Muokkaa avataksesi teemamuokkaimen.

muokata teeman käyttöliittymää

Kun olet teemamuokkaimessa, voit lisätä logon, muuttaa värejä, muuttaa sivuston asettelua ja paljon muuta.

teeman mukauttaja

Vasemmassa sivupalkissa on useita vaihtoehtoja verkkosivustosi muokkaamiseen. Jokaisella teemalla on erilaiset mukautusvaihtoehdot, joten jos käytät toista teemaa, täällä näkemäsi saattaa olla hiukan erilainen kuin minun. Kaikki täällä tekemäsi muutokset näytetään reaaliajassa verkkosivustollasi.

Vaihda sivuston värit tässä teemassa tässä teemassa Värit ja tausta. Sinulla on mahdollisuus muuttaa perusvärejä, leivänrumpua, otsikkoa ja alatunnistepalkkia.

väritaustaeditori

Perusvärit ovat verkkosivustosi teemaväri, linkin väri, tekstin väri ja linkin hover-väri. Vaihda perusvärit napsauttamalla Pohjavärit. Sisällä näet painikkeet, jotka sanovat Valitse Väri. Napsauta näitä painikkeita muuttaaksesi tietyn värin.

Esimerkiksi, jos haluat muuttaa teeman väriä, napsauta Valitse Väri sen vieressä. Tämän jälkeen näet kaksi tapaa valita väri. Ensin voit liittää hex-koodin laatikkoon. Jos muistat, mitä puhuimme heksokoodeista edellisessä vaiheessa, voit kirjoittaa ne hex-koodeihin kuten tällaisille kentille.

Joten jos löysit värin Coolors.costa tai muista paikoista, voit liittää Hex-koodin tähän. Voit valita värin myös sisäänrakennetulla värivalintatyökalulla.

perusvärieditori

Seuraavaksi muutat typografiaa. Palaa mukauttajaan napsauttamalla sivupalkin yläosassa olevaa nuolta ja napsauttamalla sitten Typografia. Voit muuttaa perus-, leipärumpu-, sisältö- ja blogi typografiaa.

typografia

Viimeiseksi, voit lähettää logosi siirtymällä osoitteeseen Layout > ylätunniste > Sivustotunnus. Napsauta Logo-osan alla Vaihda logo -painiketta ja lataa logosi.

vaihda logo

Astra antaa sinun käyttää myös erilaista logoa verkkokalvo- tai korkearesoluutioisissa laitteissa sekä mobiililaitteissa. Voit myös säätää logon leveyttä. Jos vierität alas, voit myös muuttaa sivustosi otsikkoa, lisätä sivuston tunnisteen ja sivuston kuvakkeen tai favicon.

Ehdotan, että tutustu teemamuokkaimeen nähdäksesi eri asiat, joita voit tehdä täällä. Astra-teeman avulla voit muuttaa esimerkiksi otsikon ja alatunnisteen asettelua, muuttaa blogiviestien rakennetta, muuttaa sivustosi leveyttä ja paljon muuta.

Kun olet muokannut, älä unohda napsauttaa Julkaista jotta muutokset tulevat voimaan sivustossasi.

Vaihe 7. Sivustosi mukauttaminen Elementorin avulla.

Nyt kun verkkosivustosi värit, typografia ja logo ovat kaikki asetettu, on aika siirtyä Elementoriin ja muuttaa täysin verkkosivuston ulkonäköä niin, että se vastaa tuotemerkkiäsi. Aiomme muuttaa kuvia, tekstejä, painikkeita, asettelua ja paljon muuta.

Elementorin avulla sivua voi muokata kahdella tavalla. Ensin, jos olet taustana, siirry kohtaan sivut ja sinun pitäisi nähdä luettelo kaikista verkkosivustosi sivuista. Tämä sisältää sivut, jotka Astra Site on automaattisesti luonut. Sivut, jotka on tehty tietyn sivunmuodostajan (esim. Elementor) kanssa, merkitään sellaisiksi:

sivut

Vedä hiiri Elementorin avulla sivulle, jota haluat muokata, ja napsauta Muokkaa Elementorilla.

muokata elementor-taustaohjelmalla

Se vie sinut Elementoriin.

Jos olet verkkosivustosi etuosassa, voit kirjoittaa Elementorin siirtymällä sivulle, jota haluat muokata, ja napsauttamalla Muokkaa Elementorilla yläreunan mustalla palkilla:

muokata elementor-käyttöliittymällä

Elementor-käyttöliittymä on helppo ymmärtää ja tottua, koska se on melko samanlainen kuin teemamuokkaaja. Suurimmassa osassa näyttöä näkyy muokattava sivu, kun vasemmalla puolella on sivupalkki, jossa on säätimet ja vaihtoehdot.

elementor

Jos huomasit, otsikkoa ei voi nähdä Elementorin sisällä. Syynä on Elementorin ilmainen versio, joka ei pysty muokkaamaan otsikoita ja alatunnisteita. Tämä ominaisuus on käytettävissä vain Elementor Prolle.

Vasemmasta sivupalkista löydät elementtejä jonka voit lisätä sivullesi. Kuten näet, voit lisätä otsikon, kuvan, videon, painikkeen, jakajan ja muut. Voit lisätä nämä elementit vetämällä ja pudottamalla ne haluamallesi alueelle.

Elementor sallii myös tekstin sisäisen muokkaamisen, mikä tarkoittaa, että voit muuttaa itse sisältöalueen tekstiä. Tässä on joitain asioita, jotka voit tehdä Elementorin sisällä olevilla teksteillä:

tekstin muokkaaminen elementorissa

Kuten näette, voit muokata tai poistaa tekstiä suoraan sisältöalueella, mikä tekee siitä paljon helpomman. Sivupalkista löytyy lisää mukautusvaihtoehtoja, kuten koon, värin, painon, typografiaperheen ja varjon muuttaminen. Voit myös lisätä animaatioita, kuten yksinkertaisia ​​haalistuksia, zoomausta, pomppimista ja paljon muuta.

Haluat myös käyttää omia kuviasi tehdäksesi sivustosta täysin oman. Voit helposti korvata tai poistaa kuvan, jos se on mitä haluat. Voit mukauttaa kuvaa napsauttamalla sitä ja asetukset ilmestyvät vasempaan sivupalkkiin. Voit lähettää uuden kuvan, muuttaa sen kokoa, lisätä reunuksen tai varjon, lisätä animaation ja paljon muuta.

kuvan muokkaaminen elementorissa

Verkkosivustollani haluan poistaa tämän kuvan kokonaan ja käyttää vain toista taustakuvaa. Jos haluat poistaa kuvan, siirrä hiiri kuvan päälle ja napsauta hiiren kakkospainikkeella sininen kynäkuvake oikeassa yläkulmassa. Ponnahdusvalikko tulee näkyviin. Klikkaus Poistaa kuvan poistamiseksi.

kuvan poistaminen elementorista

Voit mukauttaa otsikkoa siirtämällä hiiren sen päälle ja napsauttamalla yläreunassa olevaa katkoviivakuvaketta:

otsikon mukauttaminen elementoriin

Otsikon mukautusasetukset ilmestyvät sitten vasempaan sivupalkkiin. Voit muuttaa otsikkosi taustakuvan napsauttamalla Tyyli ja mene Tausta. Täältä voit ladata uuden taustan.

otsikon mukauttaminen

Kuten näet, kuvan lataamisen jälkeen säädin taustapeittoa varmistaakseni, että kuva näkyy selvästi. Tein tämän menemällä Taustapeittokuva ja opasiteetin säätäminen.

Muokkasin myös tekstin väriä varmistaakseni sen näkyvyyden, ja säädin tekstin leveyttä siten, että se ei ole päällekkäin kuvan kanssa. Tein tämän menemällä Pitkälle kehittynyt > Mukautettu sijainti ja valitsemalla Mukautettu leveydelle.

Upean verkkosivun rakentaminen on niin helppoa Elementorin avulla. Käytettävissä on vain niin monia vaihtoehtoja, joten on vain tutkittava jokainen nurkka ja kallio. Voit tutkia sitä omassa tahdissasi, ja jos on jotain, jota et ymmärrä, voit tavoittaa minut alla olevan kommenttiosion kautta tai jopa etsiä Elementorin kattavaa tietoa tietopohja.

Minulla on myös Elementor-opetusohjelma, jossa näytän kuinka pääset alkuun Elementorin kanssa nopeasti. Voit katsoa sitä tässä.

Vaihe 8. Suojaa verkkosivustosi.

On myös tärkeää, että yrityksen verkkosivusto on mahdollisimman suojattu mahdollisilta hakkeroinnilta ja identiteettivarkauksilta. Tosiasia on, että jotkut teistä saattavat olla alttiita kyberhyökkäyksille heikkojen salasanojen, laajennusten haavoittuvuuksien ja vanhentuneiden ohjelmistojen takia. Nämä asiat jättävät reiän verkkosivustollesi, ja sinun on löydettävä tapa estää nämä reiät.

Paras WordPress-laajennus, jonka olen tähän mennessä löytänyt, on iThemes Security. Tämän laajennuksen ilmainen versio tarjoaa jo vahvoja suojausominaisuuksia, ja voit aktivoida sen yhdellä napsautuksella.

Asenna iThemes Security siirtymällä kohtaan liitännäiset > Lisää uusi etsi sitten iThemes-suojaus.

asenna ithemes

Kun se on aktivoitu, näet sivupalkissa uuden vaihtoehdon, nimeltään turvallisuus. Mene turvallisuus > asetukset ja sinun pitäisi nähdä viesti eri ominaisuuksista, joita iThemes voi tehdä sinulle.

suojattu sivuston ithemes

Kaikkien näiden ominaisuuksien käyttöönotto vie vain yhden napsautuksen siniseltä Suojattu sivusto painiketta. Kun napsautat tätä painiketta, näet tämän viestin:

aktivoi verkon raa'an voiman suojaus

Network Brute Force Protection -ominaisuus on ominaisuus, jossa käyttäjät, jotka yrittivät murtautua muihin tämän verkon jäseniin, kielletään automaattisesti murtautumasta sinuun. Tämä on melko hyvä ominaisuus, joka vain iThemesillä on, joten aktivoi tämä vain antamalla sähköpostiosoitteesi ja napsauttamalla Aktivoi verkon raajojen suojaus.

Vain muutamalla napsautuksella verkkosivustosi on nyt suojattu. Voit tehdä niin paljon enemmän tällä laajennuksella, ja jos haluat lisätietoja siitä, voit katsella iThemes-tietoturvakatsausta ja asennusohjeita tässä.

Vaihe 9. Varmuuskopioi verkkosivustosi.

Sinun on myös varmuuskopioitava verkkosivustosi pelastaaksesi itsesi mahdollisesta epäonnistuneesta tapahtumasta, jossa menetät tietosi. Tätä varten aiomme käyttää UpdraftPlus-varmuuskopio.

Asenna tämä laajennus siirtymällä osoitteeseen liitännäiset > Lisää uusi ja etsiä UpdraftPlus-varmuuskopio. Asenna ja aktivoi se.

asenna updraftplus

Kun se on aktivoitu, se luo uuden vaihtoehdon kohtaan asetukset nimeltään UpdraftPlus-varmuuskopiot. Napsauta sitä aloittaaksesi varmuuskopioasetusten määrittämisen.

updraftplus-varmuuskopiot asetuksissa

Kun olet sisällä, napsauta asetukset. Täällä asetamme sen niin, että automaattisia varmuuskopioita tehdään säännöllisesti. Varten Tiedostojen varmuuskopiointiohjelma, Suosittelen sen asettamista viikoittain ja pitämällä yksi varmuuskopioida. Tiedostot eivät muutu usein niin, että ne ovat tarpeeksi hyviä.

Mitä tulee Tietokannan varmuuskopiointiaikataulu, koska tämä muuttuu usein, aseta se päivittäin ja säilytä 7 varmuuskopiota.

Kun olet asettanut aikataulut, vieritä alas ja paina Tallenna muutokset. Vieritä sitten takaisin ylöspäin valitaksesi mihin haluat tallentaa varmuuskopiot. Suosittelen yleensä Dropboxia, koska sitä on erittäin helppo käyttää, mutta voit käyttää mitä tahansa ja niin monta kuin haluat.

updraftplus-varmuuskopioiden määrittäminen

Napsauta haluamaasi etävarastoa ja napsauta Tallenna muutokset uudelleen. Näet tämän viestin:

etävarastointitodennus

Sinun on napsautettava tätä linkkiä valtuuttaaksesi UpdraftPlus-varmuuskopiot tallentamaan varmuuskopiot valittuun tallennustilaan. Koska valitsin tässä esimerkissä Dropboxin, tämän linkin napsauttaminen johtaa minut Dropboxin kirjautumissivulle. Kun kirjaudun sisään, näen tämän viestin:

suorita asennus updraftsplus-varmuuskopiot

Minun on vain napsautettava Täydellinen asennus, ja minut viedään takaisin WordPressin UpdraftsPlus-taustajärjestelmään tämän vahvistusviestin ollessa yläreunassa:

todennus täydellinen updraftplus

Jos halusin tehdä varmuuskopion, minun on tehtävä vain napsauttaa sinisiä Varmuuskopioi nyt painiketta. UpdraftPlus luo myös varmuuskopioita aikaisemmin tekemäni aikataulun mukaisesti ja työntää ne DropBoxiin.

Jos haluat palauttaa varmuuskopion, napsauta vain Olemassa olevat varmuuskopiot ja napsauta Palauttaa.

Vaihe 10. Optimoi verkkosivustosi.

Olemme vasta viimeisessä vaiheessa, ja tässä vaiheessa aiomme nähdä kuinka optimoida verkkosivustosi Googlen kaltaisille hakukoneille. Olen varma, että suurin osa teistä on jo kuullut hakukoneoptimoinnista tai hakukoneiden optimoinnista. Lyhyesti sanottuna, se on käytäntö varmistaa, että verkkosivustosi on optimoitu oikealla tavalla, jotta hakukoneiden on helpompi löytää sivusi ja näyttää sinulle tulossivuilla.

SEO: lla on näkökohta, jota kutsutaan sivun SEO, ja nämä ovat käytäntöjä, joita voit toteuttaa verkkosivustollasi WordPressin sisällä ja välittää hakukoneille selvästi, mistä verkkosivustosi ja sisältösi tarkoittaa.

Nämä ovat joitain sivun SEO parhaita käytäntöjä, jotka sinun on otettava käyttöön:

  • Kirjoita meta-otsikko ja metakuvaus jokaiselle sivulle ja viestille.
  • Lisää avainsanoja tai avainlauseita ja käytä niitä koko sisällössä.
  • Lisää ALT TXT jokaiselle sivun / viestin kuvalle.

Jos et tiedä mitä nämä asiat ovat, se on kunnossa. He ovat melko helppo oppia. Meta-otsikko on otsikko, joka näkyy Google-tuloksissa, ja metaan kuvaus on lyhyt kuvaus otsikon alla. Tässä on esimerkki:

google-hakutulosesimerkki

Avainsana on se, mitä käyttäjät kirjoittavat hakukoneeseen etsimään jotain. Meta-otsikko on tuloksen otsikko ja meta-kuvaus on alla oleva lyhyt kuvaus. Nämä ovat tärkeitä yksityiskohtia, koska ne kertovat Googlelle, mistä sivusta on kyse, ja että se liittyy avainsanoihin ”salon new York”.

Tämä on lyhyt luettelo sivun SEO tekniikoista, koska täällä teet kirjaimellisesti niin paljon. Mutta nyt keskitymme näihin.

Näiden asioiden tekemistä varten tarvitaan plugin. Yoast SEO on yksi parhaista sivun SEO WordPress -laajennuksista, ja käytämme sitä tässä opetusohjelmassa. Asenna tämä laajennus vain siirtymällä osoitteeseen liitännäiset > Lisää uusi ja etsiä Hiiva SEO. Klikkaus Asenna nyt ja Aktivoida.

asenna hiiva SEO

Nyt, kun siirryt mille tahansa sivulle tai viestiin, näet tämän uuden ruudun editorialueen alla:

hiiva seo laatikko

Tähän voit lisätä meta-otsikon, metakuvauksen ja avainsanat. Lisää avainsana kirjoittamalla se alla olevaan ruutuun Tarkenna avainlause:

lisää avainsana

Lisää meta-otsikko ja kuvaus napsauttamalla Muokkaa katkelmaa nappi.

muokkaa katkelmaa

SEO-otsikko on kohta, johon sinun pitäisi lisätä meta-otsikko. On hyvä käytäntö sisällyttää tarkennusavauslauseesi tähän. Metakuvauskenttään tulisi antaa selkeä käsitys sivun sisällöstä ja sisällyttää tähän myös avainsana.

Kun kirjoitat jotain SEO-otsikko- ja metakuvauskenttään, sen alla näkyy oranssi edistymispalkki. Tämä tarkoittaa, että teksti on edelleen liian lyhyt. Kun se muuttuu vihreäksi, se tarkoittaa, että tekstin pituus on juuri oikea. Jos se muuttuu punaiseksi, se on liian pitkä ja sinun pitäisi lyhentää sitä. Pitkät otsikot ja kuvaukset leikkaavat tulokset, joten on parempi pysyä viheralueella.

Toinen asia, jonka haluat tehdä, on varmistaa, että sivustokarttasi on käytössä ja että se todella toimii. Siirry kohtaan Hiiva SEO > yleinen > ominaisuudet. Vieritä alaspäin, kunnes näet XML-sivukartat. Varmista, että tämä on käytössä, ja napsauta sitten sinistä kysymysmerkki-kuvake. Näet sitten linkin, joka sanoo Katso XML-sivukartta. Napsauta tätä nähdäksesi sivustokarttasi.

sivustokarttojen mahdollistaminen

Monille teistä tämä saattaa johtaa sivulle 404. Mutta älä raivota. Korjaus on melko yksinkertainen. Sinun tarvitsee vain mennä asetukset > permalinks. valita Postinimi ja osui Tallenna muutokset.

postin nimi pysyvä linkki

Kun yrität käyttää uudelleen XML-sivukarttaa, näet jotain tällaista:

xml-sivukartta

Käärimistä

Ja tämä kietoi tämän opetusohjelman liiketoimintasivuston luomiseen WordPressin avulla. Haluan napauttaa sinua harteilla, koska olet tehnyt niin paljon ja saavuttanut niin paljon seuraamalla tätä opetusohjelmaa. Jos sinulla on kysyttävää, pudota ne alla kommenttiosaan ja autan mielelläni.

SiteGround

SiteGround on erittäin suositeltava web-isäntä verkossa, koska he ovat palvelleet WordPress-käyttäjiä ja silti hinnoitellut edelleen. Ne tunnetaan eniten nopeasta suorituksestaan ​​ja yhtä nopeasta tuestaan.

Tärkeimmät SiteGround-ominaisuudet:

  • Ilmainen SSL-varmenne
  • Nopea asiantunteva tuki
  • WordPressin vaiheittainen ympäristö
  • Ilmaiset verkkosivustojen siirrot
  • Päivittäiset varmuuskopiot

SiteGround on vankka valinta web-hosting-tarpeitasi varten. Ne palvelevat WordPress-verkkosivustoja ja tarjoavat vähemmän resursseja kuin kilpailijat, mutta suurempaa luotettavuutta.

Tutustu SiteGroundiin

Astra-teema

Astra on ilmainen WordPress-teema, joka keskittyy nopeuteen. Valinnaisesti voit ostaa Pro-version 59 dollarilla, joka lisää joitain lisäasetuksia ja -vaihtoehtoja.

Astra-teeman keskeiset ominaisuudet:

  • Ei Fastes-teema, mutta se ei ole slouch
  • Paljon ilmaisia ​​esittelysivustoja
  • Joustava megavalikkoominaisuus
  • Mukautettujen asettelujen asetukset
  • WooCommerce-tuki
  • LearnDash-tuki

Astra-teema on reilu valinta mihin tahansa WordPress-verkkosivustojen suunnitteluprojektiin. Luulen, että suurin kysymys on, jos joudut jopa ostamaan teema nykyään, kun sivunrakentajat tekevät samoja asioita, joille tarvitset teema. Esimerkiksi Elementorilla on ilmainen Hello-teema, jonka avulla sivusi rakentaja voi tehdä kaiken työn.

Pro-teeman ostamiseen on vielä hyviä syitä, mutta useimmille ihmisille ne todennäköisesti sopivat ilmaisella teemalla.

Uskon kuitenkin, että Astra-teema ei ole pysynyt ajan tasalla eikä en enää suosittele sitä.

Saatavilla on paljon parempia moderneja teemoja, jotka tarjoavat sisäänrakennetut otsikko- ja alatunnisterakentajat vs. rajoitukset 3 asetteluun sekä joustavammat sivu- ja viestiasettelut.

Katso Astra-teema

Elementor

Elementor on WordPress-sivujen rakentaja, joka on ottanut WordPressin web-suunnittelun myrskyn kautta. Sillä on syvin ominaisuusjoukko, mutta sitä on kuitenkin helppo käyttää ja hallita. Elementor on kaikkein täydellisin ilmaisen sivun rakentaja. Mukana on myös Pro-lisäosa, joka lisää kehittäjäominaisuuksia.

Keskeiset elementtiominaisuudet:

  • Live-käyttöliittymäeditori
  • Verkkosivun henkilökohtaiset ominaisuudet
  • Template & Block Library
  • Laaja mobiiliherkkä vaihtoehto
  • Tehokkain ponnahdusikkunoiden rakentaja
  • PRO Luo mukautettuja ylätunnisteita / alatunnisteita
  • PRO Luo viestityyppiset asettelut

Elementor on tällä hetkellä vahvin sivunrakentaja. Ne vapauttavat jatkuvasti uusia ominaisuuksia, jotka ovat nykyisten suunnittelusuuntausten mukaisia. Tämä tarkoittaa, että pystyt pitämään verkkosivustosi asiaankuuluvana.

Elementor Pro on uskomaton arvo ottaen huomioon kaikki siihen kuuluvat lisämoduulit ja virranominaisuudet.

Jos aloittaisin tänään uuden verkkosivustoprojektin, Elementor olisi valitsemani sivunrakentaja. Pidän WordPress-sivunmuodostajaa välttämättömänä, ja sitä on ilo käyttää.

Lähtö Elementor

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