Kako izraditi web stranicu (korak-po-korak vodič): 4 koraka

2024 Autor: John Day | [email protected]. Zadnja promjena: 2024-01-30 09:35

U ovom vodiču pokazat ću vam kako većina razvojnih programera izrađuje svoje web stranice i kako možete izbjeći skupe graditelje web stranica koji su često previše ograničeni za veće web mjesto.

Također vam pomažem da izbjegnete neke greške koje sam učinio na početku.

Korak 1: Nabavite web hosting i registrirajte naziv domene

Da biste postavili svoj WordPress (ili bilo koju drugu vrstu web stranice), trebat će vam dvije stvari:

• Naziv domene (web adresa poput YourSiteName.com)
• Web Hosting (usluga koja povezuje vašu web stranicu s internetom)

Da biste pohranili svoje slike, sadržaj i datoteke web stranica, trebat će vam web hosting. Bez web hostinga vaša web stranica neće biti vidljiva na Internetu.

Posjedovanje vlastitog naziva domene izgleda daleko profesionalnije od posjedovanja vaše web lokacije na tuđoj domeni (kao što je yourbusiness.my-free-website.com), a i super je pristupačno. Većina pružatelja usluga hostinga nudi domene BESPLATNO na godinu dana (obično ~ 15 USD godišnje).

Ukratko - bez web hostinga i naziva domene, vaša web stranica NEĆE postojati.

Gdje mogu registrirati naziv domene i dobiti web hosting?

Potpuno otkrivanje podataka: Zarađujem proviziju ako na kraju kupite Bluehost putem mojih preporuka u ovom vodiču. To mi pomaže u održavanju i ažuriranju WebsiteSetup-a. Hvala na podršci.

Uglavnom sam Bluehost koristio kao web hosting i besplatni registar domena.

Njihova početna cijena počinje od 2,75 USD mjesečno, a trenutno besplatno unose naziv domene (prva godina) - pa ih vrijedi provjeriti.

Oni su također jedan od najpopularnijih pružatelja usluga hostinga na tržištu, tako da su definitivno dovoljno uhodani i sigurni da ugoste vašu web stranicu.

Iako je većina njihovih poslužitelja sa sjedištem u SAD -u, oni mogu podnijeti veliki promet iz cijelog svijeta. I vjerojatno je jeftiniji od vašeg lokalnog domaćina.

Kao netko tko živi u Europi, ipak ih više volim koristiti. Već imate naziv domene i hosting?

Samo naprijed i preskočite na korak 2, gdje ću vam objasniti kako možete postaviti svoju web stranicu.

Preuzmite korak po korak kako se prijaviti kod davatelja usluga web hostinga (i registrirati naziv domene ako ga još nemate) u nastavku:

Korak 2: Postavite svoju web stranicu

Nakon što ste kupili naziv domene i postavili hosting, na dobrom ste putu!

Sada je vrijeme za pokretanje vaše web stranice. Prvo što trebate učiniti je instalirati WordPress na svoju domenu.

Instaliranje WordPress -a

Postoje dva moguća načina za instaliranje WordPressa, jedan MNOGO lakši od drugog.

1. Da biste izradili web stranicu s WordPressom (ili Joomlom i Drupalom), upotrijebite "instalaciju jednim klikom":

Gotovo svaka pouzdana i uhodana tvrtka za hosting ima integriranu instalaciju za jedan klik za WordPress, što olakšava početak rada.

Ako ste se prijavili s Bluehostom ili nekom drugom sličnom tvrtkom za hosting, trebali biste pronaći svoju instalaciju s jednim klikom na upravljačkoj ploči računa.

Evo koraka koje trebate slijediti (trebali bi biti slični/isti u svim većim tvrtkama za web hosting):

1. Prijavite se na svoj hosting račun (Bluehost).
2. Idite na svoju upravljačku ploču.
3. Potražite ikonu "WordPress" ili "Web stranica".
4. Odaberite domenu na koju želite instalirati svoju novu web stranicu.
5. Pritisnite gumb "Instaliraj odmah" i dobit ćete pristup svojoj novoj web stranici WordPress.

(Provjerite gornju sliku 2)

2. ILI RUČNA INSTALACIJA (Za one koji ne koriste Bluehost ili bilo koji sličan host):

