A keni dashur ndonjëherë të dini se si të shfaqni tekstin mbi një imazh me Elementor ?

Në këtë tutorial të ri, ne do t'ju tregojmë se si ta bëni atë.

Nëse nuk e keni idenë se për çfarë duam të flasim sot, ju ftojmë të shikoni videon e mëposhtme:

Atëherë le të kthehemi te pse jemi këtu.

Për të përfunduar këtë tutorial, do t'ju duhet versioni Pro i Elementor, sepse ne do të përdorim kodin e personalizuar CSS i cili mbështetet vetëm nga ky version iElementor.

Zbuloni gjithashtu udhëzuesin tonë për: Si të krijoni një galeri imazhesh me Elementor

Le të krijojmë një seksion të ri me një strukturë me 3 kolona, ​​më pas në panel, le të përcaktojmë Lartësia sur Lartësia minimale, pastaj në Lartësia minimale le të klikojmë VH dhe vendoseni rrëshqitësin në 100.

Seksioni me 3 kolona

Le të zgjedhim kolonën e mesme, dhe në skedën Stili, në pjesën sfond le të klikojmë klasik për Lloji i sfondit, më pas zgjidhni një ngjyrë të errët.

Le të vendosim në këtë kolonë Widget i seksionit të brendshëm. Miniaplikacioni i Seksionit të Brendshëm është konfiguruar si parazgjedhje me 2 kolona, ​​le të fshijmë njërën prej tyre. Le të konfigurojmë pjesën tjetër në panel duke e modifikuar atë Lartësia sur Lartësia minimale dhe Lartësia minimale le ta vendosim kursorin në 400.

Lexo gjithashtu: Elementor: Si të zmadhoni një kartë profili

Pastaj, në Rreshtimi vertikal le të zgjedhim Mjedis.

Më pas hidhni Miniaplikacioni i titullitseksion i brendshëm le të futemi si Fotografi Titulli, dhe në Alignment, le të zgjedhim Qendra.

shfaqni tekstin mbi një imazh me Elementor

Në skedë Stili le të modifikojmë ngjyrën e titullit në mënyrë që të jetë e dukshme nëse nuk është,

Le të hedhim një Miniaplikacioni i Redaktuesit të Tekstit poshtë Miniaplikacioni i titullit. Pastaj, në skedën Stili, në Alignment zgjidhni Qendra. Le të ndryshojmë edhe ngjyrën e tekstit në mënyrë që ai të jetë i dukshëm.

Shiko gjithashtu: Elementor: Si të shtoni një ndarës për të krijuar një seksion

Le të zgjedhim kolona e mesme dhe në skedën e saj Stili, rivendosni ngjyrën e sfondit dhe ngarkoni një imazh, më pas pozitë le të zgjedhim Përqendruar në qendër, përsëritje sur Të pa përsëritur, Mbulesë sur Madhësi.

shfaqni tekstin mbi një imazh me Elementor

Në seksionin kufi le t'i modifikojmë të gjitha rrezet kufitare nga 12. Në hije kuti, vendosni rrëshqitësin në 0 për Horizontal, À 0 për Vertikale, për të 40 në Blur, për të -10 në transmetim. Ju duhet të shihni një efekt të bukur hije nën imazhin tuaj.

shfaqni tekstin mbi një imazh me Elementor

Për Mbivendosja e sfondit, zgjidhni klasik për Lloji i sfondit dhe couleur Zgjidh nje Ngjyra e zezë, në Opacity, le ta vendosim rrëshqitësin në 0.55

Në skedë i përparuar, le të kapim 20 për të gjitha Marzhet.

Le të zgjedhim tonën Seksioni i brendshëm dhe shkoni te skeda e tij i përparuar në seksionin e personalizuar CSS, kopjoni dhe ngjisni fragmentin e mëposhtëm të kodit:

/*Afficher ou masquer un contenu au survol*/
selector{
    opacity: 0;
    transition: 0.5s ease-in-out;
}
selector:hover{
    opacity: 1;
}
shfaqni tekstin mbi një imazh me Elementor

(Nëse nuk e keni këtë seksion, atëherë nuk keni versionin Pro, nëse dëshironi të vazhdoni, duhet të përmirësoni versionin tuaj).

Le të zgjedhim edhe një herë kolonën e mesme të seksionit tonë, në skedën e saj Stili, dhe në seksionin Mbivendosja e sfondit, kontrolloni që jemi në skedën NORMAL, le të ulim Opaciteti à 0.

Pastaj klikoni në skedën PVIRMBLEDHJE, pastaj në klasik për lloji i sfondit dhe couleur, zgjidhni një ngjyrë të errët, pastajErrësirë sur 0.55, dhe për Kohëzgjatja e tranzicionit le ta vendosim rrëshqitësin në 0.5.

Këtu është rezultati përfundimtar i manipulimit tonë.

shfaqni tekstin mbi një imazh me Elementor

Le të dublikojmë kolonën tonë 2 herë dhe të fshijmë 2 kolonat e tjera boshe. Gjithçka që mbetet është të ndryshojmë imazhin e sfondit si dhe përmbajtje redaktorët e tekstit për 2 kolonat e reja.

shfaqni tekstin mbi një imazh me Elementor

Shikoni paraprakisht punën tuaj në tablet dhe smartfon për të parë se si duket. Pastaj ruajeni ose përditësoni atë.

Kështu që. Sapo keni shfaqur një tekst mbi një imazh me Faqja Builder Elementor.

Merrni Elementor Pro Tani!

Përfundim

Kështu që ! Kjo është ajo për këtë artikull që ju tregon se si të shfaqni tekstin mbi një imazh. Nëse keni ndonjë shqetësim se si të arrini atje, na tregoni brenda komente.

Sidoqoftë, gjithashtu mund të këshilloheni burimet tona, nëse keni nevojë për më shumë elemente për të realizuar projektet tuaja të krijimit të faqeve në Internet, duke u konsultuar me udhëzuesin tonë për Krijimi i blogut të WordPress ose atë më Divi: tema më e mirë e WordPress të të gjitha kohërave.

Por në ndërkohë, ndajeni këtë artikull në rrjetet tuaja të ndryshme sociale.

...