Kontaktformular einbetten ♥♥



Hallo ihr Leser von CopyPasteLove!

Ich bin Susi von Spürbar und zeige euch wie ihr mit Hilfe eines Anbieters ein Kontaktformular auf eurem Blog einbettet.

Warum ein Kontaktformular?
  • Man muss nicht unbedingt eine neue E-Mail Adresse erstellen, weil ihr eure "normale" nicht öffentlich preisgeben wollt.
  • Keine Spam-Mails.
  • Schnelle und einfache Form mit euch Kontakt aufzunehmen.
Ich benutze auf meinem Blog hierzu als Anbieter www.foxyform.de. Mit diesem Anbieter bin ich sehr zufrieden und bekomme von ihm auch keine nervigen Newsletter.

Anleitung:

1. Die Erstellung des Formulars ist ganz einfach und geht schnell.
Eine Vorschau wird ebenfalls erstellt. So kann man auch mit den Farben etwas herumexperimentieren.
2. Wenn man mit dem Aussehen des Formulars zufrieden ist, einfach auf  >>Formular erstellen<< klicken.


3. Nun muss der HTML-Code kopiert werden.

4. Jetzt geht es um das Einbetten des Codes. Dabei stellt sich die Frage, ob man das Kontaktformular als Widget auf der Startseite haben möchte oder auf einer sogenannten "Seite".

4.1 Wenn ihr es als Widget wollt:

Ihr geht auf   >Design und dann auf  >Gadget hinzufügen. Hier sucht ihr dann HTML/JavaScript aus...


HTML/JavaScriptHTML/JavaScriptHinzufügen
Fügen Sie Ihrem Blog Funktionen und anderen Code von Drittanbietern hinzu.
Von Blogger 


und fügt den Code ein. Auf speichern klicken und fertig.
Je nachdem ob ihr das Formular an der Sidebar oder am Ende des Blogs positioniert, solltet ihr die Höhe und/ oder Breite verändern (3. Zeile).

4.2 Das Formular auf einer gesonderten Seite:



Unter >Posting >Seite bearbeiten könnt ihr eine neue Seite erstellen und hier den HTML-Code einbetten. Dabei ist darauf zu achten, dass ihr nicht bei >Verfassen seid, sondern bei >HTML bearbeiten. (Habe hier schon etwas an dem Code verändert, weswegen er etwas von eurem abweicht). Veröffentlichen und fertig!




Das wars auch schon! Auf meinem Blog habe ich das Kontaktformular in meinem Impressum eingebettet. 
Jetzt verabschiede ich mich und hoffe, dass mir vielleicht der ein oder andere von euch eine E-Mail schreibt ;)

Kuss, Susi

49 Kommentare

  1. Nach einem Kontaktformular hab ich schon lange gesucht!
    Tolles Tutorial! Dankeschön!
    Habs auch direkt in meinen Blog eingebaut! :)

    AntwortenLöschen
  2. Super - danke für den Tipp. Hab ich gleich mal eingebaut :)

    AntwortenLöschen
  3. Dieser Kommentar wurde vom Autor entfernt.

    AntwortenLöschen
  4. Hab ich schon bei vielen gesehen und wusste nie wie es geht, danke sehr :)

    AntwortenLöschen
  5. Dieser Kommentar wurde vom Autor entfernt.

    AntwortenLöschen
  6. Danke, hat mir sehr geholfen... Ich habe es gleich eingebaut ;)

    AntwortenLöschen
  7. Wir die eigende E-mailadresse da nicht angezeigt??.

    http://spruso.blogspot.com/

    AntwortenLöschen
  8. Vielen Dank für den Tip und die ausführliche Einbauanleitung.
    Geht ja wirklich flott und unkompliziert.

    Der einzige Nachteil ist, dass ein Fremdanbieter die Daten der Kontaktanfragen bekommt.
    Sowohl die Mailadressen, als auch die Inhalte der Mail.

    Aber das muß man wohl in Kauf nehmen, wenn man dafür einen kostenlosen Anbieter nimmt.

    Viele Grüße aus Paraguay

    AntwortenLöschen
  9. Super danke. Meine frage ist noch, wie kann ich das beim Menüpunkt Contact einfügen?

    AntwortenLöschen
  10. Super, ich habe so lange danach gesucht !!!

    Vielen Dank ;-)

    AntwortenLöschen
  11. Hallo !! Eine kurze Frage, bekommt man das Kontaktformular auch größer und mittig
    fixiert? Würde schöner ausschauen! Danke für eure Hilfe,
    Grüße,
    Antonia :)

    AntwortenLöschen
  12. Wow, ist ja echt einfach.
    Danke für die tolle Erklärung!
    Hab ich gleich bei meinem Blog angewendet

    AntwortenLöschen
  13. Uhh, toll!
    Nach sowas habe ich gesucht, vielen Dank :)

    AntwortenLöschen
  14. hilfe!!
    habs mal kurz ausprobiert und beschlossen, dass ichs doch nicht haben will... fragt nicht, wieso ichs dann ausprobiert hab ;D
    wie krieg ich das Ding jetzt wieder weg? also, dass gadget hab ich normal gelöscht, aber kann ich meine daten dem anbieter auch irgendwie wieder "entziehen"?

    übrigens ein super blog hier^^

    AntwortenLöschen
  15. dankeschön. Hab ich schon so lang nach gesucht! :):*

    AntwortenLöschen
  16. Vielen Dank! Hat mir sehr geholfen :-)

    AntwortenLöschen
  17. Prima Tipp, vielen Dank, hat auf Anhieb funktioniert das Einbetten!

    AntwortenLöschen
  18. Schade dass man das nicht transparent machen kann, desswegen hab ichs wieder entfernt :/ Sah sonst etwas komisch aus, so weiß auf weiß-transparent ^^

    AntwortenLöschen
  19. Dankeschön!!!
    Hat geklappt, nur schade, dass der Anbieter keine Dropdown-Menüs kann.

    Aber man kann nicht alles haben...

    AntwortenLöschen
  20. Super Tipp - wurde hier soeben eingebaut:
    www.hamster-info.net

    AntwortenLöschen
  21. Kann man das Formular auch zentrieren?

    AntwortenLöschen
  22. vielen Dank für den tollen Tipp :-)
    Ist es möglich die Bezeichnungen im Kontaktformular zu ändern? Also statt "Betreff" z.B. "Blogbeschreibung" oder ähnliches?

    AntwortenLöschen
  23. Wieder nen suuuuuper Tipp! I´m so liking your page ;)

    AntwortenLöschen
  24. Super! Gleich ausprobiert & es hat geklappt

    LG

    AntwortenLöschen
  25. Dieser Kommentar wurde vom Autor entfernt.

    AntwortenLöschen
  26. Danke für deine Hilfe!
    Aber irgendwie funktioniert das bei mir nur in der Ansicht "Vorschau".
    Sobald ich es veröffentlich kommt unter der Seite "Kontakt" gar nichts mehr.
    Weißt du hier zufällig woran es liegen könnte?

    Hier mal meine Blog Adresse mit der neuen Seite "Kontakt":

    http://steffis-blogwelt.blogspot.de/

    AntwortenLöschen
  27. Dieser Kommentar wurde vom Autor entfernt.

    AntwortenLöschen
  28. Super gut erklärt :) mich würde allerdings auch nochmal interessieren wie man das Kontaktformular etwas größer machen kann und zentriert platziert. würde mich sehr über eine Antwort freuen. Liebe Grüße

    AntwortenLöschen
    Antworten
    1. Zentrieren kannst du durch < center > am Anfang und am Ende des Codes :) Größe, indem du height und width im Code selbst änderst :)

      Löschen
    2. < / center > am Ende des Codes :)

      Alles ohne Leerzeichen dazwischen!

      Löschen
  29. Bei mir ist an der Seite des Kontaktformulars eine Scrollleiste wie bekomme ich die weg? :/

    AntwortenLöschen
  30. Cool hat sofort geklappt! Bitte mehr Tutorials von Dir :-)
    Vielen Herzlichen Dank dafür, die Kontakt Seite sieht so
    richtig professionell aus!

    LG Kira

    AntwortenLöschen
  31. Huhu und vielen Dank für das tolle Tutorial!
    Nach einiger Zeit Rumgefriemel und Zerbeißen der Tastatur ist es mir dann auch gelungen den doofen Scrollbalken zu entfernen. Wie es nun schlussendlich funktioniert hat, kann ich nicht mehr nachvollziehen, aber es klappt.

    Thanks for sharing :)

    AntwortenLöschen
  32. Vielen Dank für deine tolle Erklärung, hab ich gleich ausprobiert!
    Nur, dass bei mir rechts vom Kontaktformular ein Balken zum Scrollen auftaucht (habe aber lediglich Name und E-Mail als Optionen, also zu lang kann's ja auch nicht sein?). Kann ich das irgendwie verhindern?
    Alles Liebe und ein wunderschönes Wochenende,
    Das Laurettchen

    http://das-laurettchen.blogspot.de/

    AntwortenLöschen
  33. Vielen Dank! Perfekt für's Impressum. ♥

    http://verenaschreibt.blogspot.de

    AntwortenLöschen
  34. Dankeschön :)
    Hab danach gesucht. Ich wusste nicht, wie ich auf einer einzelnen Seite ein Kontaktformular einfügen soll.
    Auf der Startseite geht es ja mit dem Widget.. anders.. keine Ahnung :D

    DANKE !!!

    AntwortenLöschen
  35. ich finde deine bilder wirklich echt toll...

    hab vor kurzem angefangen zu bloggen und würde mich über feedback freuen :D

    mfg
    http://versuch908.blogspot.de/

    AntwortenLöschen
  36. wow hatte das kontaktformular vorher schon bevor ich hier gelesen habe aber jetzt bin ich überzeugt das es richtig ist.

    AntwortenLöschen
  37. Über Blogspot funktioniert das leider nicht mehr. Wenn ich den HTML Text einfüge und dann auf Verfassen klicke kommt nur noch ein Link zu foxyform. Gibt es eine Lösung für das Problem?
    Liebe Grüße,
    Laura von lauraskreativecke

    AntwortenLöschen
    Antworten
    1. bei mir klappt es auch nicht. Es kommt auch nur ein link zu foxyform. :-(

      Löschen
    2. Dieser Kommentar wurde vom Autor entfernt.

      Löschen
  38. Danke für dieses Tolle Tutorial, vielleicht sollte erwähnt werden, dass der
    "Do not change the code! " aus dem Text gelöscht werden, muss damit es auf Blogspot funktioniert :)

    AntwortenLöschen

Danke für dein Kommentar! Bitte beachte, dass Beleidigungen & Spam ohne Vorwarnung gelöscht werden. Bitte hab Verständnis dafür, dass wir nicht alle Kommentare beantworten können!

Falls ein Tutorial nicht funktioniert hat, dann schreibe bitte in deinem Kommentar genau, was nicht funktioniert & deinen Bloglink. So kann dir besser geholfen werden!

Du möchtest dich direkt an Mira wenden, um ein Problem zu lösen oder ein Design erstellen zu lassen? Dann schaue doch hier vorbei und melde dich!

 
Lass dir dein Blogdesign von mir gestalten!