Chcete vytvořit vícebarevné tlačítko přechodu v Elementor ?

Ve výchozím nastavení Elementor má funkci pro vytvoření přechodové barvy pro vaše tlačítko, ale je omezena pouze na dvě barvy. Tento článek vám ukáže, jak vytvořit tlačítko s vícebarevným přechodem Elementor bez pomoci doplňku, jen pomocí vlastního CSS Elementoru.

Přidáním vícebarevného přechodu k tlačítku může tlačítko vypadat atraktivně a působit přirozeně. Možná se ptáte: „Je možné na svém vytvořit vícebarevné tlačítko přechodu webové stránky? “. S Elementorem je možné všechno a snadno vytvoříte vícebarevné přechodové tlačítko.

vytvořit tlačítko vícebarevného přechodu v Elementor

Jak vytvořit vícebarevné tlačítko přechodu v Elementoru

Před zahájením výukového programu vás chceme informovat, že tento výukový program bude pracovat s vlastními CSS. Vlastní funkce CSS je k dispozici pouze na Elementor Pro; takže nezapomeňte upgradovat na profesionální verzi.

Nyní přejděte do svého editoru Elementor. Začneme od začátku, takže vytvořte sekci pouze s jedním sloupcem. Dále vyberte widget tlačítka na panelu widgetů a poté jej přetáhněte do editační oblasti Elementoru. Po přidání widgetu tlačítka můžete widget upravit a upravit podle svých preferencí.

vytvořit tlačítko vícebarevného přechodu v Elementor

V nastavení widgetu přejděte na kartu pokročilý -> Vlastní CSS. Zkopírujte níže uvedený fragment CSS a vložte jej do vlastního pole CSS.

selector .elementor-button {
  background: linear-gradient(121.28deg, #A4006C 0%, #FFECA8 100%), linear-gradient(121.28deg, #69003F 0%, #FFF8F8 100%), linear-gradient(238.72deg, #00FFFF 0%, #0212A4 100%), radial-gradient(67.16% 100% at 50% 0%, #FF00B8 0%, #FFFFFF 100%), linear-gradient(140.54deg, #7000FF 0%, #001AFF 72.37%), linear-gradient(307.43deg, #FFE927 0%, #00114D 100%), radial-gradient(107% 142.8% at 15.71% 104.5%, #FFFFFF 0%, #A7AA00 100%), #FFFFFF;
background-blend-mode: overlay, difference, difference, overlay, difference, difference, difference, normal;
}
vytvořit tlačítko vícebarevného přechodu v Elementor

Pokud jste spokojeni s vícebarevným přechodem, který byl použit (jako na obrázku výše), můžete jej ponechat a uložit svůj projekt, pokud si přejete. Pokud jej však chcete přizpůsobit, můžete tak učinit úpravou úryvku CSS konkrétněji v bloku deklarace CSS.

Blok deklarace CSS začíná otevírací složenou závorkou ( {'' ) a končí pravou závorkou (''} ).

Chcete-li získat blok deklarace, můžete vytvořit přechod pomocí nářadí online gradient css. klikněte zde vidět nějaké nářadí gradientu CSS. Po vytvoření přechodu zkopírujte CSS a nahraďte stávající deklarační blok novým vložením CSS.

vytvořit tlačítko vícebarevného přechodu v Elementor

Poznámka: Můžete také vytvořte titulek přechodu v Elementoru .

Získejte Elementor Pro nyní!!!

Proč investovat do čističky vzduchu?

Tento článek ukazuje, jak snadno můžete v Elementoru vytvořit tlačítko s vícebarevným přechodem. Pokud používáte Elementor jako tvůrce stránek pro vaše webové stránky WordPress a chcete vytvořit úžasné tlačítko s vícebarevným přechodem, tento článek by mohl být vaším řešením.

Jednobarevné nebo dvoubarevné knoflíky mohou vypadat jednoduše a nudně. Dejte si ale pozor na vytváření vícebarevných přechodů na tlačítkách. Věnujte prosím pozornost tónu a barevnému mixu, který používáte, aby vaše tlačítka nevypadala divně a nudně.

Tady ! To je pro tento článek, který vám ukáže, jak vytvořit tlačítko vícebarevného přechodu v Elementor. Pokud máte nějaké obavy, jak se tam dostat, dejte nám vědět commentaires.

Můžete však také konzultovat naše zdroje, pokud potřebujete více prvků k realizaci vašich projektů vytváření internetových stránek, nahlédněte do našeho průvodce na internetu Vytvoření blogu WordPress nebo ten, který je zapnutý Divi: nejlepší téma WordPress všech dob.

Mezitím sdílejte tento článek na různých sociálních sítích.

...