Ako iz nekog čudnog razloga (neke tvrtke za hosting ne nude instalaciju za jedan klik za WordPress) nemate mogućnost automatske instalacije WordPressa, pogledajte ovaj priručnik u nastavku:

1) Preuzmite WordPress odavde:

2) Izradite novu mapu na radnoj površini i raspakirajte WordPress u njoj

3) Potražite datoteku s imenom wp-config-sample.php i preimenujte je u: wp-config.php

4) Sada otvorite wp-config.php (na primjer s bilježnicom) i ispunite sljedeće retke:

• define ('DB_NAME', 'ime_baze_ovo'); - Naziv baze podataka (ako ga ne znate, pitajte ovo od podrške za hosting)
• define ('DB_USER', 'korisničko ime_ovdje'); - Vaše korisničko ime za hosting
• define ('DB_PASSWORD', 'lozinka_ovdje'); - Vaša lozinka za hosting

Nakon što popunite praznine, spremite datoteku.

5) Sada se prijavite na svoj hosting ftp (za to preuzmite FileZilla). FTP adresa obično je ftp.vaša domena.com, korisničko ime i lozinka isti su koje ste koristili za registraciju na svom hostu

6) Ako postoji datoteka pod nazivom "indeks" - izbrišite je. Nakon toga prenesite sve datoteke iz svoje WordPress mape na svoj FTP poslužitelj. Vjerujem da možete koristiti funkciju "drag n drop" u FileZilli

7) Nakon što dovršite prethodne korake, idite na URL: yourdomain.com/wp-admin/install.php Ovo je stranica koju biste trebali vidjeti: (Provjerite gornju sliku 3)

Samo ispunite obrasce i spremni ste!

Pssst-ako nemaju instalaciju jednim klikom, možda imate posla s lošim domaćinom!

Korak 3: Dizajnirajte svoju web stranicu

Nakon što uspješno instalirate WordPress na svoju domenu, vidjet ćete vrlo osnovnu, ali čistu web lokaciju.

Ali ne želite izgledati kao svi drugi, zar ne?

Zato vam je potrebna tema - predložak dizajna koji govori WordPressu kako bi vaša web stranica trebala izgledati. Pogledajte primjer besplatne WordPress teme koju možete instalirati:

(Provjerite gornju sliku 2)

Evo gdje se zabavlja: Postoji 1500+ izvrsnih, profesionalno dizajniranih tema koje možete birati i prilagoditi vlastitom sjedenju.

Većina tema WordPressa besplatna je za korištenje i vrlo ih je moguće prilagoditi.

Evo kako pronaći temu koja vam se sviđa

1. Prijavite se na svoju nadzornu ploču WordPress: Ako niste sigurni kako, upišite: https://yoursite.com/wp-admin (zamijenite "yourite" svojom domenom). Ovako izgleda nadzorna ploča WordPress:

(Provjerite gornju sliku 3)

2. Pristupite BESPLATNIM temama: Nakon što ste na nadzornoj ploči, imate pristup više od 1500 besplatnih tema! Samo potražite "Izgled" na bočnoj traci, a zatim kliknite "Teme".

Ako želite nešto profesionalnije ili elegantnije od onog što ovdje možete pronaći, možete se uputiti na ThemeForest.net gdje postoji velika biblioteka tema za biranje po različitim cijenama.

Ali prije nego što to učinite, zaista vam predlažem da barem pokušate provesti neko vrijeme pregledavajući besplatne teme. Mnogi od njih su doista profesionalni i dobro napravljeni; pa ih nemojte otpisivati.

Kao što možete vidjeti gore, instaliranje nove teme za vašu web stranicu vrlo je jednostavno.

Možete pretraživati određene ključne riječi i/ili koristiti filtre za pronalaženje tema koje odgovaraju vašem stilu. Pronalaženje savršene teme može potrajati, ali vrijedi.

Također biste trebali potražiti teme koje su "responzivne", jer to znači da će izgledati dobro na bilo kojem mobilnom uređaju. Samo ga unesite kao jednu od ključnih riječi i sve će biti spremno!

3. Instalirajte svoju novu temu

Nakon što pronađete temu koja vam se sviđa, instaliranje je jednostavno kao što je klik na “Instaliraj”, a zatim na “Aktiviraj”.

