Hur man ställer in en storlek för knappikonenElementor ? I den här handledningen kommer vi att visa dig hur du uppnår detta med anpassad CSS
Alla ska vara glada om de har friheten/flexibiliteten att skapa något eftersom mer flexibilitet innebär mer produktivitet. På tal om flexibilitet, i den här artikeln kommer vi att visa dig hur du ställer in anpassad storlek på knappikonen. Elementor.
Upptäck Hur man installerar Elementor på WordPress
Som standard är knappwidgeten Elementor kan anpassa ikonstorleken. Men detta val är begränsat till fem fasta alternativstorlekar (extra-small, small, medium, large och extra-large). Inte bara begränsat till fem valda alternativ, men inställningen är inte individuell. Det betyder att när du vill ställa in storleken kommer det att påverka två delar av knappen (ikon och text).
Kanske undrar du, "Är det möjligt att ställa in anpassad storlek för Elementor-knappikonen? ”. Nåväl, allt är möjligt med Elementor. Utan hjälp av tillägg kan du göra det enkelt.
Hur man ställer in Elementor-knappens anpassade ikonstorlek
Innan vi startar den här handledningen vill vi låta dig veta att den här handledningen kommer att fungera med Elementors anpassade CSS. Anpassad CSS-funktion är endast tillgänglig på Elementor Pro.
Nåväl, låt oss börja!
Gå till din Elementor-redigerare. Vi kommer att börja allt från början, så skapa ett avsnitt med bara en kolumn. Välj sedan knappwidgeten från widgetpanelen och dra och släpp den i redigeringsområdet.
Läs också: Elementor: Hur man skapar anpassade former
När du har lagt till knappwidgeten kan du redigera och utforma widgeten enligt dina preferenser. Som att lägga till en ikon, textbakgrundsfärg, etc...
Som du kan se från bilden ovan är storleken på ikonen och texten desamma. När du bara vill ändra storleken på ikonen genom att ställa in den på alternativet Storlek i widgetinställningar, kommer det också att påverka texten.
Ok, nu ska vi lösa det här problemet. I widgetinställningarna, navigera till fliken advanced -> Anpassad CSS.
Kopiera CSS-kodavsnittet nedan och klistra sedan in det i fältet Anpassad CSS.
selector .elementor-button-icon { font-size:100px; color: inherit;
}
selector .elementor-button-text {margin:auto;}
Du kan anpassa ikonstorleken genom att ändra CSS-kodavsnittsvärdet (se bilden nedan).
Där!. Glöm inte att spara eller publicera ditt projekt om du vill.
Skaffa Elementor Pro nu!!!
Slutsats
Den här artikeln visar hur du ställer in anpassad storlek på Elementor-knappikonen med anpassad CSS. Men om du vill ha ett enklare sätt att anpassa storleken på din knappikon eftersom du inte gillar att arbeta med koder, föreslår vi att du använder en Elementor Addon.
Elementor-tillägget som vi starkt rekommenderar är JetElements av Crocoblock. JetElements har över 40 Elementor-widgets. Du hittar en knappwidget som låter dig anpassa storleken på knappikonen.
Med widgeten knapp från JetElements är det mycket enkelt och smidigt att anpassa storleken på knappikonen.
Så ! Det var allt för den här artikeln som visar hur du ställer in en storlek för Elementors knappikon. Om du har några funderingar kring hur du ska ta dig dit, låt oss veta inom commentaires.
Du kan dock också konsultera våra resurser, om du behöver fler element för att genomföra dina projekt för att skapa webbplatser, genom att konsultera vår guide om WordPress blogg skapande eller den på Divi: det bästa WordPress-temet genom tiderna.
Men under tiden dela den här artikeln på dina olika sociala nätverk.
.
