1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Contact Form 7 anpassen oder formatieren

Dieses Thema im Forum "Plugins und Widgets" wurde erstellt von NataschaK, 7. September 2010.

  1. NataschaK

    NataschaK Well-Known Member

    Registriert seit:
    21. Mai 2010
    Beiträge:
    89
    Zustimmungen:
    0
    Hallo alle zusammen,
    ich wollte fragen ob es möglich ist, Contact Form 7 zu formatieren und an das eigene Layout anzupassen, da ich das Problem habe, dass die Formularfelder über den Rand meines Mainbereiches rausragen und das sieht nicht so schön aus...
    Darum wollte ich die Feldlänge verkürzen und vlt. wenn das möglich ist die Hintergrundfarbe ein bisschen anpassen=)

    Sollte es damit nicht möglich sein, gibt es den ein andres Plugin womit ich das machen kann?

    Hoffe auf schnelle Antwort

    Liebste Grüße
     
  2. NataschaK

    NataschaK Well-Known Member

    Registriert seit:
    21. Mai 2010
    Beiträge:
    89
    Zustimmungen:
    0
    Gibt es da den keine Antwort auf diese Frage?
    Es ist sehr sehr wichtig :(
     
  3. NataschaK

    NataschaK Well-Known Member

    Registriert seit:
    21. Mai 2010
    Beiträge:
    89
    Zustimmungen:
    0
    Ist das den eine so schwierige Frage?
    Ich bin echt kurz vorm Verzweifeln, das Forum ist so groß und trotzdem will mir niemand helfen....
     
  4. mfitzen

    mfitzen Well-Known Member

    Registriert seit:
    9. Juli 2006
    Beiträge:
    9.820
    Zustimmungen:
    2
    Poste bitte einen Link zum Problem, damit man sich das mal ansehen kann. Möglich ist es...

    EDIT: Bzw. funktioniert es scheinbar auch so, in dem Du entsprechende Klassen in die eckigen Klammern schreibst, diese dann Deiner style.css hinzufügst und entsprechend stylest.

    Bsp. für den Submit Button:

    In den Pluginoptionen steht dann irgendwo
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Daraus machst Du dann
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    In der style.css schreibst Du dann:
    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
    Das sollte für alle wichtigen Elemente des Formulars funktionieren.

    EDIT2: Siehe Dokumentation: http://contactform7.com/2009/11/18/text-fields/
     
    #4 mfitzen, 13. September 2010
    Zuletzt bearbeitet: 13. September 2010
  5. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Hallo zusammen,

    ich habe ein ähnliches Problem:

    http://brencher-reisen.bplaced.net/Wordpress/kontakt-2/

    So sieht das aus.

    So sieht der Code des Plugin aus:

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

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

    <p>Betreff<br />
    [text your-subject] </p>

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

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

    Diese Seite habe ich aus dem Link von infected:

    http://contactform7.com/text-fields/

    Damit scheint man dieses Formatierungsproblem lösen zu können.
    Man, ich nicht.. Leider. Ich bekomme das einfach nicht hin, das die Zeilenabstände passen und nicht alles so ineinadergeschoben aussieht.

    Bisher konnte ich mir alle Fragen mit Google beantworten, aber das scheint tiefer zu gehen.

    Kann mir bitte jemand helfen und den Code anpassen?

    Vielen Dank und beste Grüße
    Stefan
     
  6. fragenlurch

    fragenlurch Well-Known Member

    Registriert seit:
    6. Mai 2011
    Beiträge:
    449
    Zustimmungen:
    0
    Die Feldlänge kannst du beeinflussen. Versuch mal den mitgelieferten Form-Generator. Ein Beispiel für ein angepasstes Feld:

    [text* Nachname 17/40]
     
  7. fragenlurch

    fragenlurch Well-Known Member

    Registriert seit:
    6. Mai 2011
    Beiträge:
    449
    Zustimmungen:
    0
    Um eventuelle Floats hinzubekommen, würd ich zusammengehörende Felder in einzelne Divs packen.
    Ich bin da auch regelmäßig am verzweifeln und frage mich, warum so altbackene Dinge nicht mal überarbeitet werden.
     
  8. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Super, vielen Dank schon mal für diesen Tip!

    Damit habe ich es jetzt so angepasst: http://brencher-reisen.bplaced.net/Wordpress/kontakt-2/

    Ist 100/40.. Ich kenne mich leider gar nicht damit aus. Ist das so praktikabel?

    Floats und Divs sind Dinge von denen ich bisher nichts gehört habe.

    Vielen Dank!
     
  9. fragenlurch

    fragenlurch Well-Known Member

    Registriert seit:
    6. Mai 2011
    Beiträge:
    449
    Zustimmungen:
    0
    Na das sieht doch schon ganz brauchbar aus. den senden button würd ich ja noch drunter setzen und nicht so dran kleben.

    zu den beiden zahlen: die erste gibt die breite deiner felder an, die zweite die anzahl der zeichen, die eingegeben werden können.
     
  10. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Hallo,

    gute Info mit der Zahl der erlaubten Zeichen. Hab an die Höhe gedacht.
    Alles eben etwas try&error.. :D

    Wie bekomme ich den Senden-Button denn nach unten?

    Würde mir auch besser gefallen.

    Gruß
    Stefan
     
  11. illufan

    illufan Well-Known Member

    Registriert seit:
    31. Dezember 2010
    Beiträge:
    53
    Zustimmungen:
    0

    Hallo Stefan,

    wenn du der textarea den float durch clear:both; wieder aufhebst und ein margin-bottom:10px; für den Abstand gibst. :)


    Code:
    Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!
     
  12. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Oha, 4 Wörter in einem Satz die ich nicht kenne und verstehe leider.

    Was aus diesem Textblock soll ich denn wo einpflegen?
    Oder einfach den ganzen Block vor den "Submit-Buttom" ?

    Danke für die Hilfe!
     
  13. illufan

    illufan Well-Known Member

    Registriert seit:
    31. Dezember 2010
    Beiträge:
    53
    Zustimmungen:
    0
    In deiner style.css Zeile 71 änderst du den Teil bei textarea. :)
     
  14. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Auf das style.css Ding kann ich über meinen FTP zugreifen, oder?
    Das geht nicht über das Backend?
     
  15. bgeissler

    bgeissler Well-Known Member

    Registriert seit:
    6. August 2006
    Beiträge:
    4.404
    Zustimmungen:
    0
    @touge
    mit den fixen Angaben für Feldlänge ist dein Theme nicht mehr responsive.
    Setze besser das ganze Form in eine Div, die max-width stellst du entspr. deines Themes ein:
     
  16. illufan

    illufan Well-Known Member

    Registriert seit:
    31. Dezember 2010
    Beiträge:
    53
    Zustimmungen:
    0
    Doch unter Design --> Editor --> style.css
     
  17. mfitzen

    mfitzen Well-Known Member

    Registriert seit:
    9. Juli 2006
    Beiträge:
    9.820
    Zustimmungen:
    2
    Ergänzend: Aber auch nur wenn die Datei beschreibbar ist.
     
  18. touge

    touge Member

    Registriert seit:
    8. April 2013
    Beiträge:
    7
    Zustimmungen:
    0
    Ohje, hab mir das jetzt mal angesehen.
    Style.css geht über Design -> Editor, ja, aber da blicke ich nicht wirklich durch.

    Was ist gemeint mit "nicht mehr responsive" ?
     
  19. bgeissler

    bgeissler Well-Known Member

    Registriert seit:
    6. August 2006
    Beiträge:
    4.404
    Zustimmungen:
    0
    Dein Theme passt sich automatisch an alle Anzeigebreiten auch mobile-Geräte an.
     
  20. 23Ruben

    23Ruben New Member

    Registriert seit:
    12. Dezember 2013
    Beiträge:
    1
    Zustimmungen:
    0
    Hallo,

    mit dem Plugin Contact Form 7 Cusomizer geht vieles viel einfacher (Farbe, Göße etc.)
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden