Kako dodati glavo v WordPress? Uporabite WordPress Customizer ali Cover blok za prilagajanje slike glave

Kako dodati glavo v WordPress? Uporabite WordPress Customizer ali Cover blok za prilagajanje slike glave

Lahko se strinjate z nami, da brez glave ni popolne spletne strani. Ali ste vedeli, da imate na voljo dve različni možnosti za ustvarjanje glave v WordPressu? V tem vodniku bomo razložili posamezne razlike.

Originalna slika glave

Klasično WordPress glavo, kot jo poznate, se uporablja na vseh različnih straneh. Običajno je široko pravokotno polje od strani do strani. V njem so logotip ali ime spletnega mesta, slogan in elementi menija. Vanj lahko vstavite tudi sliko ozadja, ki se imenuje slika glave. Slika glave je odlična za pritegnitev pozornosti obiskovalcev in ustvarjanje splošnega videza in občutka spletnega mesta. Od vas je odvisno, ali boste uporabili diskretno sliko glave ali dominantno sliko, ki bo pozornost obiskovalcev usmerila na navigacijo spletnega mesta.

WordPress header image
Najpogosteje uporabljena vrsta glave - slika glave na vrhu spletnega mesta

Kako urediti glavo v programu WordPress Customizer

Privzeto lahko sliko glave spremenite prek programa WordPress Customizer. Do njega lahko dostopate tako iz upravitelja WordPressa kot iz svoje spletne strani:

  • Neposredno iz upravitelja WP preidite na Videz -> Prilagodi
  • Če ste prijavljeni, v zgornji vrstici kliknite "Prilagodi".

Prilagajalnik vključuje vse osnovne nastavitve videza trenutno aktivne teme. Zato je, kje najdete nastavitve slike glave, odvisno od vaše aktivne teme. V temi Citadela lahko sliko glave dodate in urejate v Prilagajanje spletne strani -> Videz -> Ozadje glave.

Add header via Customizer
Dodajanje glave prek programa Customizer

Nastavitve slike v glavi

Ne glede na to, katero sliko glave izberete, jo lahko konfigurirate po svojih potrebah. Zanimiv učinek lahko dosežete s funkcijo "Ponovitev slike glave". Nastavite lahko naslednje možnosti:

  • Ploščice
  • Vodoravno ploščice
  • Ploščice navpično
  • Brez ponovitve (če ne želite ponoviti slike)
Enabled header image repeat feature
Učinek ploščice v sliki glave

Druge nastavitve v WordPressu - Velikost slike v glavi

Druga možnost za urejanje glave in prilagajanje slike je nastavitev ustrezne velikosti. Velikost slike v glavi ima naslednje tri možnosti:

  • Izvirnik - ohranil bo prvotno velikost slike
  • Pokrov - Velikost naložene slike se bo spremenila, da bo ustrezala od strani do strani, sliko lahko tudi razrežete, da bo ustrezala
  • Vsebuje - velikost slike v glavi bo prilagojena tako, da bo vidna celotna slika.
3 options of header image size
Oglejte si, kako lahko izgledajo različne velikosti glave - izvirna velikost, velikost naslovnice in velikost vsebovati

Prav tako lahko nastavite položaj slike v glavi in določite fiksiranje ozadja.

Pokrovni blok, ki deluje kot glavo

Kot smo že omenili na začetku tega članka, obstaja več načinov urejanja glave v urejevalniku WordPress. Poleg uporabe programa Customizer lahko uporabite tudi enega od osnovnih blokov WordPressa, ki se imenuje blok Cover. Kakšna je torej razlika?

Klasično glavo, ustvarjeno s programom Customizer, se nanaša na celotno spletno mesto, medtem ko blok Cover omogoča dodajanje slike naslovnice, ki v bistvu deluje kot slika glave na katero koli stran ali objavo. Uporabite jo lahko celo večkrat na eni strani ali objavi z različnimi nastavitvami.

Kje uporabiti blok za pokrivanje

V primerjavi s klasičnim glavo spletne strani je naslovni blok širše uporaben na spletni strani. Naslovni blok v vsebino doda široko naslovno sliko po vsej širini. Uporabite ga lahko za vizualno ločevanje vsebine v prispevkih v blogih. Vsak razdelek objave bo dobil svojo sliko naslovnice, ki jo lahko povežete z naslednjo vsebino. Odlična lastnost je, da lahko besedilo napišete neposredno znotraj bloka naslovnice. To besedilo bo prikazano nad sliko.

Cover image as header image in blogpost
Blogpost s sliko v glavi, dodano prek bloka naslovnice

Naslovnica domače strani

Naslovnico lahko uporabite tudi namesto glave spletne strani, če želite doseči izviren videz. Ker blok naslovnice omogoča različne možnosti poravnave, ga lahko nastavite na širino vsebine ali pa na celotno širino. Celotno širino glave lahko uporabite tudi kot veliko sliko ozadja. Vendar ne pozabite na izklop naslova strani v temi Citadela. Ta korak je potreben, če želite blok Naslovnica uporabiti kot glavo spletne strani.

Header as full width background image
Celotna širina glave na domači strani

Kako ustvariti glavo z uporabo bloka Cover

Najprej je treba dodati blok naslovnice. Na katero koli stran ali objavo ga lahko dodate na naslednji način:

Kliknite znak "+" v zgornji vrstici ali znak "+" kjer koli v vsebini. Nato preprosto poiščite naslovni blok.

Add Cover block by clicking on “+“
Dodajanje bloka naslovnice z uporabo "+"

Drug hiter način je dodajanje bloka z uporabo "/", ki sledi imenu bloka.

Using slash to add Cover block
Dodajte poševnico in vnesite naslovni blok za dodajanje tega bloka v območje vsebine

After adding Cover block you’ll get a space to upload image or video. You can also select image from Media library. Selected image or video will be used as header.

Naslov glave

Interesting thing with header added using Cover block is, that you can write text title over the image. This title can be also used as header for section, for example in blog posts. It is also possible to add there any URL.

Title in header image
Title in header image

Poravnava bloka za pokrov

Cover block can be aligned using block toolbar. It can be aligned within content area to the left, right or center. It can be also set as wide or full width. These options have to be supported by active theme that you use to build your website.

Cover block alignment
You can align your Cover block in many ways to achieve the perfect look of your header

Nastavitve slike na naslovnici

Cover image appearance can be modified in Inspector. If you set it as fixed background, image won’t scroll with the rest of the content on your page but it will stay on it’s place all the time.

Using Focal Point Picker you can choose which part of the image will be displayed in the header. You can work with the image even further. For example you can set Overlay color and Background opacity. Both setting will help you put finishing touches to your header. If you use Cover block inside blog post, using correct color scheme and transparency you can add desired atmosphere to your post. Be careful with these settings as title text needs to be clearly visible.

Set color overlay and opacity
By choosing the proper color overlay you can create eye-catching header

Ustvarjanje glave videoposnetka

Cover block can be also used to play video inside your website header. You can catch visitors attention or promote product or service. There are several supported video formats, most common you can use is .mp4.

Great thing is that you can also write title over the video, align it, make it full width or set Color overlay. Settings for Cover block are the same for all media types.

What is your experience with headers? Have you already tried Cover block to create header? Do you prefer classic website header using WordPress customizer? Let us know in the comments below.