Customize Widget Loader

Learn how to remove or change the color of the loader.

Updated over a week ago

Here you'll learn how easy it is to remove the loader or change its color. By following this step-by-step tutorial you'll learn everything you need to know. Let's do it! ๐Ÿ˜Ž

Step 1: Create your Social Widget

First thing first, choose the Social Widget you'd like to create. You'll be redirected to this page (In this case, you've chosen to create an Instagram Widget).

Once you're here, click on the selected widget's "Create" button. An Editor menu will appear to customize the widget to your liking.


Step 2: Settings

As you can see, we provide several configuration options. Just have fun exploring all the options and when you're done, click on the "INSTALL" button.


Step 3: Copy Code

If you haven't Logged In yet, now it's time to do so. Once you're logged in click on the "COPY CODE" button.


Step 4: Change the Loader's Color

In order to change to loader's color, you must add the following CSS code to the code you previously copied into your Custom HTML:

<style>  .my-class{    background-color: brown !important;   }  .my-class div{    border-color: #bd7882 !important;   }</style><div data-mc-src="f14d6592-64ae-4d35-8c53-8e34b5d7b2cf" data-mc-loader="my-class"></div><script  src="" async="" data-usrc=""></script>


When your widget is finally loaded on the webpage, it will be displayed with the selected color:


Step 5: Remove Loader

To remove the loader from your webpage, you must add the following code to the code you previously copied and pasted into your Custom HTML:


inside the <div ></div>


When your widget is loaded on the webpage, the loader will no longer be displayed:


And that's it: CONGRATULATIONS! Now you're ready to maximize your content ๐Ÿ˜Ž

If you've got any questions ไธ€ really, any ไธ€ don't be shy and just give a call out at our Support Chat or contact us at [email protected], we'll be more than happy to help you!

Did this answer your question?