Text im Button dünner machen

Don_Viti

Hallo zusammen,

hab hier folgenden Button erstellt:

[dt_button link="https://www.facebook.com/ich_bin_ein_Platzhalter/" rel=" target_blank="true" button_alignment="default" animation="fadeIn" size="medium" style="outline" bg_color_style="custom" bg_color="rgba(204,204,204,1)" bg_hover_color_style="custom" bg_hover_color="#dd9933" text_color_style="custom" text_color="rgba(204,204,204,1)" text_hover_color_style="custom" text_hover_color="#dd9933" icon="fa fa-facebook-official" icon_align="left"]Facebook[/dt_button]

Mir ist hierbei jetzt nur der Schriftzug "Facebook" zu dick. Kann ich hier etwas "erweitern" , dass ich die Schriftart verändern kann? Ich hätte gerne eine dünnere Schrift hier.

Und wenn ich schon mal dabei bin: Falls es geht, dass ich beim icon die große noch anpassen könnte wäre auch nett (damit könnte ich aber leben, Prio wäre eine dünnere Schrift)

Viele Grüße

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Marcus[IS]

Hi,

ein Link zur Webseite wäre hilfreich, da wir dir Anhaltspunkte liefern könnten, welche CSS DIV Klassen WordPress für den Button ansteuert.
Es sind zwar CSS Anweisungen vorhanden, sagen mir aber jetzt nicht so viel aus, da diese wohl von FB bezogen werden.

Du müsstest hingehen und schauen, welche CSS Klassen Anweisung innerhalb deiner WP Installation verwendet wird.
Bei Chrome zum Beispiel geht das mit dem Webmastertool. In der Regel reicht ein Klick mit rechter Maustaste (Zum Beispiel beim Text) und dann aus dem Contextmenü Element untersuchen wählen. Inzwischen haben an für sich alle gängigen Browser ein solches Tool.

Daraufhin werden auch die verwendeten CSS Anweisungen (Zum Beispiel .eine Sub_Klasse , #Eine DIV Klasse) angezeigt und da musst du dann ansetzen.
Falls dein Theme den Customizer unterstützt (Design/Customizer) kannst du die benötigten Anweisungen unter dem Menüpunkt Zusätzliches CSS unterbringen.

Wie du Font Weight einsetzen kannst, wird recht gut in diversen Lernbeispielen beschrieben.
https://www.w3schools.com/cssref/pr_font_weight.asp

Don_Viti

Hallo,

danke für die Antwort, dass hört sich jetzt irgendwie kompliziert an um zu einer Lösung zu kommen, die ein reiner "Baukasten"-Anwender wie ich umsetzen könnte.

Die Seite wäre folgende http://don-marco.de/ und das verwendete Theme ist das hier https://themeforest.net/item/the7-resp…s-theme/5556590

Viele Grüße

Marcus[IS]

Ist bei Premium Themes immer so ein Ding, da ist Hilfe nicht ganz einfach.

Also so ganz Kompliziert, wie du glaubst ist es nicht. ;)

Ich gehe mal davon aus, das dein Theme die zusätzliche CSS Option im Adminbereich unter Design/Customizer unterstützt, oder zumindest eine Option mitbringt um eigenes CSS einzubringen?

Dies hier dürfte der Eintrag sein, um den Text auf den Social Buttons nicht so fett aussehen zu lassen;

Code

.dt-btn {
    font-weight: lighter;
}

Das Facebook Logo wird mittels Font Awesome generiert.

Musst nur die Prozentangabe auf deine Wunschgröße anpassen;

Code

.fa-facebook-official:before {
    content: "\f230";
    font-size: 120%;
}

Ich hoffe ich konnte dir damit ansatzweise weiter helfen.

Don_Viti

Sehr cool.

Ich glaube ich habe die Stelle gefunden, die Du meinst.

Kommt bei firefox leider nicht ganz so gut raus am Ende, aber deutlich besser als vorher, da war es bei firefox grenzwertig.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Text im Button dünner machen

Jetzt mitmachen!