Contact Form 7 Tutorial

Contact Form 7 Tutorial

Share
Tweet
Share
Pin
Learn step by step how to create simple and advanced forms on your wordpress website using Contact form 7. I will show you how to place a form on your website in minutes and how to create an advanced form from scratch. We will talk about setting up the contact form message that you receive when someone submits their form and how to create a confirmation email for the person that submits the form. After that I show you how to enable Google ReCaptcha so spammers can not misuse the form. After that I show you how to style the form with a free tool and how to style the form with a paid tool. Last but not least I show you how to copy and past your form and the settings to a different WordPress website.

Hide the ReCaptcha Logo

.grecaptcha-badge{
	visibility: collapse !important;  
}
Share
Tweet
Share
Pin

26 thoughts on “Contact Form 7 Tutorial”

  1. hello fredy
    are you putting the scripts ready when you record your video? Do you face any difficulty when record the video with long period with all remember steps? I wish i could learn from you and do you provide coarching?

      1. Hello Fredy,
        I must say I love your tutorials they are so helpful and clear, I do have something that I would like to know if you can help me with if this is you then please contact me on bmasters150665@gmail.com, I say this as there are other people that I think are impersonating you on line I hope to hear from you soon.

        Regards
        Brett

      2. Hoi Ferdy
        Ik wil u vragen.
        Hoe gebruik je een afbeeldimg voor je webshop os ecommerce moet je alleen een afbeelding plaatsen op jou ecommerce van google ik begrijp diet niet en als je die afbeelding plaatst en klanten kopen die ding hoe gaat dan naar die klanten je heb toch niet fysiek producten

  2. PETER MOFOLORUNSHO

    Hi Ferdy,

    I must say that you are an amazing teacher. Thanks for sharing your knowledge with us.
    I would like to ask a question, I have a contact form with a space for visitors to the site to upload files, (scanned pictures or documents). To View the document or picture I have to login to the back end of WP and download it. Is there any other way I can retrieve the document or picture without logging in to the back end?

    Thank you

  3. Hi Ferdy,
    I added the contact form to my site without any problems. I filled out the information to submit a trial form to try the form I added, but whatever I do, every time I try “There was an error sending your message. Please try again later.
    “I get the answer. Please help.

  4. Your lectures are very helpful and easy to understand. I would like to ask a question. I have a contact form.Kindly guide me, how I restrict phone no in international format(+1 447-474-4200) in Divi Theme.

  5. Hi Ferdy,
    As a very green student, I am enjoying your youtube videos immensely.
    Would you please answer two questions regarding WooCommerce/WordPress?
    1. Why do you not use the Accounts Page when setting up your store? (Why do you delete it after you create all the pages?)
    2. How do I fix the glitch with the Attribute Name on the Product Page? In other words, after I create the Attribute Name and I can see it in the dashboard, why does it not appear on the website page?

  6. Die css code die ik plak werkt niet of laat het grecaptcha logo niet verdwijnen of is dat alleen bij de pro versie

  7. Hi Ferdy.

    Once more, an excellent video! And very helpful…
    About Terms and Disclaimers, what do you use to generate them?
    Any suggestion?

    Thank you.
    And keep up the good work.

    Pett

  8. Hi Ferdy,

    I have successfully created a contact form with Contact Form 7, however the email that is sent has “Worpdress” as the sender instead of the site name. This automatically ends up in the spam box. Is there any way to fix this?

  9. Hey,

    I see website and it’s impressive. I wonder if the content or banners advertising options available on your site?
    What will be the price if we would like to put an article on your site?

    Note: Article must not be any text like sponsored or advertise or like that

    Cheers
    Devin Kench

  10. Ik heb een website gemaakt met behulp van je tutorial. Maar heb een probleem met Contact Form 7. IK heb een invulveld waar geboortedatum opgeven moet worden met de Nederlandse notatie, dd-mm-yyyy. Maar in de mail die verstuurd wordt staat de datum in yyyy-mm-dd.
    Ik kan nergens een oplossing vinden om dat te veranderen.

    1. Contactform7 datum formaat:
      ==========================
      Het datumveld kan worden aangepast in de e-mail waarin deze verstuurd wordt. Hieronder een voorbeeld.

      Datum veld: [data date-input]
      Ingave: 06-09-2021 als voorbeeld.

      In de e-mail tab:
      No Format: [date-input]
      Format 1: [_format_date-input “D, d-M-Y”]
      Format 2: [_format_date-input “l, d-F-y”]
      Format 3: [_format_date-input “D, d-m-y”]
      Format 4: [_format_date-input “j-n-y”]
      Format 5: [_format_date-input “d-m-Y”]
      ————————————

      Dit is het resultaat in de e-mail:
      No Format: 2021-09-06
      Format 1: ma, 06-sep-2021
      Format 2: maandag, 06-september-21
      Format 3: ma, 06-09-21
      Format 4: 6-9-21
      Format 5: 06-09-2021
      ===================================
      Succes.
      Groet, PvdZ

    2. Wil.
      Ik had al eerder gereageerd maar denk dat de oplossing niet is aangekomen.
      Het is wel mogelijk om de weergave van het ingegeven datum-veld binnen Contactform-7 aan te passen.
      Hieronder een overzicht van de mogelijkheden.

      Contactform7 datum formaat:
      ==========================
      Datum veld: [data date-input]
      Ingave: 06-09-2021 als voorbeeld.
      No Format: [date-input]
      Format 1: [_format_date-input “D, d-M-Y”]
      Format 2: [_format_date-input “l, d-F-y”]
      Format 3: [_format_date-input “D, d-m-y”]
      Format 4: [_format_date-input “j-n-y”]
      Format 5: [_format_date-input “d-m-Y”]
      ————————————
      Let op: voor en achter “_format_” staat een underscore!

      Dit is het resultaat in de e-mail:
      No Format: 2021-09-06
      Format 1: ma, 06-sep-2021
      Format 2: maandag, 06-september-21
      Format 3: ma, 06-09-21
      Format 4: 6-9-21
      Format 5: 06-09-2021
      =============================
      Succes.
      Groet, Piet van der Zanden.

  11. Ferdy,

    Allereerst complimenten m.b.t. je uitgebreide en groot aantal tutorials.
    Ik heb er veel van kunnen leren.

    Als je weer eens een update voor het “Contact Form 7” zou gaan maken dan een paar zaken die mogelijk handig zijn te vermelden.

    Na installatie van de Essential Addons van Elementor komt er bij EA een “Contact Form 7” element bij.

    Dus op de gebruikelijke manier plaatsen op je pagina en de naam van je contact formulier kiezen.
    Het is dus niet meer nodig de link te plaatsen.
    Bovendien kan ook de gehele opmaak via de gebruikelijke instellingen van dit element worden gedaan zodat je het formulier helemaal aan eigen smaak en huisstijl kan aanpassen.
    Je kan ook een kop en andere begeleidende teksten toevoegen. (zie bijlagen)

    Ook mogelijk wat aandacht aan de velden Cc: en Bcc: in de Mail-tab / Aanvullende koppen. Ik zelf gebruik deze regelmatig om als beheerder en centrale coördinator te zien of alles werkt zoals verwacht.
    Wat ik ook gebruik is natuurlijk de “Flamingo” plugin omdat CF7 niets aan logging doet.

    Ook is het mogelijk bij b.v. een checkbox zowel de beschrijving als een e-mail op te geven “ sales|ferdy@abcd.nl“

    Voorbeeld:
    Formulier:
    Kies een afdeling (*)
    [checkbox* Afdeling “Verkoop|ferdy@abcd.nl”
    “Fotografie|studio1@abcd.nl”
    “Web Design|webmasters@abcd.nl”]
    Email:
    Aan: [Afdeling]

    Bericht inhoud:
    Afdeling naam: [_raw_Afdeling]
    Afdeling email: [Afdeling]

    Mogelijk gaat dit laatste wat te diep en mogelijk kende je deze mogelijkheid al wel.

    Ik zou zeggen succes met je projecten.

    Groet, Piet van der Zanden.
    Helaas geen bijlage mee kunnen sturen:

  12. JAPHETH OKONJI

    Hello. how can I reach you on a call? I want o build a Facebook social media alternative, what does it cost to build it?

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top