Želite li saznati kako prilagoditi WordPress temu pomoću Elementor dodatak ?

Prilagođavanje vaše WordPress teme jedan je od glavnih zadataka pri izradi WordPress web stranica. Budući da ona kontrolira dizajn web stranice, ovo je mjesto na kojem mnogi profesionalci provode većinu svog vremena.

Stvaranje prilagođene WordPress teme obično uključuje rad s datotekama tema i uređivačem koda. Promjene izgleda odvijaju se u datotekama predložaka, promjene dizajna putem CSS-a. Također ćete morati neprestano osvježavati prozor preglednika kako biste pokazali svoje prilagodbe, što može biti prilično nezgrapno.

Srećom, s Elementor, ovaj postupak postaje izuzetno lak, pa biste ga mogli provjeriti.

Ali prije, otkrijmo zajedno Kako instalirati 7 korake WordPress blog et Kako pronaći, instalirati i aktivirati WordPress temu na svoj blog.

Zatim, natrag zašto smo ovdje.

Što je WordPress tema

WordPress tema je u osnovi kolekcija predložaka koji definiraju vizualni izgled WordPress web stranice.

WordPress tema obuhvaća sve što utječe na dizajn web stranice, od zaglavlja i podnožja do sheme boja, izgleda i više.

Dostupno je mnogo tema, besplatnih i premium, koje odgovaraju gotovo svakoj industriji web stranice za fotografije, web stranice teretanog kluba, web stranice frizerskog salona, web stranice zakona, i još mnogo toga.

Zašto prilagoditi WordPress temu?

Jedan od glavnih razloga za izradu web stranice je promoviranje vašeg poslovanja. Ima li boljeg načina za to nego da stvoriti web stranicu unikat koji promovira stil i dizajn tvrtke.

Možete li zamisliti da su Amazon, eBay ili Google takvi kakvi jesu bez svog jedinstvenog dizajna?

Naravno da ne, i to je jedan od razloga što želimo prilagoditi WordPress temu. Želimo je učiniti jedinstvenom i prilagoditi se poruci naše tvrtke.

Također, ponekad, ili bolje rečeno, često naiđete na WordPress temu koju muči loš dizajn, boje koje ne idu dobro zajedno ili neku temu koja je preteška i utječe samo na rad web mjesta. mreža. WordPress tema mogla bi biti moćna osim one stvari koja vas muči. Prilagodite ga i promjena ove stvari mogla bi riješiti sve vaše probleme i stvoriti bolje korisničko iskustvo.

Kako prilagoditi WordPress temu

Postoji nekoliko metoda za prilagodbu teme WordPressa.

  1. Ručno, putem WordPress alata za prilagodbu
  2. S kodom
  3. S Elementor

Kako ručno prilagoditi WordPress temu

Možete prilagoditi WordPress temu po svom izboru putem ugrađenog WordPress Customizatora. Ako to radite bez koda, često ste ograničeni u onome što možete promijeniti. Neki WordPress teme premium vam omogućuje više mogućnosti prilagodbe, ali u biti nema puno mogućnosti dizajna za vas.

Prije nego što uđemo dublje u ovo područje, željeli bismo napomenuti da je, kada prilagodite postojeću WordPress temu, najbolje da koristite dječja tema, a ne roditeljska tema.

WordPress dječja tema

Dječja tema je WordPress tema koja ima potpuno iste funkcije i karakteristike druge WordPress teme, roditeljske teme. Dječja tema upotrebljava se za sigurno prilagođavanje i izmjenu teme, bez utjecaja na roditeljsku temu i bez gubitka mogućnosti ažuriranja. 

Prilagoditelj teme WordPress

Dakle, sada kada znamo da je najbolje raditi s podređenom temom, naučimo kako prilagoditi temu pomoću programa WordPress Customizer. Da biste mu pristupili, idite na svoju nadzornu ploču i kliknite na Apparence na lijevoj strani i odaberite Personalizacija.

Glavne značajke koje možete izmijeniti ovim prilagoditeljem su sljedeće:

Dodavanje naslova, logotipa i ikone web stranice

Da biste dodali ili promijenili naslov, logotip ili ikonu, jednostavno možete otići na ploču identiteta web mjesta. i odaberite svaki od ovih elemenata da biste ih izmijenili.

Promjena boja WordPress teme

neki WordPress teme će vam omogućiti da promijenite njihove sheme boja, ali ne sve, a obično jesu WordPress teme premija. Ako vam vaša WordPress tema dopušta promjenu sheme boja, vidjet ćete ovu opciju kada pristupite alatu za prilagodbu.

Dodani navigacijski izbornici

Customizer vam također omogućuje jednostavno dodavanje i izmjenu navigacijskih izbornika na vašim web lokacijama.

Kako prilagoditi WordPress temu s kodom

Primijetit ćete da na kartici Izgled imate mogućnost odabira uređivača teme. Klikom na nju dočekat će vas prozor s kodom teme. Ova opcija zahtijeva dobro razumijevanje CSS kodiranja i ne preporučuje se početnicima.

Ovdje ćete imati pristup datotekama poput style.css, function.php, a to je upravo scenario za koji vam je potrebna podređena tema kako ne biste pokvarili web mjesto.

Drugi način prilagodbe svoje teme kodiranjem je prijenos datoteka pomoću FTP rješenja. Proces uključuje izradu FTP vjerodajnica putem vašeg davatelja hostinga, preuzimanje i instaliranje FTP rješenja (poput FileZilla), prijavljivanje na račun i uređivanje datoteka koje ćete potom prenositi putem istog. FTP rješenje.

Otkrijte naš vodič o Kako instalirati WordPress s FileZilla

Ako ne znate kodiranje, ne preporučujemo ovu opciju.

Prilagodite WordPress temu jednostavno pomoću Elementor

To možete učiniti izravno s korisničkog sučelja. Nema potrebe za promjenom jednog retka koda ili ponovnim učitavanjem prozora preglednika, čak ni jednom.

Elementor vam omogućuje brzo i jednostavno mijenjanje svakog elementa web stranice s nekoliko klikova mišem, a ove mogućnosti možete čak i optimizirati za mobilnu platformu.

Elementor znatno olakšava ovaj postupak pomoću dinamičnog sadržaja i omogućava pregled vaših stranica. Na ovaj način odmah možete vidjeti kako će promjene dizajna utjecati na vašu stvarnu web stranicu i sadržaj.

Prilagodite zaglavlje i podnožje

Elementor vam omogućuje potpunu fleksibilnost kada je u pitanju oblikovanje zaglavlja i podnožja. Svi znamo koliko to može biti dosadno da imate WordPress temu i ne možete promijeniti niti jedan aspekt dizajna zaglavlja ili podnožja Potrebne su vam specijalizirane teme, dodaci itd.

S Elementorom je lako.

1. Napravite predložak zaglavlja

Prvo konfigurirajte novi predložak zaglavlja. Da biste to učinili, idite na Elementor> Moji predlošci.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 1

Ovdje je jedan način za početak pritisnuti gumb Dodaj novo na vrhu. Na sljedećem zaslonu pomoću padajućeg izbornika odaberite Zaglavlje kao vrstu predloška za dizajn.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 2

Do ovog zaslona možete doći i klikom na karticu Zaglavlje s prethodnog zaslona, ​​a zatim pritiskom velikog zelenog gumba koji se pojavi.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 3
Prethodno će odabrati zaglavlje kao vrstu predloška. Bilo kako bilo, trebate dodati odgovarajući naziv predloška (kako biste znali što je kasnije), a zatim nastaviti klikom na Stvori predložak.

Dovest će vas ovdje.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 4

S Elementor Pro možete birati između unaprijed dizajniranih blokova zaglavlja. Ovo su predloške dizajna koje možete koristiti kao polazište za vlastiti dizajn, što ćemo učiniti u ovom slučaju.

