Potrebujete zistiť, ako pridať obrázok do textu Elementor ?

Elementor umožnil každému stať sa webdizajnérom bez toho, aby musel mať pokročilé zručnosti v CSS. Jeho vizuálny editor vám umožňuje vytvárať nádhernú webovú stránku bez toho, aby ste museli napísať jediný riadok kódu CSS. Môžete len pridať ľubovoľné požadované dizajnové prvky (widgety) a prispôsobiť ich na paneli nastavení.

Napriek tomu by určité zručnosti CSS boli skvelým bonusom pri používaníElementor. Pomocou tejto funkcie budete môcť na svoju webovú stránku aplikovať jedinečné štýly Vlastné CSS naElementor. V tomto článku vám ukážeme, ako pridať obrázok do textu v Elementore pomocou vlastnej CSS funkcie Elementoru.

V niektorých outils návrhy, ako sú GIMP a Photoshop, zvyčajne musíte pridať značku vrstvy, aby ste pridali obrázok do textu. V Elementore môžete dosiahnuť to isté pridaním kódu CSS, ktorý widget Elementor Title a widget Text nemá možnosť nastavenia pridať obrázok ako pozadie.

Pridajte obrázok k textu Elementor

Skôr ako začnete, uistite sa, že ste inovovali svoju verziu Elementoru na profesionálnu verziu, ak ste to neurobili, pretože vlastná funkcia CSS je k dispozícii iba v Elementor Pro. Keď budete pripravení, vytvorte novú stránku alebo šablónu a upravte ich pomocou aplikácie Elementor. Môžete samozrejme tiež upraviť existujúcu stránku alebo šablónu.

Pozri tiež: Elementor: Ako pridať obsah

Pridajte miniaplikáciu Názov do editačného poľa.

Ako pridať obrázok k textu v Elementore

Prejdite na panel nastavení a nahraďte predvolený text pod kartou Obsah.

Prečítajte si tiež nášho sprievodcu: Elementor: Ako používať nástroj na výber farieb

Prejdite na kartu Štýl na prispôsobenie textu. Môžete nastaviť veľkosť textu, štýl písma atď ... kliknutím na ikonu ceruzky v Možnosť typografie pod blokom Názov. Pretože chcete ako pozadie textu použiť obrázok, nemusíte nastavovať farbu textu.

Potom prejdite na kartu pokročilý a otvor blok zvyk CSS a vložte nasledujúci kód CSS. Vymeňte webovú adresu obrázka za svoju vlastnú webovú adresu.

selector .elementor-heading-title
{
     background: url("https://www.wppagebuilders.com/wp-content/uploads/2020/05/gradient-progress-bar-elementor.jpg") green repeat 30% 70%  ;
     -webkit-background-clip:text;
     -webkit-text-fill-color:transparent;
}

Tu je príklad.

Ako pridať obrázok k textu v Elementore

Získajte teraz prvok Elementor!

záver

Tu je! To je všetko pre tento článok, ktorý ukazuje, ako pridať obrázok do textu v Elementore. Ak máte nejaké obavy, ako sa tam dostať, fdajte nám vedieť v Komentáre.

Môžete sa však tiež poradiť naše zdroje, ak potrebujete viac prvkov na realizáciu svojich projektov tvorby internetových stránok, konzultujte nášho sprievodcu na internete Tvorba blogu WordPress alebo jeden na Divi: najlepšia téma WordPress všetkých čias.

Ale medzičasom zdieľajte tento článok na rôznych sociálnych sieťach.

...