"Kaufen"-Button Hintergrundfarbe ändern

  • Hallo zusammen,

    ich bin seit Tagen verzweifelt auf der Suche nach einem hilfreichen Tipp, wie und wo ich die Hintergrundfarbe des "Kaufen"-Buttons ändern kann. Bisher leider ohne Erfolg :cry:

    Es wäre super, wenn mir hier jemand helfen könnte :)

    Vielen Dank im Voraus !!

    Liebe Grüße
    Nic

    • Anzeige

    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

  • Hi nic66,

    für Hilfe ist es günstig, zumindest einen Link zur Seite anzugeben.

    Mein große Glaskugel sagt mir, es könnte sich um einen Shop handeln, evtl. könnte es Woocommerce sein. Oder auch WP Shop Germany.

    Du musst die entsprechende Template-Datei suchen und (am besten, weil sicher bei Updates) in ein Childtheme deines genutzen Themes mit dem richtigen Pfad einfügen und dann anpassen.

  • Es geht auch ohne ein Childtheme zu erstellen und funktioniert auch auch bei künftigen Updates.

    zB. mit
    https://wordpress.org/plugins/joddit-global-css/

    Aber wenn du den Button ändern möchtest musst du mit dem Inspektor von deinem Browser arbeiten und ein wenig Ahnung von HTML/CSS haben.

    Poste den Link zur Seite und welche Farben der Button haben soll. Das ist kein großer Aufwand mal eben die Button Farbe zu ändern.

    Dann wird dir hier bestimmt einer sagen was du genau bei dem oben genannten Plugin eintragen musst um die Regel zu überschreiben.

  • Hallo Ihr Beiden :)

    Vielen Dank für Eure Antworten :)

    Gerd-E., da kann man mal sehen, wie sehr ich schon in dieses Thema verrannt bin :( .. sorry ..

    Ja, es ist ein Shop und ich arbeite mit Wordpress, WooCommerce und WooCommerce German Market.

    Die Hintergrundfarbe hab ich nun ändern können, nach langem weiteren Rumprobieren und -suchen. Uff!!

    Nun hab ich aber ein ganz anderes Problem entdeckt, das scheinbar etwas komplizierter ist :(

    Der Button "Kaufen" und der Button "Weiter" auf der Seite "Kasse" haben dieselbe ID .. d.h., wenn ich einen der beiden Buttons ändere, dann ändert sich der andere Button mit. Was wegen der Farbe jetzt kein Problem darstellt, aber da ich des dt. Rechtes wegen den Button "Kaufen" nach rechts verschoben habe, hängt jetzt auch der Button "Weiter" auf der Seite "Kasse" etwas schepps rechts auf der Seite. So soll das allerdings nicht sein .. dieser Button muss wieder weiter nach links.

    Wenn ich aber nun die ID eines Buttons umschreibe, funktioniert der sicher nicht mehr.

    Oder habt Ihr hierzu eine zündende Idee?

    Wenn Ihr mal schauen wollt: http://www.romis-hundeshop.de

    Meinen Theme-Entwickler habe ich bereits auch angeschrieben und warte aber noch auf Antwort.

    Vielen Dank und liebe Grüße
    Nic

  • Versuch den Button "Weiter" mit

    Code
    input[data-value="weiter"]{...}

    per CSS anzusprechen. So könntest du beide unterscheiden.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Hallo SirEctor,


    vielen Dank für Deine Antwort :)

    Meine Hirnressourcen sind für heute verbraucht ;) .. ich werde das aber morgen umgehend versuchen .. sagst Du mir bitte vorsichtshalber auch, wo? :)

    Ich hab so viel ausprobiert, dass ich mich grad nicht mehr auskenne .. sorry .. ich bin ehrlich gesagt, total durch den Wind grad :(

    Herzlichen Dank und liebe Grüße
    Nic

  • Dies noch kurz zur Info, falls das hilft:
    Die Hintergrundfarbe des "Kaufen"-Buttons konnte ich in der "plugins.css" meines Themes ändern (vielleicht hilft das ja auch einem anderen, der auf Suche danach ist) .. muss ich diesen Code von Dir (SirEctor) auch dort eingeben? ... Und wenn ja, wo, bitte :)

    Herzlichen Dank - ich wäre heilfroh, wenn ich dieses leidige Problem gelöst hätte :)
    Liebe Grüße
    Nic

  • Nochwas fällt mir gerade ein:
    Ich hab das Plugin "Simple Custom css" installiert .. kann ich den Code auch dort eingeben?

    Vielen lieben Dank
    Nic

  • Nochwas fällt mir gerade ein:
    Ich hab das Plugin "Simple Custom css" installiert .. kann ich den Code auch dort eingeben?

    Vielen lieben Dank
    Nic


    Genau da trägst du den Code ein.

    Das Geheimnis des Könnens liegt im Wollen!
    [size=12]Bitte keine Hilfegesuche per PN (auch keine "privaten" Links). Das ist ein öffentliches Forum.[/SIZE]

  • Hallo SirEctor,

    vielen Dank :)

    Dein Code steht nun in der Simple Custom css ...

    Vorher hatte ich den Code:
    #place_order {
    float: right;
    background-color: #fd5c48;
    color: #ffffff;
    }
    dort eingetragen, wodurch beide Buttons nach rechts verschoben wurden und ihnen die Farben zugewiesen wurden. Dieser Code steht noch in der Simple Custom css.

    Nun muss ich aber bei dem neuen Code "float: left;" eintragen, damit der Button "Weiter" wieder nach links rutscht, oder?
    Das hatte ich versucht, aber leider funktioniert das nicht :(

    Kannst Du mir bitte sagen, was ich nun tun muss? (Sorry, bin nicht sehr bewandert in diesen Dingen)

    Vielen Dank und liebe Grüße
    Nic

    Einmal editiert, zuletzt von nic66 (14. März 2015 um 14:00)

  • Hallo nochmal,

    ich habe nun einiges versucht, aber nichts klappt :(
    Ich kann den Button mit dem neuen Code hoch- oder runtersetzen, allerdings verschiebt sich nun der Text "Ich habe folgenden Bedingungen gelesen ..." ebenfalls mit nach oben oder unten :( Und der Text sollte eigentlich sowieso über dem Button stehen und nicht drunter.

    Nach links bekomm ich ihn weder über "margin-.." noch über "float" :(

    Für Hilfe wäre ich sehr dankbar :)

    Vielen Dank und liebe Grüße
    Nic

  • Hallooooooooooooooochen :)

    Ich hab's!!!! :)

    Hier die Lösung, auch für die, die dasselbe Problem haben (oder evtl. noch haben werden):

    "Kaufen"-Button nach rechts und (z.B. rot) einfärben mit z.B. weißer Schrift:
    #place_order {
    float: right;
    background-color: #fd5c48;
    color: #ffffff;
    }

    "Weiter"-Button auf der Seite "Kasse" zurück nach links geht mit:

    #payment #place_order {
    float: left;
    background-color: #fd5c48;
    color: #ffffff
    }

    Beides in die Simple Custom css et voila - sitzt, passt, wackelt und hat Luft ;)
    Es passt jetzt! :)

    Herzlichen Dank für Eure Hilfe!!

    Liebe Grüße
    Nic

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!