Support » WooCommerce » WooCommerce Payment – Kreditkarten Input Fields mit CSS ändern?

  • Gelöst jana90

    (@jana90)


    Hallo,

    ich nutze das „WooCommerce Payments“ Plugin, um Kreditkartenzahlungen anzunehmen. Ich habe mit dem Inspector die css Klassen versucht ausfindig zu machen, aber schaffe es nicht, die Kreditkarten Input Fields zB von der Höhe her zu ändern. In einem anderen Forenbeitrag habe ich gelesen, dass dies nicht gehen würde, da die Felder in einem iFrame geliefert werden.

    Besteht also wirklich keine Möglichkeit die Felder vom Styling her zu verändern?

Ansicht von 11 Antworten - 1 bis 11 (von insgesamt 11)
  • Hallo,

    Besteht also wirklich keine Möglichkeit die Felder vom Styling her zu verändern?

    keine Ahnung – wie auch ohne URL und Website-Bericht: Bei einem Blick in unsere FAQ hättest du gesehen, dass wir ohne weitere Infos nur Kaffeesatzleserei betreiben können.

    Wenn du dann noch die URL oben einträgst, dann können wir uns das auch zunächst im Frontend ansehen und dir sicher besser helfen.

    Du findest unter Werkzeuge > Websitezustand > Info einen Bericht zur Website. Warte bitte einen Moment bis die Ladeanzeige ganz oben abgeschlossen ist und kopiere dann per Button den Website-Bericht in deine Zwischenablage. Über den Button „Bericht in die Zwischenablage kopieren“ kannst du den Bericht unverändert (bitte mit den Akzentzeichen am Anfang und Ende) einfügen und anschließend hier posten. Evtl. ergeben sich dann weitere Anhaltspunkte, ob und wo das Problem liegt.
    Lies bitte auch noch mal: Bevor du ein neues Thema (Thread) erstellst.

    Viele Grüße
    Hans-Gerd

    Thread-Starter jana90

    (@jana90)

    @hage meines Wissens nach besteht kein „Problem“, dass etwas auf der Website nicht richtig funktioniert. Es geht lediglich darum, die Kreditkarten Input fields mit CSS zu verändern. Selbst wenn ich allgemein das Element „Input“ zB zu ändern. Alle Input Felder verändern sich entsprechend, nur nicht die WooCommerce Payment Felder.

    Wie gesagt, ich denke es liegt daran, dass sie in einem iFrame geliefert werden. Aber es muss ja irgendwie möglich sein, dennoch das CSS hierfür zu ändern.

    Hier ist der Website Link: https://luxexpressions.de/checkout/

    Moderator Bego Mario Garde

    (@pixolin)

    meines Wissens nach besteht kein „Problem“, dass etwas auf der Website nicht richtig funktioniert.

    Von Problem hat Hans-Gerd auch nichts geschrieben? Trotzdem können wir nicht hellsehen und deshalb auch nicht einschätzen, von welchem Code du sprichst. Rufe ich den auf Rückfrage genannten Link auf, wird nur „Dein Warenkorb ist gegenwärtig leer.“ angezeigt – kein Kreditkarte-Feld. Der Website-Bericht fehlt weiterhin.

    Ohne Informationen können wir nicht helfen.

    Moderator Bego Mario Garde

    (@pixolin)

    Inzwischen habe ich auch eine Möglichkeit gefunden, etwas in den Warenkorb zu legen und zum Eingabefeld für die Kreditkartendaten zu kommen. Wie du selbst geschrieben hast, wird das per iFrame eingebunden. Da gibt es keine mir bekannte Möglichkeit, Änderungen am Stylesheet vorzunehmen.

    Screenshot
    Zum Vergrößern bitte anklicken …
    Thread-Starter jana90

    (@jana90)

    @pixolin sorry, ja, ich hätte euch einen Produktlink schicken sollen.

    Also ist es im allgemeinen dann wirklich nicht möglich, das Styling dieser Felder zu verändern? Sprich, jede Website die WooCommerce Payments nutzt, hat dieses, doch sehr veraltete Styling für die Input Felder?

    Moderator Bego Mario Garde

    (@pixolin)

    Mit einem iFrame bindest du den Inhalt einer fremden Website ein. Damit kannst du die Gestaltung nicht unmittelbar mit eigenen CSS-Regeln steuern. Es gibt aber wohl unter bestimmten Voraussetzungen die Möglichkeit, das Styling per jQuery/JavaScript zu beeinflussen. Vgl. How to apply CSS to iFrame

    Thread-Starter jana90

    (@jana90)

    @pixolin danke für die Info! Werde mal schauen, ob ich das hinbekomme 🙂

    Moderator Michi91

    (@michi91)

    https://stripe.com/docs/elements/appearance-api

    Allerdings fürchte ich, dass es dazu schon umfangreiche Kenntnisse zu WordPress Filtern und Js braucht

    Thread-Starter jana90

    (@jana90)

    @michi91 @pixolin nur als update, falls es euch interessiert: ich hatte auch den WooCommerce Support kontaktiert wegen dem CSS problem. Auch hier konnte mir nicht weitergeholfen werden. Wenn man das Stripe Plugin nutzt, bieten die wohl gewisse Hooks, wo man einige vordefinierte Sachen bearbeiten kann aber das WooCommerce Plugin bietet diese Hook wohl nicht.

    Interessant ist aber, dass in der Zwischenzeit auch meinen anderen Checkout Feldern (Name, Adresse, etc.) ein neues Styling verpasst habe (ganz normal durch CSS). Als ich dann meine Website zu einer neuen Domain und Hoster umgezogen habe, hat plötzlich auch das WooCommerce Payments Plugin dieses Styling für die Kreditkarten Felder übernommen.

    Jetzt sieht für mich alles in Ordnung aus 🙂

    Moderator Bego Mario Garde

    (@pixolin)

    Prima. Hört sich so an, als wäre das Problem für dich damit „gelöst“?
    Ich markiere den Thread entsprechend.

    Thread-Starter jana90

    (@jana90)

    @pixolin schön wäre zu wissen, ob es noch eine andere Möglichkeit gibt, dass das WooCommerce Payment Plugin mein CSS erkennt – also auch ohne dass ich die gesamte Seite umziehen muss. Aber wenn es diese weitere Möglichkeit nicht gibt, gebe ich mich damit zufrieden 🙂

Ansicht von 11 Antworten - 1 bis 11 (von insgesamt 11)
  • Das Thema „WooCommerce Payment – Kreditkarten Input Fields mit CSS ändern?“ ist für neue Antworten geschlossen.