VAŽNO: Promjenom tema nećete izbrisati svoje prethodne postove, stranice i sadržaj. Teme možete mijenjati onoliko često koliko želite bez brige da ćete izgubiti ono što ste stvorili.

Korak 4: Dodajte sadržaj na svoju web stranicu

S instaliranom temom spremni ste za početak stvaranja sadržaja. Prođimo brzo kroz neke osnove:

Dodavanje i uređivanje stranica:

Želite stranicu "Usluge" ili stranicu "O meni" (kao što imam na svom izborniku pri vrhu web stranice)?

1. Na bočnoj traci na nadzornoj ploči WordPressa potražite “Stranice” -> “Dodaj novu”.

2. Naći ćete zaslon koji izgleda poput onoga što ste možda vidjeli u Microsoft Wordu. Dodajte tekst, slike i još mnogo toga za izradu željene stranice, a zatim je spremite kad završite. (Provjerite sliku iznad 1)

Dodavanje stranica u izbornik: Ako želite da vaša nova stranica bude povezana s navigacijskom trakom, 1. Spremite sve promjene koje ste unijeli na stranicu klikom na "Ažuriraj"

2. Pritisnite “Izgled” -> “Izbornici” na bočnoj traci nadzorne ploče WordPress.

3. Pronađite stranicu koju ste stvorili i dodajte je na popis tako da potvrdite okvir pokraj nje, a zatim "Dodaj u izbornik".

(Provjerite sliku iznad 2)

Dodavanje i uređivanje postova:

Ako na svojoj web stranici imate blog, na sljedeće ćete se obratiti "Postovi". Za grupiranje sličnih postova možete koristiti različite kategorije.

Ako želite dodati blog na svoju web stranicu, možete koristiti različite kategorije i postove. Recimo da želite stvoriti kategoriju pod nazivom "Blog". Jednostavno ga dodajte u svoj izbornik i počnite objavljivati postove.

Evo što trebate učiniti:

Izradite novu kategoriju idite na "Postovi -> Kategorije"

ILI

Napravite post na blogu tako da odete na “Postovi -> Dodaj novo”. Nakon što dovršite pisanje svog bloga, morate dodati odgovarajuću kategoriju za njega

Nakon što ste stvorili svoju kategoriju, jednostavno je dodajte u izbornik i već ste u poslu!

Prilagođavanje i beskrajna podešavanja …

U ovom odjeljku pokazat ću neke od osnovnih stvari koje me pitaju cijelo vrijeme koje će vam pomoći da prilagodite svoju web stranicu.

Promjena naslova i slogana

Naslovi stranica objašnjavaju pretraživačima o čemu se radi na vašoj web stranici. Oni su također veliki dio načina na koji tražilice određuju vaše ljestvice. Želite biti sigurni da imaju ključne riječi koje želite ciljati (ali na prirodan način, napisane za stvarne ljude).

Trebali biste koristiti jedinstveni naslov na svakoj stranici svoje web stranice. Na primjer, naslov moje web stranice je "Kako napraviti web stranicu".

(Ne možete ga pronaći? Samo držite miš iznad kartice na vrhu web -preglednika).

Oznake se dodaju na kraju naslova na svakoj stranici. Slogan moje web stranice je "Korak po korak vodič"

Kako biste promijenili naslov i slogan na svojoj web stranici, idite na “Postavke -> Općenito” i ispunite donji obrazac: (Provjerite sliku iznad 3)

Onemogućavanje komentara za postove i stranice

Neke web stranice (uglavnom poslovne ili organizacijske) ne žele da njihovi posjetitelji mogu komentirati njihove stranice.

Evo kako isključiti komentare na WordPress stranicama:

• 1. Dok pišete novu stranicu, kliknite “Opcije zaslona” u gornjem desnom kutu.
• 2. Pritisnite okvir “Diskusija”. Okvir "Dopusti komentare" pojavit će se pri dnu.
• 3. Poništite odabir "Dopusti komentare".

Želite onemogućiti komentare na svakoj novoj stranici prema zadanim postavkama?

1. Idite na “Postavke -> Rasprava” i poništite odabir opcije “Dopusti ljudima da objavljuju komentare na nove članke” (Označite sliku iznad 4)

Postavljanje statičke naslovne stranice:

