Placeholder & Loading

Learn about how to add a loading design to your feeds

1.0. Loading Attribute

The Loading Attribute enables you to display a custom design while your content is loading, enhancing the user experience. This feature is ideal for showing a tailored skeleton UI or a simple loading spinner as your data is being fetched.

Setting up the Pre-loader:

1. Add Your Design: Create your pre-loader design within the FeedSpring wrapper.

2. Apply the Attribute: Add the attribute feedspring="loading" to your pre-loader element. This element will be shown to users while the content is being loaded.

3. Ensure Smooth Transition: To prevent layout flashing when the page starts loading, set the display of the post elements to display: none.

4. Set the Appear Style: Add the appear style (e.g., display: flex or display: block) to your post element to specify how it should display once the loading has finished.

With these steps, your feed will display the loading state initially, then smoothly transition to the live content once the data has finished loading.

As of version 1.3.4, the attribute value loading has replaced the previously used placeholder. The placeholder attribute is no longer supported in this and future versions.