Creating a Custom Loader

You can replace the default Memberstack loader animation with your own custom loader or loading content using the data-ms-loader attribute.

How to Add a Custom Loader

1. Add a div with the data-ms-loader attribute anywhere on your page. This will be your custom loader element.
2. Hide your custom loader div initially by setting display: none;
3. Inside the div, add your custom loader content - this can be text, images, animations, etc.
4. Memberstack will show this div instead of the default loader when opening modals.

Example

 <div data-ms-loader style="display: none"> <img src="loader.gif"> </div> 

Tips

• Use a gif or video for an animated loader.
• Make sure your loader contrasts well against the background.
• Add descriptive text or your brand logo to the loader.
• Test on mobile to make sure it looks good on all devices.

Custom loaders allow you to match the loading experience with your brand. Just add any content inside a div with data-ms-loader to customize.