Kada pokažite pokazivač iznad bloka zaglavlja, kliknite umetak omogućuje vam da odmah počnete dizajnirati. U suprotnom, prvo kliknite sliku da biste vidjeli veću verziju. Tada uvijek možete pritisnuti umetak na vrhu.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 5

U suprotnom, ako želite početi od nule, samo zatvorite prozor klikom X u gornjem desnom kutu.

2. Promijenite osnovni dizajn zaglavlja

Nakon unosa novog zaglavlja, prvo što ćete primijetiti je da su logo i izbornik koji smo ranije konfigurirali već tamo.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 6

To je upravo razlog zašto ih sastavljamo i razgovarat ćemo o tome kako ih prilagoditi. Međutim, prvo da vidimo kako prilagoditi sam odjeljak zaglavlja.

Da biste to učinili, samo zadržite pokazivač miša iznad njega i kliknite gumb za uređivanje na vrhu. Ovo otvara popis opcija za uređivanje na lijevoj strani.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 7

Evo što možete kontrolirati u različitim izbornicima:

  • Raspored - Kontrolirajte širinu odjeljka, veličinu razmaka između stupaca, njegovu visinu, vertikalno pozicioniranje stupca i sadržaja, dodijeljenu HTML oznaku i opću strukturu.
  • Stil - Ovdje možete promijeniti boju pozadine uključujući i lebdeći efektijoš dodajte sliku ili video ako želite, dodajte efekte preklapanja, obruba i razdjelnika, kao i promijenite postavke tipografije.
  • avanced - Ovaj dio vam omogućuje dodavanje CSS atributa poput margine i z indeksa, animacija, ID-ova i klasa. Također vam omogućuje da sekcija učinite ljepljivom i kontrolirate postavke kao i da ih dodate Prilagođeni CSS.

Sve gore navedeno prilično je razumljivo i brzo ćete dobiti ono što želite.

3. Prilagodite elemente zaglavlja

Međutim, ne možete samo uređivati ​​odjeljak zaglavlja u cjelini, već i stavke u njemu. Na primjer, za prilagodbu logotipa web stranice, samo kliknite na njega. Ovo će vam također pružiti mogućnosti uređivanja na lijevoj strani.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 8
U slučaju logotipa, to vam daje sljedeće mogućnosti:

  • Sadržaj - Promijenite veličinu slike, poravnanje i mjesto na koje je povezana.
  • Stil - Kontrolirajte širinu i visinu, dodajte CSS efekte i lebdeće efekte, dodajte obrub i sjenu ako želite.
  • avanced - Ovdje ćete naći u osnovi iste opcije kao i za odjeljak zaglavlja.

Pomoću postavki prilagodite logotip onako kako želite da se dobro prikazuje u zaglavlju. Također imajte na umu da svaka stavka ima svoju vrstu opcija, stoga svakako provjerite svaku.

4. Dodajte stavke

Naravno, uz Elementor možete dodavati i stavke u zaglavlje. Samo kliknite simbol u gornjem desnom kutu da biste vidjeli što je na raspolaganju.

prilagodite WordPress temu s dodatkom Elementor.
Prilikom uređivanja predloška zaglavlja, Elementor automatski prikazuje relevantne blokove na vrhu popisa, što ima najviše smisla u datim okolnostima. U ovom slučaju to su stvari poput logotipa web stranice, nav izbornika i naslova web stranice.

Tako, na primjer, ako želite dodati naslov web lokacije pored logotipa, samo je povucite i ispustite na nju. Međutim, predložak zaglavlja koji smo trenutno odabrali omogućava nam dodavanje iznad ili ispod logotipa. Ali, to je problem koji će se lako riješiti.

U ovakvom slučaju, zadržite pokazivač iznad zaglavlja i koristite simbol plus -+-dodati gornji odjeljak.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 10

Kliknite ovdje na ljubičasti gumb kako biste odabrali dizajn s tri stupaca.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 11

