# How to create a newsletter subscription form using Uniform & Mailchimp?

**URL:** <https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677>\
**Category:** Questions\
**Tags:** v2\
**Created:** [March 24, 2016, 7:28pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677 "2016-03-24T19:28:30Z")\
**Posts on this page:** 8\
**Page:** 2

<div class="post-metadata">

**Author:** ![rhawbert](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/rhawbert/32/586_2.png) [@rhawbert](https://forum.getkirby.com/u/rhawbert)\
**Post date:** [April 4, 2016, 10:43pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/21 "2016-04-04T22:43:37Z")

</div>

> [@mzur](#):
>
> You usually want just one endpoint for a form submission, like api/newsletter/subscribe. Can you explain why you configured the route like that?

Tried to do what you’ve said but the problem remains… grandchildren pages gets the following error on submit:

```php
 ! Fatal error: Uncaught No Uniform actions were given.
 thrown in /Users/me/Sites/masite/site/plugins/uniform/lib/UniForm.php on line 126

```

---

<div class="post-metadata">

**Author:** ![mzur](https://avatars.discourse-cdn.com/v4/letter/m/b782af/32.png) [@mzur](https://forum.getkirby.com/u/mzur)\
**Post date:** [April 6, 2016, 8:35am UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/22 "2016-04-06T08:35:19Z")

</div>

> [@rhawbert](#):
>
> for this form only, is there a way to show custom error messages for email validations (empty or invalid) instead of the default one?

Yes, the messages are defined in the [language files](https://github.com/mzur/kirby-uniform/tree/d67960233a1a8b1b6963a2505280b8e301b241bb/uniform/languages):

```php
l::set('uniform-fields-required', 'Please fill in all required fields.');
l::set('uniform-fields-not-valid', 'Some fields do not contain valid data.');

```

This affects all forms on the whole site, though. If you have multiple forms and only one of them should have different messages you have to do a little hack: You have to change the language strings in the controller/route just before the `uniform()` call and then reset them again afterwards.

> [@rhawbert](#):
>
> Tried to do what you’ve said but the problem remains…

And this error doesn’t occur if you use the `(:all)/newsletter/subscribe` route? This doesn’t make sense 😕  
The route is working properly since Uniform is called but an error like that is only thrown if the `actions` array is misconfigured/empty. Did you change anything in the route besides the pattern?

---

<div class="post-metadata">

**Author:** ![rhawbert](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/rhawbert/32/586_2.png) [@rhawbert](https://forum.getkirby.com/u/rhawbert)\
**Post date:** [April 6, 2016, 5:47pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/23 "2016-04-06T17:47:38Z")

</div>

> [@mzur](#):
>
> […]  
> You have to change the language strings in the controller/route just before the uniform() call and then reset them again afterwards.

I ended up using jquery to show these different messages… not ideal but it’ll do till I figure out how to do this… because this site isn’t multilang so I’ve modified `UniForm.php` to use c::get instead of l::get… and defined those text messages in the config file.

* * *

> [@mzur](#):
>
> And this error doesn’t occur if you use the (:all)/newsletter/subscribe route? This doesn’t make sense 😕

No… it works perfectly.  
I also don’t know why.

* * *

> [@mzur](#):
>
> Did you change anything in the route besides the pattern?

Absolutely nothing… these subpages/grandchildrem… they have another form that uses Uniform… but I’ve checked their vars and no naming conflict.

Here’s the whole form/jquery and the router:

```html

<section class="newsletter">

  <form id="newsletter" method="post">

    <input type="hidden" name="_submit" value="<?php echo uniform('newsletter-subscription')->token() ?>">
    <label class="hidden form__potty" for="website">Please leave this field blank</label>
    <input type="text" name="website" id="website" class="hidden form__potty" />

    <div class="hidden" id="feedback">
      <div class="feedback-message">Sending...</div>
    </div>  

    <p>
      <label class="hidden" for="email">Email *</label>
      <input type="email" name="_from" id="email" value="" placeholder="Email" required />
    </p>

    <p>
      <button type="submit">Sign up</button>
    </p>

  </form>
</section>

<script>
    // AJAX FORM PROCESSING
    $('#newsletter').on('submit', function(e){

        e.preventDefault();
        var form = $(this); 
        var feedback = $('#feedback');
        feedback.removeClass('hidden').slideDown('slow');
        feedback.find('.feedback-message').html('Sending...');

        $.ajax({
            type: 'POST',
            // use the same url here as the 'pattern' in your route
            url: '<?php echo $page->url() ?>/newsletter/subscribe',
            data: form.serialize(),

            // this success means the ajax call reached the api/action
            success: function(response){ 

              if (response.success) { // show messages from mailchimp action 
                var msg = "<b>Thank you</b> <br>"; 
                msg += response.message;
                feedback.find('.feedback-message').html(msg); 

                form.find('#email, button').prop('disabled', 'disabled');

              } else { // a validation error was encountered 
                var msg = "<b>Oops</b> <br>"; 
                msg += "This email looks wrong.";
                feedback.find('.feedback-message').html(msg);
              }

            },
            // the form was unable to reach processor api
            error: function(response){
              feedback.removeClass('hidden');
              feedback.find('.feedback-message').text('An error has occurred.');
            },
            dataType: 'json'
        });

        $('html,body').animate({
            'scrollTop': $('#newsletter').offset().top
        }, 400);
    });
</script>

```

The router:

```php
array(
    // in 'pattern', enter the same url being called from your ajax javascript function
    'pattern' => '(:all)/newsletter/subscribe',
    'method' => 'POST',
    'action' => function() {

      // check whether this is an ajax request, and respond with an error if it isn't
      if (!kirby()->request()->ajax()) return site()->errorPage();

      $newsletter = uniform('newsletter-subscription', [
         'required' => [
            '_from' => 'email'
         ],
         'actions' => [[
            '_action' => 'mailchimp',
            'api_key' => 'xxxxxxxxxxxxxxxxxxxxx-us6',
            'list_id' => 'xxxxxxx', 
         ]]
      ]);

      // get the names of all erroneous fields
      $errors = array_keys(array_filter(get(), function ($field) use ($newsletter) {
         return $newsletter->hasError($field);
      }, ARRAY_FILTER_USE_KEY));

      return response::json([
         'success' => $newsletter->successful(),
         'message' => trim($newsletter->message()),
         'errors' => $errors,
      ]); 

    }
  )

```

---

<div class="post-metadata">

**Author:** ![mzur](https://avatars.discourse-cdn.com/v4/letter/m/b782af/32.png) [@mzur](https://forum.getkirby.com/u/mzur)\
**Post date:** [April 7, 2016, 4:23pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/24 "2016-04-07T16:23:38Z")

</div>

So everything works as expected now?

---

<div class="post-metadata">

**Author:** ![rhawbert](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/rhawbert/32/586_2.png) [@rhawbert](https://forum.getkirby.com/u/rhawbert)\
**Post date:** [April 8, 2016, 8:44pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/25 "2016-04-08T20:44:46Z")

</div>

Yes indeed Martin… again, thanks a lot for all your help. 🖖

---

<div class="post-metadata">

**Author:** ![Malvese](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/malvese/32/12375_2.png) [@Malvese](https://forum.getkirby.com/u/Malvese)\
**Post date:** [April 9, 2016, 8:04am UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/26 "2016-04-09T08:04:42Z")

</div>

Wow, epic thread!  
The resulting code would make for a great “how-to” post 🙂

---

<div class="post-metadata">

**Author:** ![rhawbert](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/rhawbert/32/586_2.png) [@rhawbert](https://forum.getkirby.com/u/rhawbert)\
**Post date:** [April 13, 2016, 1:51pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/27 "2016-04-13T13:51:40Z")

</div>

Thanks @Malvese, I’ll try to do something like @luxlogica did [here](https://forum.getkirby.com/t/tutorial-on-form-validation-emailing/800/12?u=rhawbert).

It was hugely helpful.

---

<div class="post-metadata">

**Author:** ![distantnative](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.getkirby.com/distantnative/32/11319_2.png) [@distantnative](https://forum.getkirby.com/u/distantnative)\
**Post date:** [February 6, 2025, 4:59pm UTC](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677/28 "2025-02-06T16:59:47Z")

</div>



[Previous page](https://forum.getkirby.com/t/how-to-create-a-newsletter-subscription-form-using-uniform-mailchimp/3677.md?page=1)