Wagtail CMS: Adding an Email Contact Form and Landing Page

[@vineyardworker]

Point of clarification: The "email contact form" in this video is intended only to collect messages from users, correct? Not to send emails based on what was submitted by the user? You show yourself typing addresses into the from_address and to_address fields from the model, but you never mention them again. If I'm getting this right, the email field that the person filling out the form uses to put in their email address is an altogether different animal, just an HTML form field that you add in admin via the page editor-is that right? From what I can tell, the from_address, to_address, and subject fields from the model, all of which you fill out ahead of time, are behind-the-scenes-only fields used to send out emails when someone submits a message via this form. A sequel that covers that part of a contact form would be great. So far I can't find any Wagtail-specific instructions on getting those fields to work. I did find instructions for using SendGrid with Django but they seem a little off for Wagtail-I should think the Wagtail AbstractEmailForm would take care of the "send_mail..." call using the entries in those model fields, but do you need to add a send_mail method to the model?

[@kthehatter]

do you know how to get it send emails?

[@hernansaa]

thanks for the video. If you want to inset that form into other templates how would you do it? thanks.

[@kandarpprakash]

Hi Kalob this learn wagtail series of yours is superb!!! Appreciate your hardwork on this. Thanks for sharing :)

[@CodingForEverybody]

Glad you're enjoying the videos! :)

[@ramyavelchuri8557]

Hey great tut man, How do i do this? -- I need date/time to have a flexibility to display calendar type field, where user can select the date and time conveniently, -- I'm having issue with sending out email from the form..

[@kilrain_dev]

Did you end up actually implementing the signup form and also how would you go about adding it to say a footer so it can be on every page?

[@bambanx]

Thanks you for share you are awesome in slack wagtail too, i am doing the tutorial and come to my mind what is the aproach eg: the contact form is on the HomePage? Thanks you

[@yl4034]

Can you show how to add upload field in the form?

[@ranjithasanker7125]

Form is not sending to email id why?

[@brylie]

How can you do conditional form fields? E.g. showing/hiding fields based on the value of other fields.

[@CodingForEverybody]

That's a good question! The way to do this right now is to use JavaScript. So you'd use a Wagtail hook to register a custom .js file in your /admin/, and then you can write JS event listeners. To hide sections, I usually wrap a section in a MultiFieldPanel and give is a classname="hidden" (use the hidden css class you need, it might not be called `hidden`). Then then when certain fields are selected, checked or filled out then you can remove the hidden CSS class from the next section. ^ This is a very high level description, so you'll need to do some digging in the Wagtail docs, but they have examples available for you in there.

[@AlexandrStepanov-y4g]

Have you already realized this somewhere?

[@ybra1992]

Hi your videos are very good to learn wagtail have helped me a lot, I wanted to ask you if there is a way to create a template called for example contact-form.html that is a ContactPage page (like the one you created) but that can use on multiple pages? that is, using the same template in the Home footer and in another section of another page for example, I got these stackoverflow questions but it doesn't work for me. stackoverflow.com/questions/56189126/django-forms-on-every-wagtail-page-e-g-contact-form-in-the-footer-of-base-html stackoverflow.com/questions/42673180/how-can-i-add-a-form-made-by-formbuilder-to-every-page-in-wagtail stackoverflow.com/questions/56551998/how-to-have-single-form-on-multiple-pages Thank you very much again for your videos!

[@bambanx]

di you find any solution? i am looking for the same , i have my form on homepage .

[@felixsagno6965]

hellow, thank your for help i have got some error when submiting my form in my browser and i don't maybe you can have some idea about: Exception Value: 'utf-8' codec can't decode byte 0xe9 in position 1: invalid continuation byte

[@shahzeb3445]

Excellent work 👏👏👏👏👏 Can we have a page which opens up automatically (on blog page ) and asks for person's email or asks user to subscribe. ? That would be great

[@CodingForEverybody]

Yes of course you can, but that's likely going to be frontend code with the internal popup (called a Modal)

[@ardywibisana]

Keep up the good works!

[@shahzeb3445]

can you please also tell us how we can edit the data from the form page also. for eg: I want to have something like LEAD_STATUS by default which will be FRESH and operations team can start working on it so that he would INPROGRESS it and then once the ticket is solved it will be marked as DONE from the admin page only.

[@ktee55]

Is there a way to include the address filled out in the form by the person who inquired in "to_address" as well and modify the content of the email ?

[@jkojkojkojk]

The email sends every time you refresh the landing page! Any tips on where to look and fix that?

[@AlexandrStepanov-y4g]

Can an example where the contact form sends data via ajax? Thanks.

[@hayalawansah9185]

I like the flexibility of this feature a lot and that the forms can be managed and mesured by the admin, thanks Mr Kalob for this amizing series

[@douglasalves1155]

Hello In my project the stakeholder wants a contact form in all pages, in my mind I need to do a form inside a base.html. How do I make this form, I tryna do this with snippets but doesn't work nice. Someone could help me? Thanks.

[@CodingForEverybody]

You would put your form in a context processor using raw Django so it's accessible on every page.

[@ranjithasanker7125]

how to save and reset form in the same contact page

[@definty]

Wagtail is weird. You still have to learn how to code just so you can use it like a normal Online Blog.

[@CodingForEverybody]

All blogs require code. Wagtail just gives you complete control over everything, including the editing experience.

[@petrpaput]

I cant get the form to be sent to email

[@ramyavelchuri8557]

Did you figure out why?

[@nair.network4217]

Missing input command in contact form html

[@amerasiri9992]

Thanks man that was very helpful

[@CodingForEverybody]

Glad I could help :)

[@ranjithasanker7125]

@@CodingForEverybody contact form data is not sending to email how to solve this

[@rcp-zxc]

New sub for you :) Keep it up and thank you!

[@CodingForEverybody]

Cheers!