CSS Selektor Button "Kostenpflichtig bestellen"

Thema wurde von Anonymous, 17. April 2022 erstellt.

  1. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    15. Mai 2017
    Beiträge:
    691
    Danke erhalten:
    129
    Danke vergeben:
    176
    Ich möchte Schriftfarbe und Hintergrund des Buttons "Kostenpflichtig bestellen" ändern.

    Über Styleedit geht das wohl nicht, zumindest habe ich es nicht gefunden?!?
    (Ich würde es gut finden, wenn man diese "wichtigen Buttons" ("KASSE", "ZUM WARENKORB", "KOSTENPFLICHTIG BESTELLEN") im Styleedit anpassen könnte, so wie es es so für den "In den Warenkorb" Button bereits der Fall ist)

    Jetzt suche ich bereits eine ganze Weile, finde aber nicht den passenden CSS Selektor der dann eben nur auch genau diesen Button ändert. Kann mir jemand helfen?
     
  2. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    11. Juli 2021
    Beiträge:
    354
    Danke erhalten:
    148
    Danke vergeben:
    124
    Hi @DOGS in the CITY

    wenn Du Firefox nutzt, kannst Du mittels der Tastenkombination STRG+SHIFT+C direkt einen Bereich auswählen, in diesem Fall z.B. deine Buttons und kannst die jeweiligen Klassen einsehen.
    Die gleiche Tastenkombination funktioniert meines Wissens auch bei Edge.

    So habe ich folgende Klassen:

    In den Warenkorb:
    class="btn btn-lg btn-buy btn-block js-btn-add-to-cart"

    Zur Kasse:
    class="btn btn-primary btn-block button-submit"

    Zahlungspflichtig bestellen:
    class="btn btn-primary btn-block checkout-confirmation-submit"
     
  3. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    15. Mai 2017
    Beiträge:
    691
    Danke erhalten:
    129
    Danke vergeben:
    176
    #3 Anonymous, 17. April 2022
    Zuletzt bearbeitet: 17. April 2022
    Hallo O.C.

    danke für die Antwort am Ostersonntag.
    So in der Art hatte ich mich auch bereits genähert, leider erfolglos.

    Wenn ich dem eigenen CSS etwas in dueser Art hinzufüge, ändert sich an dem Button "Kostenpflichtig bestellen" leider nichts.
    Code:
    .btn btn-primary btn-block checkout-confirmation-submit {
         background: #ffa41c !important;
        border-color: #ffa41c !important;
        font-size: 18px !important;
    }
    Was könnte der Fehler sein?
     
  4. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    11. Juli 2021
    Beiträge:
    354
    Danke erhalten:
    148
    Danke vergeben:
    124
    So gehts:
    Code:
    .checkout-confirmation-submit {
        background: #ffa41c !important;
        border-color: #ffa41c !important;
        font-size: 18px !important;
    }
     
  5. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Versuche es mal mit:
    Code:
    .btn btn-primary .btn-block .checkout-confirmation-submit {
     
  6. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    15. Mai 2017
    Beiträge:
    691
    Danke erhalten:
    129
    Danke vergeben:
    176
    Hallo OC, Barbara, danke für Eure Hilfe!

    Feedback:
    .checkout-confirmation-submit ==> funktioniert.
    .btn btn-primary .btn-block .checkout-confirmation-submit ==> funktioniert nicht.
     
  7. Kai Stejuhn

    Kai Stejuhn Beta-Held

    Registriert seit:
    26. September 2014
    Beiträge:
    1.409
    Danke erhalten:
    709
    Danke vergeben:
    92
    Da müsste dann noch ein . vor btn-primary also

    .btn .btn-primary .btn-block .checkout-confirmation-submit
     
  8. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    15. Mai 2017
    Beiträge:
    691
    Danke erhalten:
    129
    Danke vergeben:
    176
    Funktioniert trotzdem nicht.

    Nur '.checkout-confirmation-submit' funktioiniert.

    Somit vielen Danke an alle.
     
  9. Kai Stejuhn

    Kai Stejuhn Beta-Held

    Registriert seit:
    26. September 2014
    Beiträge:
    1.409
    Danke erhalten:
    709
    Danke vergeben:
    92
    Das kommt davon, wenn man noch nicht ganz bei der Sache ist.

    Da das zusammenhängende Klassenselektoren sind, dürfen keine Leerzeichen zwischen den einzelnen Bezeichnungen stehen.

    Also der Richtige Code lautet dann:
    Code:
    .btn.btn-primary.btn-block.checkout-confirmation-submit {
        color: red;
    }
    Das würde dann die Schrift auf rot setzen.
     
  10. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    15. Mai 2017
    Beiträge:
    691
    Danke erhalten:
    129
    Danke vergeben:
    176
    Super! Danke.