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:
    823
    Danke erhalten:
    183
    Danke vergeben:
    208
    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:
    455
    Danke erhalten:
    215
    Danke vergeben:
    166
    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:
    823
    Danke erhalten:
    183
    Danke vergeben:
    208
    #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:
    455
    Danke erhalten:
    215
    Danke vergeben:
    166
    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.657
    Danke erhalten:
    11.371
    Danke vergeben:
    1.616
    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:
    823
    Danke erhalten:
    183
    Danke vergeben:
    208
    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.454
    Danke erhalten:
    743
    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:
    823
    Danke erhalten:
    183
    Danke vergeben:
    208
    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.454
    Danke erhalten:
    743
    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:
    823
    Danke erhalten:
    183
    Danke vergeben:
    208
    Super! Danke.