How to build an ajax form on Shopify. See http://inside.sauce.ly/how-to-build-an-ajax-login-form-on-shopify/ for the full blog post.

enforce-http.liquid.js

/*
* Ensure the http protocol is always used on the myshopify.com domains. 
* Uses liquid to input the correct URL.
*/
if (window.location.href.match(/https:\/\/.*.myshopify.com/) && top === self) {
  window.location.href = window.location.href.replace(/https:\/\/.*.myshopify.com/, 'http://{{ shop.domain }}');
}

shopify-ajax-login.js

/*
* Try to login, check the login credentials, and then redirect if required.
*/
login(email, password).done(function (html) {  
  if (html.indexOf('Invalid login credentials') !== -1) {
    // invalid password - show a message to the user
  } else {
    
    // All good! Let's redirect if required
    var checkoutUrl = getCheckoutUrl();
    if (checkoutUrl) {
      window.location.href = checkoutUrl;
    } else {
      // don't need to redirect, do what you like! 
    }
    
  }
});

/*
* Or if you're registering a user:
*/
register(email, password, firstName, lastName).done(function (html) {
  
  // logic for registration errors
  if (html.indexOf('email is invalid') !== -1) {
     
  } else if html.indexOf('email can't be blank') !== -1) { 
    
  } else if (html.indexOf('password can't be blank.') !== -1) {
      
  }

});

/*
* Log the customer in with their email and password.
*/
function login(email, password) {  
  var data = {
    'customer[email]': email,
    'customer[password]': password,
    form_type: 'customer_login',
    utf8: '✓'
  };

  var promise = $.ajax({
    url: '/account/login',
    method: 'post',
    data: data,
    dataType: 'html',
    async: true
  });

  return promise;
}

/*
* Log the customer in with their email and password.
*/
function register(email, password, firstName, lastName) {  
  var data = {
    'customer[email]': email,
    'customer[password]': password,
    'customer[first_name]': firstName,
    'customer[last_name]': lastName,
    form_type: 'create_customer',
    utf8: '✓'
  };

  var promise = $.ajax({
    url: '/account',
    method: 'post',
    data: data,
    dataType: 'html',
    async: true
  });

  return promise;
}

/*
* Get the `checkout_url` from the URL query parameter, if it exists.
* (It only ever exists on the /account/login page)
*/
function getCheckoutUrl() {  
  function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
  }
  return getParameterByName('checkout_url');
}

Works for me! Thanks for sharing!

You can go for google.com post the topic many of topic article there you want it is easy to find your question the answer. https://www.jojothemes.com/

Registration is not working for me. i see 429 (Too Many Requests) all the time. any suggestion will be great :)

Any chance you have the http://inside.sauce.ly/how-to-build-an-ajax-login-form-on-shopify/ full blog post anywhere else. looks like the site is down, and I am running into issues with the ajax returning incorrect results. thanks!

@presto2116 http://web.archive.org/web/20150417052042/http://inside.sauce.ly:80/how-to-build-an-ajax-login-form-on-shopify/

Now ajax request returns page html instead of some info, maybe it is issue with https:// ... my site use https:// only and i cant use http:// for my pages - so the questions is how can i do ajax login with https:// and get proper respond (not plain html)

@mamun4343 The "429 (Too Many Requests)" error is caused when you try to create more than one account in a single day.

This Shopify community thread has a solution that looks to work. We're working on implementing it now: https://community.shopify.com/c/Shopify-Design/Redirect-after-customer-registration/td-p/293044/page/3

Best of luck!

I have set up the login code and at that time the code was working properly. Now I checked this code is not working.
Can anyone use this code? Is it properly working? If it's working then please share the code or provide me the solution to why it's not working from my end. This code is written status 403.