Zatim elemente iz postojećeg zaglavlja povucite u novi odjeljak i dodajte naslov web stranice.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 12

Ali čekaj, stil je potpuno drugačiji! nema problema. Samo desnom tipkom miša kliknite postojeće zaglavlje i odaberite Kopirati. Zatim desnom tipkom miša kliknite novi odjeljak i kliknite ovdje na Slog lijepljenja. Elementor će tada primijeniti stil postojećeg odjeljka koji kasnije možete zatvoriti. 

Kako prilagoditi element WordPress teme ili predložak zaglavlja 13

Možete izvršiti isti postupak s bilo kojim drugim elementima zaglavlja i, naravno, sa svim ostalim elementima koji su uključeni u Elementor.

Prilagodite jedinstveni predložak posta

U Elementoru također možete prilagoditi jedan predložak posta. Evo kako :

1. Stvorite novi model

Stvaranje predloška djeluje na uobičajen način. Međutim, ovaj put birajte jedan kao tip modela. Zatim u nastavku odaberite jedinstveni predložak koji želite urediti. U ovom primjeru pošta.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 14

Ako želite stvoriti novi dizajn stranice, uredite svoju 404 stranicu (detaljnije o tome kasnije) ili uredite prilagođena vrsta posta odabrali biste nešto drugo. U oba slučaja unesite ime i nastavite.

Na sljedećem zaslonu možete odabrati uobičajene predloške kao i obično. Međutim, u ovom slučaju želimo stvoriti novi model ispočetka. Zato kliknite X u gornjem desnom kutu da biste zatvorili ovaj prozor.

2. Konfigurirajte pregled

Zatim postavite prozor za pregled na postojeći post. To možete učiniti klikom na ikonu oka na dnu mogućnosti uređivača, a zatim Postavke.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 15

U izborniku koji se otvori ispod pregled dinamički sadržaj, odaberite Objaviti. Nakon toga u sljedećem retku možete pretraživati ​​i odabrati postojeći post prema nazivu.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 16Nakon što to učinite, dodirnite primijeniti & pregled, Iako u ovom trenutku nećete moći vidjeti ništa (jer na stranici nema ničega), Elementor će navesti da od sada koristi podatke u ovom postu. Uskoro ćete vidjeti što to znači.

3. Napravimo odjeljak iznad 

Prvo ćemo stvoriti gornji odjeljak. Ovdje ćete obično pronaći stvari poput naslova posta i metapodataka poput autora, datuma i kategorije.

Prvi korak je klik na znak + i stvaranje jednog odjeljka stupca.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 17
Kada to učinite, u odjeljku izgleda imate mogućnost upravljanja njegovom širinom, visinom, pozicioniranjem i stilom. U ovom slučaju ovdje nema puno posla. Također, ne brinite, uvijek se možete vratiti kasnije i unositi promjene.

Zatim povucite widget naslov posta u novi odjeljak.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 18

Kad to učinite, obavezno upotrijebite sve dostupne mogućnosti za prilagođavanje dizajna i izgleda vašem izboru. Na primjer, evo mojih postavki za to:

Kako prilagoditi element WordPress teme ili predložak zaglavlja 19

Tu je i zgodna značajka koju biste trebali naučiti. Kada kliknete simbol ključa naslova posta, možete dodati statički sadržaj prije i nakon dinamičkih podataka.

Na primjer, ako stvorite predložak za određenu kategoriju postova, poput vijesti ili recepata, možete je dodati u naslov posta ovako:

Kako prilagoditi element WordPress teme ili predložak zaglavlja 20

Na taj bi se način podaci prikazali za svaki post u toj kategoriji. U ovom trenutku to neću koristiti, ali mislio sam da je to važna strana za vas.

Pod naslov posta ćemo umetnuti pošta Informacija widget da biste vidjeli metapodatke posta.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 21

Evo postavki koje koristim:

Kako prilagoditi element WordPress teme ili predložak zaglavlja 22

