Newsletter Subscription in Shopify and connecting it to HubSpot

If you need newsletter subscription in your Shopify e-commerce, first you have to select the theme in which newsletter sign up form is available. As many Shopify themes provides a basic newsletter sign up form in the footer or right column.

But, It does nothing when you click submit button because of the newsletter sign up form is not connected to the Shopify backend.

For proper working We have to replace email signup form with this code -

{% form 'customer' %}
        {{ form.errors | default_errors }}
        {% if form.posted_successfully? %}
          <p class="form--success">{{ 'general.newsletter_form.confirmation' | t }}</p>
        {% else %}
          <div class="input-group">
            <input type="hidden" name="contact[tags]" value="newsletter">
            <label for="Email" class="newsletter__label label--hidden">{{ 'general.newsletter_form.email_placeholder' | t }}</label>
            <input type="email" value="{% if customer %}{{ customer.email }}{% endif %}" placeholder="{{ 'general.newsletter_form.email_placeholder' | t }}" name="contact[email]" id="Email" class="input-group__field newsletter__input" autocorrect="off" autocapitalize="off">
            <span class="input-group__btn">
              <button type="submit" class="btn newsletter__submit" name="commit" id="Subscribe">
                <span class="newsletter__submit-text--large">{{ 'general.newsletter_form.submit' | t }}</span>
              </button>
            </span>
          </div>
        {% endif %}
 {% endform %}

When properly connected, a newsletter sign up will be fed to HubSpot via Hubshoply and show as a conversion event. You can get it in customers section of Shopify and contacts in HubSpot.