Capture VAT numbers on Customer account page

You can add the VAT number field to the customer account page. This will allow your customers to set or update their VAT registration numbers once they log in to their customer account.

Shopify customer account page VAT number

Example of a customer account page with the VAT number field

VAT numbers will be stored as part of customer notes. Sufio will automatically validate these VAT numbers and set business customers as tax exempt when applicable. Customer VAT numbers will also be included on your invoices.

To add the VAT number field to the customer account page:  

  1. Go to the page Online Store → Themes in your Shopify admin. 
  2. Click the Actions button, then click Edit code. 
  3. Select customers/account.liquid in the left sidebar. If you do not see such a file in your theme, check this document from Shopify. 
  4. Insert the following code snippet inside the template file. A good place for the field is just after the customer default address section. 

<!-- Shopify customer account -- capture and validate VAT numbers and set business customers as tax exempt when applicable. Used by Sufio for Shopify (www.sufio.com/shopify). -->
<div class="vat-number-display">
  {% if customer.metafields.sufio.vat_number %}
    VAT Number: {{ customer.metafields.sufio.vat_number }} 
    <br />
    <a href="#" class="vat-edit-link">Edit</a>
  {% else %}
    <a href="#" class="vat-edit-link">Add VAT number</a>
  {% endif %}
</div>

<div class="vat-number-form" style="display:none">
  <form>
    <label for="vat_reg_no">VAT Registration Number</label>
    <input class="vat_reg_no" type="text" name="customer[note][VAT Registration Number]" placeholder="VAT Registration Number" value="{{ customer.metafields.sufio.vat_number }}" />
    <input type="submit" value="Save" class="btn">
  </form>
</div>

<script type="text/javascript">
  document.addEventListener("DOMContentLoaded", function(event) {
    $('a.vat-edit-link').click( function() {
      $('.vat-number-display').hide();
      $('.vat-number-form').show();
      return false;
      });

    $('.vat-number-form form').submit( function() {
      var vat_reg_no = $('input.vat_reg_no').val();
      $.ajax({
        type : "GET",
        dataType: "jsonp",
        url: "/apps/sufio/customer-vat/",
        data: { email: "{{ customer.email }}", vat_no: vat_reg_no, update: true },
        success: function(data) {
          location.reload();
        }
      });

      return false;
    });
  });
</script>

Note

Please note that to make VAT exemptions work, you need to enable the VAT exemptions feature in your Sufio account.

Need help?

Do you need help with updating your store theme? Contact one of Shopify Expert partners who will be happy to assist you. 

Invoices for Shopify stores in the EU

Let Sufio automatically send invoices and receipts for every order made in your store.

Get Sufio - Invoices for EU stores from the Shopify App Store

Get Started