Divi: najbolja WordPress tema svih vremena!

više 901.000 preuzimanja, Divi je najpopularnija WordPress tema na svijetu. Kompletan je, jednostavan za korištenje i dolazi s više od 62 besplatnih predložaka.

Jeste li ikada poželjeli znati kako prikazati tekst iznad slike u Elementoru?

U ovom novom vodiču pokazat ćemo vam kako to učiniti.

Ako nemate pojma o čemu danas želimo razgovarati, pozivamo vas da pogledate sljedeći video:

Vratimo se onda zašto smo ovdje.

Da biste dovršili ovaj vodič, trebat će vam Pro verzija Elementora, jer ćemo koristiti prilagođeni CSS kod koji podržava samo ova verzija Elementora.

Otkrijte i naš vodič o: Kako napraviti galeriju slika pomoću Elementora

Kreirajmo novi odjeljak sa strukturom od 3 stupca, a zatim na ploči definirajmo Visina sur Minimalna visinaa onda Minimalna visina kliknimo na VH i postavite klizač na 100.

odjeljak s 3 stupca

Odaberimo srednji stupac i na kartici Stil, u odjeljku pozadina kliknimo na klasična za Vrsta pozadine, zatim odaberite tamnu boju.

Stavimo u ovu kolonu Widget unutarnjeg odjeljka. Widget Internal Section je prema zadanim postavkama konfiguriran s 2 stupca, izbrišite jedan od njih. Konfigurirajmo ostalo na ploči mijenjajući njegovu Visina sur Minimalna visina i Minimalna visina postavimo kursor na 400.

Pročitajte također: Elementor: Kako zumirati karticu profila

Jednostavno izradite svoju web stranicu s Elementor-om

Elementor vam omogućuje stvaranje Jednostavno i besplatno bilo koje web stranice ili blog dizajn s profesionalnim izgledom. Prestanite plaćati puno za web stranicu koju možete sami napraviti.

Zatim, dalje Vertikalno poravnanje birajmo milje.

Zatim ispustite Widget naslova u unutarnji presjek unesite kao Naslovna fotografija, a na Alignment odaberite Odaberi Centar.

prikaz teksta iznad slike pomoću Elementora

U kartici Stil izmijenimo boju naslova tako da bude vidljiva ako nije,

Ispustimo a Widget za uređivač teksta ispod Widget naslova. Zatim, u kartici Stil, na Poravnanje odaberite Centar. Promijenimo i boju teksta tako da bude vidljiv.

Vidi također: Elementor: Kako dodati razdjelnik za stvaranje odjeljka

Odaberimo srednji stupac i u svojoj kartici Stil, poništite boju pozadine i zatim učitajte sliku Položaj birajmo Centrirano Centrirano, ponoviti sur Bez ponavljanja, Pokriti sur Veličina.

prikaz teksta iznad slike pomoću Elementora

U odjeljku granica izmijenimo sve granični radijusi od 12, U kutija sjena, postavite klizač na 0 za Vodoravan, Za 0 za okomito, do 40 na Blur, do -10 na emitiranju. Ispod svoje slike trebali biste vidjeti prekrasan efekt sjene.

prikaz teksta iznad slike pomoću Elementora

na Preklapanje pozadine, Izaberi klasična za Vrsta pozadine i boja Izaberi jedan Crna boja, na Opacity, postavimo klizač na 0.55

U kartici napredan, uđimo 20 za sve marže.

Odaberimo naše Unutarnji dio i idite na njegovu karticu napredan u odjeljku Custom CSS kopirajte i zalijepite sljedeći isječak koda:

/*Afficher ou masquer un contenu au survol*/
selector{
    opacity: 0;
    transition: 0.5s ease-in-out;
}
selector:hover{
    opacity: 1;
}
prikaz teksta iznad slike pomoću Elementora

(Ako nemate ovaj odjeljak, onda nemate Pro verziju, ako želite nastaviti trebate nadograditi svoju verziju).

Odaberimo još jednom srednji stupac našeg odjeljka, na njegovoj kartici Stil, te u odjeljku Preklapanje pozadine, provjerite jesmo li na kartici NORMALNA, spustimo Neprozirnost à 0.

Zatim kliknite na karticu PREGLED, zatim uključi klasična za vrsta pozadine i boja, odaberite a tamne boje, ondaNeprozirnost sur 0.55, i za Trajanje prijelaza postavimo klizač na 0.5.

Evo konačnog rezultata naše manipulacije.

prikaz teksta iznad slike pomoću Elementora

Duplicirajmo naš stupac 2 puta i izbrišemo ostala 2 prazna stupca. Ostaje samo promijeniti sliku pozadine kao i sadržaj uređivača teksta 2 nova stupca.

prikaz teksta iznad slike pomoću Elementora

Pregledajte svoj rad na tabletu i pametnom telefonu da vidite kako izgleda. Zatim ga spremite ili ažurirajte.

Ovdje. Upravo ste prikazali tekst iznad slike pomoću Elementora za izgradnju stranica.

Nabavite Elementor Pro odmah!

Zaključak

Dakle ! To je to za ovaj članak koji vam pokazuje kako prikazati tekst iznad slike. 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.

...

0 dionice
udio
cvrkut
Prijaviti