Build a Custom Loader in Webflow

Article author
Duncan Hamra

You can create your own custom loader element with the attribute data-ms-loader, it will replace the default loader.



Create a Customer Loader

This can be anything you like. I recommend a fixed element so that it always appears on the screen. 

Add the MS Attribute

  1. Wrap your loader in a div and give it a classname.
  2. Select the new outermost div and add the attribute data-ms-loader or data-ms-loader="true".
  3. Set the outermost div to Display: none. 
  4. Publish your site and start testing. You may need to throttle your internet speeds to see it appear. 

This works with checkout, updating plans, signup, login, profile form, and basically* every other Memberstack event. 

* The only time Memberstack can't use your custom loader is with the native profile modal. It works just fine with custom profile forms. 

Was this article helpful?



  • Comment author
    Nicholas Platt

    So how do you implement it?

  • Comment author
    Duncan Hamra

    Hey Nicholas Platt 👋 Thank you for posting. Turns out I didn’t upload the complete article before. It's updated now ☝️


Please sign in to leave a comment.