So legen Sie eine Größe für das Schaltflächensymbol festElementor ? In diesem Tutorial zeigen wir Ihnen, wie Sie dies mit benutzerdefiniertem CSS erreichen
Jeder sollte glücklich sein, wenn er die Freiheit/Flexibilität hat, etwas zu schaffen, denn mehr Flexibilität bedeutet mehr Produktivität. Apropos Flexibilität, in diesem Artikel zeigen wir Ihnen, wie Sie eine benutzerdefinierte Größe für das Schaltflächensymbol festlegen. Elementor.
Entdecken Sie So installieren Sie Elementor auf WordPress
Standardmäßig das Schaltflächen-Widget Elementor kann die Symbolgröße anpassen. Diese Auswahl ist jedoch auf fünf feste Optionsgrößen (extraklein, klein, mittel, groß und extragroß) beschränkt. Es ist nicht nur auf fünf ausgewählte Optionen beschränkt, sondern die Einstellung ist auch nicht individuell. Das heißt, wenn Sie die Größe festlegen möchten, hat dies Auswirkungen auf zwei Elemente der Schaltfläche (Symbol und Text).
Vielleicht fragen Sie sich: „Ist es möglich, eine benutzerdefinierte Größe für das Elementor-Schaltflächensymbol festzulegen? “. Nun, mit Elementor ist alles möglich. Ohne die Hilfe von Add-Ons können Sie dies problemlos tun.
So legen Sie die benutzerdefinierte Symbolgröße der Elementor-Schaltfläche fest
Bevor Sie mit diesem Tutorial beginnen, möchten wir Sie darüber informieren, dass dieses Tutorial mit dem benutzerdefinierten CSS von Elementor funktioniert. Benutzerdefinierte CSS-Funktionalität ist nur auf verfügbar Elementor Pro.
Nun, fangen wir an!
Gehen Sie zu Ihrem Elementor-Editor. Wir fangen bei Null an, erstellen Sie also einen Abschnitt mit nur einer Spalte. Wählen Sie als Nächstes das Schaltflächen-Widget aus dem Widget-Panel aus und ziehen Sie es per Drag & Drop in den Bearbeitungsbereich.
Lesen Sie auch: Elementor: So erstellen Sie benutzerdefinierte Formen
Nachdem Sie das Schaltflächen-Widget hinzugefügt haben, können Sie das Widget nach Ihren Wünschen bearbeiten und gestalten. Wie das Hinzufügen eines Symbols, einer Texthintergrundfarbe usw. ….
Wie Sie auf dem obigen Bild sehen können, sind die Symbol- und Textgrößen gleich. Wenn Sie die Größe des Symbols nur ändern möchten, indem Sie es in der Option Größe der Widget-Einstellungen festlegen, wirkt sich dies auch auf den Text aus.
Ok, jetzt werden wir dieses Problem lösen. Navigieren Sie in den Widget-Einstellungen zur Registerkarte fortgeschritten -> Benutzerdefiniertes CSS.
Kopieren Sie das CSS-Snippet unten und fügen Sie es dann in das Feld ein Benutzerdefiniertes CSS.
selector .elementor-button-icon { font-size:100px; color: inherit;
}
selector .elementor-button-text {margin:auto;}
Sie können die Symbolgröße anpassen, indem Sie den Wert des CSS-Snippets ändern (siehe Abbildung unten).
Dort!. Vergessen Sie nicht zu speichern bzw veröffentlichen Ihr Projekt, wenn Sie möchten.
Holen Sie sich Elementor Pro jetzt!!!
Zusammenfassung
Dieser Artikel zeigt Ihnen, wie Sie die benutzerdefinierte Größe des Elementor-Schaltflächensymbols mithilfe von benutzerdefiniertem CSS festlegen. Wenn Sie jedoch eine einfachere Möglichkeit zum Anpassen der Größe Ihres Schaltflächensymbols wünschen, weil Sie nicht gerne mit Codes arbeiten, empfehlen wir die Verwendung von a Elementor-Addon.
Das Elementor-Addon, das wir sehr empfehlen, ist JetElements von Crocoblock. JetElements hat über 40 Elementor-Widgets. Sie finden ein Schaltflächen-Widget, mit dem Sie die Größe des Schaltflächensymbols anpassen können.
Mit dem Widget Taste von JetElements ist das Anpassen der Schaltflächensymbolgröße sehr einfach und nahtlos.
So ! Das war es für diesen Artikel, der Ihnen zeigt, wie Sie eine Größe für das Schaltflächensymbol von Elementor festlegen. Wenn Sie Bedenken haben, wie Sie dorthin gelangen, lassen Sie es uns innerhalb wissen commentaires.
Sie können sich aber auch beraten unsere RessourcenWenn Sie mehr Elemente benötigen, um Ihre Projekte zur Erstellung von Internetseiten durchzuführen, konsultieren Sie unseren Leitfaden auf der WordPress-Blog-Erstellung oder der eine auf Divi: das beste WordPress-Theme aller Zeiten.
Aber in der Zwischenzeit Teile diesen Artikel in deinen verschiedenen sozialen Netzwerken.
...
