Weitere Informationen und den Download findest du auf der offiziellen Anlaufstelle de.wordpress.org
Seite 1 von 3 123 LetzteLetzte
Ergebnis 1 bis 10 von 21
  1. #1
    PostRank: 0
    Registriert seit
    24.04.2012
    Beiträge
    7

    Contact Form 7 Design anpassen

    Hallo zusammen,

    ich bin sehr unversiert im Umgang mit den Sachen hier aber wollte auf meiner Seite ein Kontaktformular einbinden. Das Problem ist, dass sowohl die Hintergrundfarbe der Textfelder, als auch die Schriftfarbe in diesem Bereich weiß sind.

    Die Seite als ganze ist schwarz mit weißer Schrift und es wäre mir egal ob nun in diesem Bereich die Schrift schwarz/blau wird oder die Kästchen eine andere Hintergrundfarbe bekämen.



    mein code der seite sieht so aus:

    <strong><span style="color: #ffff00;">Hier könnt ihr euch zu den 5. OWS anmelden:</span></strong>

    [contact-form-7 id="951" title="Meldeformular Turnier"]
    und der des Formulares so:


    <p>Ihr Name (Pflichtfeld)<br />
    [text* your-name]

    <p>Ihr Verein (Pflichtfeld)<br />
    [text* verein] </p>

    <p>Ihre E-Mail-Adresse (Pflichtfeld)<br />
    [email* your-email] </p>

    <p>Ihr TTR-Wert (per 11.02.2012) (Pflichtfeld)<br />
    [text* ttr] </p>


    <p>Wahl der Klassen (Pflichtfeld)<br />
    [checkbox Klassenwahl "Herren A" "Herren B" "Herren C" "Herren D" "Herren E" "Brettchen"] </p>
    <p> [checkbox KlassenwahlTeam "Herren Team 1" "Herren Team 2" "Herren Team 3" "Mixed"] </p>
    <p> [checkbox KlassenwahlJugend "Junioren U22" "Mädchen" "Jungen A" "Jungen B" "Jungen A Team" "Jungen B Team"] </p>
    <p> [checkbox KlassenwahlSchüler "Schüler A" "Schüler B" "Schüler C" "Schülerinnen A" "Schülerinnen B" "Schülerinnen C"] </p>


    <p>Teampartner/Doppelpartner (optional)<br />
    [text* partner] </p>


    <p>Ihre Nachricht<br />
    [textarea your-message] </p>

    <p>[submit "Senden"]</p>


  2. #2
    PostRank: 0
    Registriert seit
    06.04.2012
    Beiträge
    3
    Hallo ?,
    hab zum contact form 7 ein Video tutorial auf youtube gefunden. http://m.youtube.com/results?q=wordp...?v=fnINdCe1Y6o link ist vom handy eingefügt.

    Hoffe es hilft.

    Gruss
    Thorsten

  3. #3
    PostRank: 0
    Registriert seit
    24.04.2012
    Beiträge
    7
    Leider hat mir das Tut nicht geholfen (habe schon so ca 5 angeguckt) aber da wird immer nur grundlegend beschrieben wie ich es installiere und einbaue, abe nie wie ich es im Design ändere. Das ist aber gerade meine Frage

  4. #4
    PostRank: 10 Avatar von Hille
    Registriert seit
    22.01.2012
    Beiträge
    7.579
    Anpassungen werden im stylesheet vorgenommen, also in deiner style.css. Hier mal eine Auswahl von möglichen Parametern:

    Code:
    wpcf7 textarea, wpcf7-text, wpcf7-submit usw.
    Hier auch ein Beispiel zu Veranschaulichung:

    Code:
    .wpcf7-text,
    .wpcf7 textarea {
        width: 75%;
        height: 12px;
        padding: 9px 10px;    
        border-right: 1px solid #ccc;
        border-left: 1px solid #ccc;
        color: #47101a;
        font-family: Georgia, "Times New Roman", serif;
        font-size: 12px;
        font-style: italic;
    }
    Besorge dir für den Firefox das Addon Firebug, das ist für solche Arbeiten sehr hilfreich.

  5. #5
    PostRank: 10 Avatar von bgeissler
    Registriert seit
    06.08.2006
    Ort
    Wiesloch
    Beiträge
    4.400
    http://contactform7.com/docs/
    Hier findest du die Dokumentation.
    Schau z.B. unter "Textfields" dort kannst du "class:" Atribute für die Felder angeben, das geht auch für alle anderen Formelemente. Die Klassen definierst du in deiner style.css

  6. #6
    PostRank: 0
    Registriert seit
    14.12.2010
    Beiträge
    16
    Hallo,
    verwende auch das Contact Form7 in meiner WP Seite.

    Frage: wie kann ich "neben" sprich Rechts von dem Formular Contact Form7 ein Textfeld zusätzlich einbauen um z.b Allgemeinen Text anzuzeigen und einzugeben?

  7. #7
    PostRank: 0
    Registriert seit
    24.04.2012
    Beiträge
    7
    Zitat Zitat von bgeissler Beitrag anzeigen
    http://contactform7.com/docs/
    Hier findest du die Dokumentation.
    Schau z.B. unter "Textfields" dort kannst du "class:" Atribute für die Felder angeben, das geht auch für alle anderen Formelemente. Die Klassen definierst du in deiner style.css
    danke erstmal für eure mühen es mir zu erklären.
    wenn ich in der style.css den code von Hille einfüge ändert das an dem aussehen der seite leider garnix. müsste ich da noch was ändern?

    und zum thema klassen eine sehr allgemeine frage: reicht eine klasse für alle objekte in dem formular anzulegen? kann ich in einer klasse einfach nur eine textfarbe definieren und diese klasse dann für textfelder, submit-button, checkbox etc. benutzen?

    und wenn ich diese klasse definiere, braucht es einfach nur ein
    .farbe {
    color: #ff0000;
    }

    besipielsweise?

    gruß Stephan

  8. #8
    PostRank: 0
    Registriert seit
    24.04.2012
    Beiträge
    7
    p.s. wenn ich ein textfeld mit firebug analysiere steht da:
    <span class="wpcf7-form-control-wrap name1"> <input id="acpro_inp4" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required wpcf7-text" type="text" size="40" value="" name="name1">


    </span>

    wobei wpcf7-text die manuell im formular zugewiesene klasse ist. (mit dem code von hille in der style.css)

    und die colour-sachen aus der wpcf7-text klasse sind durchgestrichen, als ob sie überschrieben würden
    Geändert von M.0.O. (01.05.2012 um 23:01 Uhr)

  9. #9
    PostRank: 10 Avatar von bgeissler
    Registriert seit
    06.08.2006
    Ort
    Wiesloch
    Beiträge
    4.400
    Habe gerade mal getestet:
    Die Textfarbe lässt sich per class nicht für einzelne Felder nicht zuweisen.

  10. #10
    PostRank: 0
    Registriert seit
    24.04.2012
    Beiträge
    7
    Zitat Zitat von bgeissler Beitrag anzeigen
    Habe gerade mal getestet:
    Die Textfarbe lässt sich per class nicht für einzelne Felder nicht zuweisen.
    gibt es denn noch andere möglichkeiten?

Seite 1 von 3 123 LetzteLetzte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •