Shopify Custom Email Module

Question

How can I pass the variable data from Shopify form ( I made a template for a page with a form inside that ask customer to choose one product & put name, email, address and more ) to be send in as email? Is it possible to get the data then pass it to some third party apps like Mailchimp and that 3rd party app will send it via email to the customer containing the data?

To make it short, my question is: How to create custom form then pass data in an email to be sent to the customer?

Hi, You can use javascript / ajax to submit the form data to a third party app when the form will be submitted. give me your form url and i will try to help . — Mash R.
@MashR. Thanks for the comment! I'll try to reach you via skype. Thank you! — Nikko Parin

Mash R. Mash R. · Accepted Answer · 2016-05-27T02:48:03

I have used a customized ajaxchimp jquery plugin to integrate shopify contact form with mailchimp.

{% form 'contact' %} {% comment %} Successful message {% endcomment %} {% if form.posted_successfully? %}
<p class="note form-success">
  {{ 'contact.form.post_success' | t }}
</p>
{% endif %} {{ form.errors | default_errors }}

<div class="grid grid--small">
  <div class="grid__item large--one-half">
    <label for="ContactFormName" class="hidden-label">{{ 'contact.form.name' | t }}</label>
    <input type="text" id="ContactFormName" class="input-full" name="contact[name]" placeholder="{{ 'contact.form.name' | t }}" autocapitalize="words" value="{% if form.name %}{{ form.name }}{% elsif customer %}{{ customer.name }}{% endif %}">
  </div>

  <div class="grid__item large--one-half">
    <label for="ContactFormEmail" class="hidden-label">{{ 'contact.form.email' | t }}</label>
    <input type="email" id="ContactFormEmail" class="input-full" name="contact[email]" placeholder="{{ 'contact.form.email' | t }}" autocorrect="off" autocapitalize="off" value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}">
    <input type="hidden" id="ContactFormHidden" name="contact[email]" value="{% if form.email %}{{ form.email }}{% elsif customer %}{{ customer.email }}{% endif %}">
  </div>
</div>

<label for="ContactFormPhone" class="hidden-label">{{ 'contact.form.phone' | t }}</label>
<input type="tel" id="ContactFormPhone" class="input-full" name="contact[phone]" placeholder="{{ 'contact.form.phone' | t }}" pattern="[0-9\-]*" value="{% if form.phone %}{{ form.phone }}{% elsif customer %}{{ customer.phone }}{% endif %}">

<label for="ContactFormMessage" class="hidden-label">{{ 'contact.form.message' | t }}</label>
<textarea rows="10" id="ContactFormMessage" class="input-full" name="contact[body]" placeholder="{{ 'contact.form.message' | t }}">{% if form.body %}{{ form.body }}{% endif %}</textarea>

<input type="submit" class="btn right" value="{{ 'contact.form.send' | t }}">
<label for="mc-email"></label>
{% endform %} 

{{ 'mailchimp.js' | asset_url | script_tag }}

<script>
  $('#ContactFormEmail').change(function() {
    var email = $(this).val();
    $('#ContactFormHidden').val(email);
  });
</script>

<script>
  $('#contact_form').ajaxChimp({
    url: 'https://cyberite.us4.list-manage.com/subscribe/post?u=858232f1e77dc411cb2405b5f&id=502f26188f',
  });
</script>

Shopify Custom Email Module

1 Answers