How to add first name field to newsletter signup Dawn theme?

[SunnyDaze]

I have a newsletter sign-up in the footer of all my pages and on one sign-up page that I link to. It currently just asks for email address, but I want to add a field for first name as well. I believe I'll need to edit the page.newsletter-template.json file, yes?  I am including a screenshot of that below. I'm hoping someone could tell me exactly what to type and where in order to add a mandatory first name field to it. THANK YOU!!!

[Guleria]

Hello @SunnyDaze ,

To add first name inout in footer newsletter you need to edit sections -> footer.liquid 

search for this code
<div class="field">

once find it  just before to it use this code

<div class="field">
                <input name='first-name' type='text' class="field__input" placeholder="First name" required>
                    <label class="field__label" for="NewsletterForm--{{ section.id }}">
                      First name
                    </label>
                  </div>

Regards
Guleria

[SunnyDaze]

Thank you! This worked perfectly to add the first name field in the footer.

[MR115_ShopiDevs]

Paste this code into the form inside your newsletter.liquid file, replacing the existing form or adjusting as needed

<form method="post" action="{{ routes.newsletter_subscribe_url }}" accept-charset="UTF-8" class="newsletter-form">
  <input type="hidden" name="form_type" value="customer">
  <input type="hidden" name="utf8" value="✓">

  <div class="field">
    <input
      id="NewsletterForm--first-name"
      type="text"
      name="contact[first_name]"
      class="field__input"
      placeholder="First name"
      required
    >
    <label class="field__label" for="NewsletterForm--first-name">First name</label>
  </div>

  <div class="field">
    <input
      id="NewsletterForm--email"
      type="email"
      name="contact[email]"
      class="field__input"
      placeholder="Email address"
      required
    >
    <label class="field__label" for="NewsletterForm--email">Email address</label>
  </div>

  <button type="submit" class="button">Subscribe</button>
</form>

 Please let us know if you need any further assistance.

[SunnyDaze · Accepted solution]

Thank you! This worked perfectly to add the first name field on the newsletter sign-up page.