Pored toga, koristio sam mogućnosti stiliranja kako bih dizajn prilagodio ostatku stranice. Obavezno napravite isto.

4. Namjestite tijelo posta

Nakon zaglavlja, vrijeme je da izradite tijelo stranice. Ako želite da ovaj dio ima drugačiji dizajn od zaglavlja, morat ćete postaviti novi odjeljak. Međutim, držim to jednostavno, pa ne moram.

Prvo što želimo umetnuti je istaknuta slika. Za to možete postaviti istoimeni widget ispod onoga što je već na stranici.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 23

U osnovi nisam promijenio nijednu postavku, već sam ostavio sve kako jest.

Tada je vrijeme da sadržaj objavi. I ovdje imate odgovarajući blok.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 24
Primijetit ćete da Elementor za istaknuti sadržaj slike i posta objavljuje automatski ono što je već na web mjestu. Prilagodite dizajn novog bloka koji vam je potreban, na primjer igrajući se s tipografskim postavkama.

Osim toga, to je sve. Ovdje nema previše posla da bismo mogli prijeći na zadnji dio.

5. Konfigurirajte podnožje

U ovom slučaju želimo da podnožje prikazuje profil autora, opcije dijeljenja i komentare čitatelja. Da bismo to učinili, prije svega, moramo stvoriti novi odjeljak s dva stupca. Da biste stvorili više prostora za profil autora, možete ga postaviti na izgled 66.33.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 25

Nakon toga stavite widget Kutija autora u lijevom dijelu.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 26

Obavezno prilagodite stil prema vašim potrebama. Dodao sam malo pozadinske boje i malo prilagodio postavke tipografije.

Nakon toga, vrijeme je da dodate blok za dijeljenje gumba s desne strane.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 27

Moje postavke možete vidjeti na gornjoj snimci zaslona.

Nakon toga, preostalo je samo stvoriti odjeljak još jedan stupac dolje i povući u njega widget Post Comments.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 28

(Usput, ako ikada imate problema s lociranjem bilo kojeg od ovih widgeta, samo koristite značajku pretraživanja).

Kako prilagoditi element WordPress teme ili predložak zaglavlja 29

Prilagodite odjeljak za komentare koji smatrate potrebnim (ostavio sam ga onakvim kakav je) i spremni ste za objavu. Evo gotovog dizajna:

Kako prilagoditi element WordPress teme ili predložak zaglavlja 30

Prilagodite predložak arhive

1. Konfigurirajte svoj predložak arhive WordPress

Rješenje za stvaranje novih modela već znate. Jedina je razlika što ćete u ovom slučaju izabrati Arhiva kao tip modela.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 31

Nakon toga, kao i obično, dobivate određeni broj blokova za izbor ili također možete kreirati od početka svoj vlastiti model. Međutim, za arhive imate otprilike samo dva dodaci Elementor koji su ionako važni.

2. Odredite naslov arhive

Prvi blok o kojem želim razgovarati je naslov arhive Naslov arhive.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 32

Pored uobičajenih postavki pod Stil i napredni, možete naći važnu opciju kada kliknete na simbol ključa ispod Titula.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 33

Ovdje možete omogućiti i onemogućiti prikazuje li Elementor vrstu arhive na stranici poput dijela u kojem piše Autor: ispod. To se događa putem gumba ispod Uključi kontekst

Usput, kao i obično, možete pregledati različite arhive pomoću postavki pregleda (Simbol oka> Postavke). Na ovaj način možete vidjeti dizajn jedinstvenih kategorija, oznaka, autora i još mnogo toga. Imajte to na umu.

3. Koristite blok arhivskih publikacija

Drugi važan widget za arhive su Archive Posts. Ovo donosi sve postove koji pripadaju bilo kojoj arhivi na jednoj stranici. Kad odaberete predložak, oni su već tamo, ali možete ih i sami dodati pomoću ovog bloka.

Kako prilagoditi element WordPress teme ili predložak zaglavlja 34