Neki ljudi mi se obraćaju rekavši da su frustrirani što njihova početna stranica izgleda kao blog. To možete riješiti tako da svoju početnu stranicu učinite "statičnom".

Statička stranica je stranica koja se ne mijenja. Za razliku od bloga, gdje će se prvi novi članak svaki put pojaviti na vrhu, "statična" stranica prikazat će isti sadržaj svaki put kada netko dođe na web mjesto - poput početne stranice koju ste dizajnirali.

Za postavljanje statičke naslovne stranice:

1. Idite na “Postavke -> Čitanje” 2. Odaberite statičku stranicu koju ste stvorili. "Naslovna stranica" označava vašu početnu stranicu. "Stranica s postovima" je naslovna stranica vašeg bloga (ako cijela vaša web stranica nije blog).

Ako sami ne odaberete statičku stranicu, WordPress će uzeti vaše najnovije postove i početi ih prikazivati na vašoj početnoj stranici. (Provjerite sliku iznad 5)

Uređivanje bočne trake:

Većina WordPress tema ima bočnu traku s desne strane (u nekim slučajevima s lijeve strane).

Ako se želite riješiti bočne trake ili urediti stavke koje vam nisu potrebne, poput "Kategorije", "Meta" i "Arhive", koje su obično besmislene, evo kako:

1. Idite na “Izgled -> Widgeti” na nadzornoj ploči WordPressa.

2. Odavde možete pomoću povlačenja i ispuštanja dodati različite "okvire" na svoju bočnu traku ili ukloniti stavke koje ne želite.

Tu je i "HTML okvir" - tekstualni okvir u kojem možete koristiti HTML kôd. Za početnike, ne brinite se oko ovoga - samo povucite i ispustite željene elemente na bočnoj traci.

Instaliranje dodataka za bolje iskorištavanje WordPressa

Što je dodatak? "Dodaci" su proširenja koja su izgrađena kako bi proširila mogućnosti WordPressa, dodajući značajke i funkcije na vaše web mjesto koje nisu ugrađene.

Oni su prečaci do toga da vaša web stranica učini ono što želite, bez potrebe za izgradnjom značajki od nule.

Pomoću dodataka možete učiniti sve, od dodavanja galerija fotografija i obrazaca za slanje do optimizacije vaše web stranice i stvaranja internetske trgovine.

Kako instalirati novi dodatak?

Za početak instaliranja dodataka idite na “Dodaci -> Dodaj nove” i jednostavno započnite pretraživanje.

Imajte na umu da postoji više od 25 000 različitih dodataka, pa imate mnogo toga za izabrati!

Instalacija je jednostavna - nakon što pronađete dodatak koji vam se sviđa, samo kliknite "Instaliraj".

Kako bih vam uštedio vrijeme, sastavio sam popis najpopularnijih dodataka koji webmasterima odgovaraju:

#1 Obrazac za kontakt 7: Moja web stranica ima obrazac za kontakt na mojoj stranici O meni. To je izvrsna značajka jer ljudi (poput vas!) Mogu ispuniti obrazac i poslati mi e -poruku bez prijave u svog davatelja usluga e -pošte. Ako želite učiniti nešto slično, svakako nabavite ovaj dodatak.

#2 Yoast SEO za WordPress: Ako želite svoju WordPress stranicu učiniti još prilagođenijom SEO-u, ovaj dodatak morate imati. Besplatno je i super je. Moći ćete uređivati oznake naslova, meta opise i još mnogo toga, a sve to unutar same stranice - nema više problema s postavkama WordPressa.

#3 Google Analytics: Zanima vas praćenje vaših posjetitelja/prometa i njihovog ponašanja? Samo instalirajte dodatak, povežite ga sa svojim Google računom i spremni ste za rad.

Naravno, ovo je samo vrh ledenog brijega! Evo popisa preporučenih dodataka od mene:

1. Yoast SEO

2. Akismet Anti-Spam

3. WooCommerce

4. TinyMCE Advanced

5. Sigurnost WordFence

6. Google XML karte web stranica

7. WP Super predmemorija

8. Nadzorna ploča Google Analytics za WP prema ExactMetrics

9. UpdraftPlus WordPress dodatak za sigurnosnu kopiju

10. Elementor Page Builder

11. Kompresija i optimizacija mutne slike

I popis se nastavlja.