Pogledajmo mogućnosti koje vam pružaju za prilagođavanje vaših arhivskih stranica:

  • Koža - Odaberite prikazivanje svojih postova u klasičnom dizajnu ili u stilu karata.
  • Kolumne - Određuje broj stupaca u kojima su prikazani vaši postovi.
  • Prikaži sliku - Aktivirajte istaknute slike na arhivskim stranicama
  • Zidarstvo – Prikazuje stavke u zidnom dizajnu ili ne.
  • Veličina slike - Veličina slike koju bi Elementor trebao koristiti na arhivskim stranicama.
  • Označite - Želite li prikazati naslove postova ili ne?
  • Naslov HTML oznaka - Ako je tako, koja se HTML oznaka treba omotati oko nje?
  • Izvod - Uključite izvatke iz svojih postova ili prikažite samo naslov.
  • Duljina odlomka - Odredite duljinu ekstrakata.
  • Metadata - Definira metapodatke posta dostupne posjetiteljima.
  • Odvajač Između - Simbol za odvajanje između informacija metapodataka.
  • opširnije - Uključiti vezu "pročitaj više", da ili ne?
  • Oznaku - Omogućuje vam dodavanje više informacija u postove, poput kategorija i oznaka.
  • Značka taksonomije - Ovdje možete odlučiti koje ćete podatke uključiti.
  • Avatar – Time možete promijeniti profilnu sliku autora članaka

Pored gore navedenog, imate još nekoliko mogućnosti. Pod, ispod paging, možete definirati kako bi se trebalo baviti arhivom stranica. Na primjer, kako to prikazati, broj stranica koje treba uključiti i poravnanje teksta.

U svakom slučaju, napredan omogućuje vam da postavite da se poruka prikazuje kada posjetitelj dođe na praznu arhivu. Sve ostalo bi trebalo biti poznato. Samo imajte na umu da se opcije stila mijenjaju ovisno o koži koju ste odabrali.

4. Kontrolirajte broj publikacija po arhivi

Brza napomena o predlozima arhiva. Da biste promijenili broj postova koji se pojavljuju u arhivi (ili na vašoj stranici bloga), to trebate učiniti u WordPressu pod Postavke> Čitanje. 

Kako prilagoditi element WordPress teme ili predložak zaglavlja 35

Ovdje samo unesite broj postova koje želite posjetitelji vidjeti.

personalizacija lak WordPress tema s elementom Elementor

Prilagodba WordPress tema je kruh i maslac mnogih profesionalaca. Iako to obično uključuje puno kodiranja i uređivanja datoteka, s Elementorom to više nije potrebno.

Kao što ste vidjeli gore, dodatak je punopravni uređivač tema WordPressa. Omogućuje vam prilagođavanje svakog njegovog dijela iz korisničkog sučelja. Možete urediti zaglavlje web stranice, podnožje, predloške stranica i posta, predloške arhiva i još mnogo toga.

Uz mogućnost korištenja dinamičkog sadržaja i pregledavanja bilo kojeg dijela vaše web stranice, možete implementirati sve moderne prilagodbe

Ukratko, Elementor olakšava prilagodbu vaše WordPress teme. Umjesto da mukotrpno unesete promjene s desecima datoteka i stotinama redaka koda, brzo to možete učiniti na jednom mjestu.

Nabavite Elementor Pro odmah!

Zaključak

Tu je ! To je to za ovaj članak koji vam pokazuje kako prilagoditi WordPress temu pomoću Page Builder Elementor. Ako imate bilo kakvih nedoumica oko toga kako doći do tamo, javite nam unutar Komentari.

Međutim, možete se konzultirati naši resursi, ako vam treba više elemenata za provođenje projekata kreiranja internetskih stranica, savjetujući se s našim vodičem na internetu Izrada bloga WordPress ili onaj koji je uključen Divi: najbolja WordPress tema svih vremena.

Ali u međuvremenu, ovaj članak podijelite na svojim različitim društvenim mrežama.

...